‘복잡한’코드 작성을 시작하는 방법

이것은 당신이 작성하는 코드에 대해 생각에 대한 게시물입니다. 여기에 포함 된 모든 것은 내 의견이며,당신은 항상 더 나은 사람과 비교하여 내 의견의 유효성을 고려해야합니다! 내가 사용할 언어는 자바 스크립트입니다. 이 기사를 이해하기위한 전제 조건은 중간 자바 스크립트를 알고 일부 객체 지향 개념에 익숙해지는 것입니다. 이 게시물은 크리스티나 로페스의 훌륭한 책”프로그래밍 스타일의 연습”의 9 장에서 영감을 얻었습니다.

코드에서 정말 일반적인 패턴은—

  1. 간단한 객체 정의
var store_item = {
name : 'wonderball'
}

2. 그런 다음 웹 페이지에 표시 할 준비를하기 위해,우리는 몇 가지 기능을 통해 각 속성을 실행합니다.

addExclamationPoint(store_item);
capitalizeName(store_item);function addExclamationPoint(item) {
item.name = item.name + '!';
}function capitalizeName(item) {
// some code to capitalize item.name, cut out for brevity.
}

그리고 이것이 우리가 종종 데이터를 표시 할 준비가되는 방법입니다. 이제 우리의 상점_항목은 대문자 이름과 느낌표를 가지고,우리는 우리의 웹 페이지에 아무 문제를 표시 할 수 있습니다. 우리가해야 할 세 번째 일이 있다면 우리는 단순히 데이터를 변환하는 세 번째 함수를 작성하고 평소와 같이 항목을 전달합니다.

우리가 여기에서 만든 더 크고 큰 그림 패턴은:

이러한 유형의 프로그래밍에는’절차 적’또는’필수적’과 같은 몇 가지 멋진 용어가 있지만’단순’이라는 다른 용어라고 부릅니다. 그것은 매우 간단한 프로그래밍입니다. 모두가 먼저 배우는 프로그래밍 유형입니다. 작은 규모의 프로그램에 대 한 그것은 절대적으로 프로그램,가장 좋은 방법은 인간이 1 에서 10 논리 단계를 아주 잘 어디에서 든 지 다음에 좋은 때문에.

프로그램이 충분히 커지거나(데이터가 표시되기 전에 10 개 이상의 변환)함수가 많은 데이터 객체(2 개 이상)를 수정하거나 분기 논리를 유발하는 문장이 많으면’간단한’프로그래밍이 대신’엉망’이됩니다.

대부분의 모든 프로젝트 또는 코드 조각이 지저분 해집니다. 프로그래밍의 대부분은 실제로 데이터를 표시하는 실제 문제에 대한 해결책이 아니라 혼란을 피할 수있는 방법을 생각해내는 코더입니다. 프로그래밍의 작업은 100 의 변환을 100 의 데이터 조각에 적용하고’엉망이 아닌’것으로 만들 수있는 방식으로 코드를 작성하는 법을 배우는 것입니다.

이제,위의 패턴에 큰 변화를 소개하고,내가 당신을 보여 주려고하는 것은’간단한’코딩에서 당신을 나누기 때문에 고급 코더가되는 첫 번째 단계라고 생각해 보자. 그것은 웹 페이지에 대한 일부 데이터를 수정하는 것과 같은 간단한 일을하는 방법에 대해 생각하는 새로운 방법을 소개합니다. 객체는 이제’바인딩’이라는 자체 함수를 가지며 그 함수는 데이터 변환을 담당합니다.

var store_item = {
name: 'wonderball',
bind: function(func) {
this.name = func(this.name);
return this;
}
}// Here are two functions I'll use to transform the store_item.name, each one now just takes a name and modifies it, neither function has any clue what properties it's changing in store_item anymore.function capitalize(name) {
return name.replace(/\w\S*/g, function(txt) {
return txt.charAt(0).toUpperCase() +
txt.substr(1).toLowerCase();
});
}function addExclamationPoint(name) {
return name + '!';
}store_item.bind(addExclamationPoint).bind(capitalize);

이 솔루션은 위의 원래’간단한’코드와 정확하게 작동하지만 더 복잡해 보입니다. 우리가 가진 간단한 작업 때문에,그것은 과잉이지만,이 복잡성의 트레이드 오프는 무엇인가?

그 대답을,의 다른 무엇에 대해 이야기하자:

  1. 우리는이 미친,이상한,’바인딩’함수,즉 인수,이름에 대한 새로운 값이 아니라,대신 다른 함수로 소요,지금 무슨 말?
  2. 대문자 및 추가 클램 포인트 함수가 다릅니다.item.name 직접 더 이상.
  3. 우리는 더 이상’=’로 이름을 설정하지 않고 대신이 이상한 상점 항목을 사용합니다.바인드(함수_이름),대신 구문.

이 세 가지 차이로 우리는 이제 스스로에게 물어야합니다.이 변화가 더 낫습니까? 이 프로젝트가 이렇게 작다면 아닐 수도 있다. 프로젝트가 훨씬 더 커지면 어쩌면 그렇습니다.

중요한 변경 사항은 저장소 _항목 객체가 바인드 함수를 통해 상태를 처리한다는 것입니다. 물론 당신이 원한다면,당신은 직접 변경할 수 있습니다 store_item.name,하지만 객체는 실제로 비명을 지르고있다:”이봐,내 바인드 함수를 사용하여 나를 바꿔라!”.

하지만 이제는 여러 저장소 항목이 각각 고유 한 상태로 자신의 상태를 관리하는 패턴을 쉽게 볼 수 있습니다.바인딩 기능:

// Three store items, each one with a different state.store_item1.bind(addExclamationPoint).bind(capitalize); //Wonderball!store_item2.bind(capitalize);
//Wonderballstore_item3.bind(addExclamationPoint);
//wonderball!

우리는 100 개의 상점을 만들고 그들의 상태를 아주 쉽게 관리 할 수 있습니다. 우리가 해야 할 일은 단지 반환 값을 가진 함수를 작성하고 우리의 객체를 사용하는 것입니다.바인딩 기능.

이 패턴의 마법은 바인딩 함수에 있으므로 이제 조금 더 살펴 보겠습니다.

// 1. First define the function, and have it take as an argument another function. Taking a function as an argument, instead of data is the core change here. bind: function(func) { // 2. This second line is the secret sauce, it will run the function you passed in with 'this.name' as an argument, and then assign whatever value is returned to this.name. Mull this over. this.name = func(this.name);// 3. Finally, return 'this'. You don't have to have this step in here, but returning 'this' is what allows .bind chainging to happen (.e.g. doing .bind().bind() vs .bind(); .bind();) return this;
}

그래서 당신은 그것을 가지고,우리는 우리의 코드를 더 복잡하게 만들었지 만,이제 우리는 몇 가지 새로운 이점이 있습니다:

  1. 객체는 이제 자신의 상태를 수정하며 한 줄로 크게 수행 할 수 있습니다.
  2. 우리가 작성한 함수는 순수하다,그들은 위의 예에서와 같은 객체 속성을 수정하지 않습니다,그들은 단지 입력을 받아 출력을 반환.
  3. 우리는 객체의 상태를 수정할 때 우리가 사용하는 함수가 실수로

다른 객체의 상태를 수정하지 않을 것이라는 것을 알고 있지만 몇 가지 단점도 있습니다:

  1. 당신의 코드는 이제 새로운 사람에게 덜 직관적입니다.
  2. 소규모 사이트의 경우 이 코드가 지나치게 복잡합니다.

그래서 최종 판단은 무엇입니까? 더 나쁜? 더 혼란 스럽습니까? (처음에는 그렇습니다.)이 모든 질문은 열려 있지만,이와 같은 패턴을 고려하고 이해하는 것은 자바 스크립트를 배우고 코더로 성장하는 일부라고 확실히 말할 수 있습니다. 문제를 해결하기 위해’간단한’코딩 방법을 지속적으로 사용하는 것은 잠시 후에 지속 불가능 해집니다. 당신이 일을 더’복잡한’방법을 배울 수있는 시간이 걸릴 경우 큰 일들이 많이 발생:옆으로 생각하는 능력이 열립니다,당신은 코드의 더 다양한 유형을 읽을 수 있습니다,당신은 당신이 문제를 해결에 대해 생각할 수있는 방법을 증가. 어쩌면 그것이 이것과 다른 패턴을 배우는 데 도움이되는 진짜 일 것입니다.

답글 남기기

이메일 주소는 공개되지 않습니다.