[JavaScript] 자바스크립트 핵심 가이드 (1장 ~ 4장) - 1/3

개요

자바스크립트의 마스터라고 불리는 더그라스 크락포드가 집필한 서적이다. 자바스크립트 언어에 대해서 제대로 공부를 하려고 하면 이 책은 한번 정도 읽어두어야 한다. 

책 소개

자바스크립트를 우수한 객체지향 언어로 만들 수 있는 장점을 담았다. 장점인 함수, 느슨한 변수 타입 검사, 동적 객체, 객체 리터럴 표현식 등과 대표적인 단점인 전역변수에 근거한 프로그래밍 모델 등을 피하는 방법을 다룬다. 장단점을 비교해 자바스크립트 언어의 단점은 피하고 장점은 살리는 코드 작성을 익힐 수 있다.

 

저자

더글라스 크락포드 (Douglas Crockford)

2008년 야후! 에서! 선임 자바스크립트 아키텍트로 일한다. JOSN(JavaScript Object Notation) 형식을 창안한 사람으로 잘 알려졌으며 콘퍼런스에서 자바스크립트의 고급 주제들에 대한 강연을 정기적으로 진행하고 ECMAScript 위원회에도 참여한다. 

 

1장 자바스크립트의 좋은 점들

    대부분의 프로그래밍 언어에는 좋은 점과 나쁜 점이 있다.

    표준을 제정하는 위원회가 언어의 나쁜 점을 제거하기는 어렵다.

    언어의 좋은 점만을 사용함으로 좀 더 나은 프로그램을 작성할 수 있다.

    자바스크립트는 일반적으로 생각하는 것보다 좋은 점이 상당히 많다.

 

01 왜 자바스크립트인가? 

    자바스크립트는 웹 브라우저의 언어이기 때문에 가장 유명하고 중요한 언어 중 하나다.

    자바스크립트는 여타 다른 언어들과 다른 점이 많기 때문에 상당히 저평가돼 있다.

    언어 자체에 대해 많이 모르거나 프로그래밍에 대해 잘 몰라도 원하는 작업을 쉽게 할 수 있다.

 

02 자바스크립트 분석

    좋은 점에는 함수, 느슨한 타입, 동적 객체, 표현적인 객체 리터럴 표기법 등이 있다.

    자바스크립트 함수는 어휘적 유효범위를 가진 일급 객체다.

    자바스크립트는 C의 옷을 입은 Lisp 라고 할 수 있다.

 

    느슨한 타입 체크에서 발견한 것은 오류 찾기의 어려움이 아니라 자유로움이다.

    자바스크립트는 매우 강력한 객체 리터럴 표기법이 있다.

    자바스크립트는 프로토타입에 의한 상속이다.

    자바스크립트는 매우 경량화돼 있으며 표현적이다.

 

    최상위 레벨의 변수들은 모두 전역객체라 불리는 공용 이름 공간에 위치하게 된다.

    자바스크립트라는 언어를 잘 사용하기 위해서는 이 언어의 한계점을 잘 알아야 한다. 

    자바스크립트는 모순이 많은 언어이기도 하다.

 

2장 자바스크립트의 좋은 문법들

01 공백(whitespace)

    공백은 문자를 구분하는 형태나 주석의 형태를 취할 수 있다.

    가능하면 /**/를 사용하는 대신 //를 사용할 것을 권한다.

 

02 이름(Names)

    예약어 이름은 사용할 수 없다.

    undefined, NaN, Infinity 도 예약어에 포함돼야 하지 않을까?

 

03 숫자(Numbers)

    내부적으로 숫자는 64비트 부동 소수점 형식을 지닌다.

    자바스크립트는 다른 언어와 달리 정수와 실수 구분이 없다

    NaN은 수치 연산을 해서 정상적인 값을 얻지 못할 때의 값이다. isNaN()

 

04 문자열(Strings)

    유니코드가 16비트 문자셋이었을 때 개발했기에 모든 문자는 16비트 유니코드이다.

    문자열은 length라는 속성이 있고 문자열은 불변(immutable)이다.

 

05 문장(Statements)

    웹 브라우저에서 각각의 <script> 태그는 컴파일되어 실행되는 하나의 컴파일 단위다.

    자바스크립트는 Linker가 없기 때문에 모든 문장을 공통적인 전역이름공간에 몰아 넣는다.

 

    자바스크립트에서 블록은 새로운 유효범위를 생성하지 않는다.

    자바스크립트에서는 false, null, undefined, "", 0, NaN 이외의 모든 값은 참이다.

 

06 표현식(Expressions)

    리터럴 값(문자열이나 숫자), 변수, 내장 값들(true, false, null, undefined, NaN, Infinity)

    new 키워드 호출 표현식, delete 키워드 세부지정 표현식, 괄호로 쌓인 표현식, 전치연산자.. 

 

07 리터럴(Literals)

    객체 리터럴은 새로운 객체를 생성할 때 편리한 표기법이다.

    객체의 속성명은 반드시 컴파일 시에 알려져야 한다.

 

08 함수(Functions)

    함수 리터럴은 이름을 가질 수 있는데 이 이름은 재귀적으로 호출할 때 사용할 수 있다.  

 

3장 객체

    자바스크립트에서 단순한 데이터 타입은 number, string, boolean, null, undefined가 있다.

    자바스크립트에서는 이들을 제외한 다른 값들은 모두 객체다.

    배열, 함수 정규표현식 등과 객체 모두가 객체다.

 

    객체는 이름과 값이 있는 속성들을 포함하는 컨테이너라고 할 수 있다.

    자바스크립트의 객체는 클래스가 필요 없다.

 

01 객체 리터럴

    객체 리터럴은 새로운 객체를 생성할 때 편리한 표기법을 제공한다.

    속성값은 어떠한 표현식도 가능하다. (객체리터럴도 가능: 중첩된 객체)

 

02 속성값 읽기

    객체에 속한 속성의 값은 속성 이름을 대괄호([])로 둘러싼 형태로 읽을 수 있다.

    객체에 존재하지 않는 속성을 읽으려고 하면 undefined를 반환한다.

 

    || 연산자를 사용하여 기본값을 지정할 수 있다.

    var status = flight.status || "unknown";

 

03 속성값의 갱신

    객체의 값은 할당에 의해 갱신한다.

    속성이 객체 내에 존재하지 않으면 해당 속성을 추가한다.

 

04 참조

    객체는 참조 방식으로 전달된다. 결코 복사되지 않는다.

 

05 프로토타입(Prototype)

    객체 리터럴로 생성되는 모든 객체는 표준 객체 Object의 속성인 prototype 객체에 연결된다.

    프로토타입 연결은 오로지 객체의 속성을 잃을 때만 사용한다.

 

06 리플렉션(reflection)

    typeof 연산자는 속성의 타입을 살펴보는데 매우 유용하다.

    hasOwnProperty 메서드는 프로토타입 체인을 바라보지 않는다.

 

07 열거(Enumeration)

    for in 구문을 사용하면 객체에 있는 모든 속성의 이름을 열거할 수 있다.

    일반적인 필터링 방법은 hasOwnProperty 메서드와 함수를 배제하기 위한 typeof를 사용하는 것이다.

    

08 삭제

    delete 연산자를 사용하면 객체의 속성을 삭제할 수 있다.

    delete 연산자는 프로토타입 연결 상에 있는 객체들은 접근하지 않는다.

 

09 최소한의 전역변수 사용

    전역변수 사용을 최소화하는 방법은 애플리케이션에서 아래와 같이 하나 만드는 것이다.

    var MYAPP = {}
    MYAPP.stooge = {
        firstname : "Joe",
        lastname : "Howard"
    }
    MYAPP.flight = {
        ......
    }

  

4장 함수

01 함수 객체

    자바스크립트에서 함수는 객체다.

    객체 중에서 객체 리터럴로 생성되는 객체는 Object.prototype에 연결된다.

    함수 객체는 Function.prototype에 연결된다

 

    모든 함수는 함수의 context와 함수의 행위를 구현하는 code의 추가적인 속성이 있다.

    함수를 다른 객체와 구분 짓는 특징은 호출할 수 있다는 것이다.

 

02 함수 리터럴

    함수 리터럴에는 네 가지 부분이 있다. 

 

    첫 번째, function이라는 예약어

    두 번째, 함수의 이름 (선택사항). 이름이 없으면 익명함수 (Anonymous)

    세 번째, 함수의 매개변수. ( )

    네 번째, 문장들의 집합. { }

 

    함수 리터럴은 표현식이 나올 수 있는 곳이면 어디든지 위치할 수 있다.

    함수 리터럴로 생성한 함수 객체는 외부 문맥으로의 연결이 있는데 이를 클로저라고 한다.

 

03 호출

    모든 함수는 명시되어 있는 매개변수에 더해서 this와 arguments를 추가적으로 받게 된다.

    함수를 호출할 때 넘기는 인수의 개수와 매개변수의 개수가 일치하지 않아도 된다.

    인수가 매개변수보다 많을 경우 초과하는 인수는 무시한다.

    인수가 매개변수보다 적을 경우 남는 매개변수에 undefined을 할당한다.

 

    자바스크립트에는 함수를 호출하는데 네 가지 패턴이 있다.

    메서드 호출 패턴 : 함수를 객체의 속성에 저장하는 경우를 메서드라고 부른다.

 

    var myObject = {

        add : function () {}

    };

    myObject.add();

 

    함수 호출 패턴 : 함수를 호출할 때 this는 전역객체에 바인딩된다.

    var fname = add(3, 4);

 

    생성자 호출 패턴 : 클래스 기반의 언어들을 생각나게 하는 객체 생성문법을 제공한다.  함수를 new 연산자와 함께 호출하면 호출한 함수의 prototype 속성의 값에 연결되는 객체가 생성되고, 이 새로운 객체는 this에 바인딩된다.

    var Add = function() {};

    var myAdd = new Add(); // 권장하지 않음

 

    apply 호출 패턴 : apply 메서드는 함수를 호출할 때 사용할 인수들의 배열을 받아들인다.

    첫 번째는 this에 묶이게 될 값이며, 두 번째는 매개변수들의 배열이다.

    var array = [3, 4];

    add.apply(null, array);

 

04 인수 배열(arguments)

    함수를 호출할 때 추가적인 매개변수로 arguments라는라는 배열을 사용할 수 있다.

    설계상의 문제로 arguments는 실제 배열이 아니다.

    arguments에는 length라는 속성이 있지만 배열이 가지는 메서드들은 없다.

 

05 반환

    함수는 항상 값을 반환한다. 반환값이 지정되지 않은 경우는 undefined가 반환된다.

    함수를 new 연산자와 함께 실행하고 반환값이 객체가 아닌 경우 반환값은 this가 된다.

 

06 예외

    throw문은 함수의 실행을 중단합니다.

    예외 객체는 어떤 예외인지 알려주는 name속성과 예외를 설명하는 message 속성을 가집니다.

 

 

07 기본 타입에 기능 추가

    자바스크립트는 언어의 기본 타입에 기능을 추가하는 것을 허용한다.

    새로운 메서드를 추가하면 관련된 값들에는 바로 새로운 메서드들이 추가된다.

 

08 재귀적 호출

    재귀 함수는 직접 또는 간접적으로 자신을 호출하는 함수다.

    재귀 함수는 웹 브라우저의 DOM 같은 트리 구조를 다루는데 매우 효과적이다.

 

09 유효범위(Scope)

    프로그래밍 언어에서 유효범위는 변수와 매개변수의 접근성과 생존 기간을 제어한다.

    자바스크립트는 블록 유효범위가 없다. 함수 유효범위가 있다.

    함수 내에서 정의된 매개변수와 변수는 함수 외부에서는 유효하지 않다.

    

10 클로저(closure)

    내부 함수에서 자신을 포함하고 있는 외부 함수의 매개변수와 변수들을 접근할 수 있다.

    단, this와 arguments는 예외다.

 

    함수가 자신이 생성된 함수, 자신을 포함하는 함수의 context에 접근할 수 있다.

    내부 함수가 외부 함수에 있는 변수의 복사본이 아니라 실제 변수에 접근한다.

 

11 콜백

    콜백 함수는 비연속적인 이벤트를 처리할 때 좀 더 쉽게 할 수 있는 방법을 제공한다.

    서버로 요청을 비동기식으로 하고 응답이 왔을 때 호출되는 콜백 함수를 제공하는 것이다.

 

12 모듈

    모듈은 내부의 상태나 구현내용은 숨기고 인터페이스만 제공하는 함수나 객체다.

    모듈 패턴은 바인딩과 private을을 위해 함수의 유효범위와 클로저를 이용한다.

    모듈 패턴을 사용하면 전역변수 사용을 없앨 수 있다.

 

13 연속 호출(Cascade)

    메서드들이 this를 반환한다면 연속 호출이 가능하다.

    함수를 체인으로 구성할 수 있다.    

 

14 커링(Curry)

    curry 메서드는 커링할 원래 함수와 인수를 유지하는 클로저를 만드는 방식으로 동작한다.

 

15 메모이제이션(memoization)

    불필요한 작업을 피하기 위해서 이전에 연산한 결과를 저장하고 있는 객체다.