안승규의 블로그 (Stay hungry, stay foolish)

1. 인스턴스 메소드를 호출하면 메소드 내의 this 키워드는 메소드가 속한 객체를 가르킨다.
2.  클래스 메소드는 생성자 함수를 통해 호출되기 때문에this 키워드는 특정한 인스턴스를 참조하지 않는다.
     대신 생성자 함수 자체를 참조한다. (일반적으로 클래스 메소드에서는 this를 사용하지 않는다)
3. 모든 함수에는 prototype 이라는 프로퍼티가 있는데, 이것은 함수가 정의될 때 부터 자동적으로 생성된다.
    prototype 프로퍼티의 초기값은 constructor 프로퍼티 하나만 가지는 객체가 지정된다.
    
    function Rectangle(w, h) {
        this.width = w;
        this.height = h;
        // new Rectangle(...) 객체가 생성될 때 마다 메소드도 생성된다. 메모리 낭비다.
        this.area = function() { return this.width * this.height; }  
    } 

    // new Rectangle(...)로 생성되는 모든 객체는 area() 메소드를 공유한다. (prototype의 특징)
    Rectangle.prototype.area = function() { return this.width * this.height; }

4. 클래스 프로퍼티와 메소드는 모두 생성자 함수에 저장한다. (함수도 객체이기 때문에 가능하다)

    // 생성자 함수를 정의한다.
    function Circle(radius) {
        this.r = radius;                  // 인스턴스 프로퍼티를 초기화한다.
    }

    // PI는 클래스 프로퍼티로 지정된다. 또한 생성자 함수의 프로퍼티가 된다.
    Circle.PI = 3.14;

    // prototype 메소드를 추가하여 모든 인스턴스가 해당 메소드를 공유하여 사용하게 한다.
    Circle.prototype.area = function() { return Circle.PI * this.r * this.r; }

    // max 는 클래스 메소드이다.
    Circle.max = function(a, b) {
        if ( a.r  > b.r ) return a;
        else return b;
    }

    // 사용법
    var c = new Circle(1.0);
    var a = c. area();
    var d = new Circle(1.2);
    var bigger = Circle.max(c, d);

5. private 프로퍼티 구현

    function ImmutableRectangle(w, h) {
        this.getWidth = function() { return w; }
        this.getHeight = function() { return h; }
    }

    ImmutableRectangle.prototype.area = function() {
        return this.getWidth() * this.getHeight();
    }

6. 클래스 상속(1)

    function Rectangle(w, h) {
        this.width = w;
        this.height = h;
    }
    Rectangle.prototype.area = function() { return this.width * this.height; }
    Rectangle.prototype.toString = function() {
        return "[" + this.width + "," + this.height + "]";
    }

    function PositionedRectangle(x, y, w, h) {
        Rectangle.call(this, w, h);
        this.x = x;
        this.y = y;
    }
    PositionedRectangle.prototype = new Rectangle();

    delete PositionedRectangle.prototype.width;
    delete PositionedRectangle.prototype.height;

    PositionedRectangle.prototype.constructor = PositionedRectangle;
    PositionedRectangle.prototype.contains = function(x, y) {
        return (x > this.x && x < this.y + this.width && y > this.y && y < this.y + this.height);
    }
    PositionedRectangle.prototype.toString = function() {
        return "(" + this.x + "," + this.y + ") " +
                   Rectangle.prototype.toString.apply(this);
    }


7. 클래스 상속(2)
    - 6번의 방법에서 생성자 부분만 바꿔주고 재정의 부분도 superclass를 사용한다.

    PositionedRectangle.prototype.superclass = Rectangle;
    function PositionedRectangle(x, y, w, h) {
        this.superclass(w, h);
        this.x = x;
        this.y = y;
    }
    PositionedRectangle.prototype.toString = function() {
        return "(" + this.x + "," + this.y + ") " +
                   this.superclass.prototype.toString.apply(this);
    }

8. 클래스 메소드 확장
    
    function borrowMethods(borrowFrom, addTo) {
        var from = borrowFrom.prototype;
        var to = addTo.prototype;

        for (m in from) {
            if (typeof from[m] != "function") continue;
            to[m] = from[m];
        }
    }

9. 객체 타입 판단
    - typeof undefined   :  "undefined"
    - typeof null             :  "object"
    - typeof f                  : "function"   f 가 함수라면
    - typeof o                 : "object"    o 가 객체이거나 null 이라면

    - x instanceof Array      : x가 Array 객체라면 true
    - x instanceof Function : x 가 함수라면 true
    - x instanceof Object     :  x가 객체(Array, RegExp, Date, Error 포함)이거나 함수라면 true

 

I. 일반 객체의 프로퍼티 존재 확인하기
    1. in 연산자 사용
        - 프로퍼티 "x"가 존재하면 값에 상관없이 1을 저장
            if ( "x" in o ) o.x = 1; 

    2. undefined 로 비교
        - 프로퍼티 "x"가 존재하고 값이 undefined가 아니라면 1을 저장 
            if ( o.x !== undefined ) o.x = 1; 

    3. null 로 비교
        - 프로퍼티 "x" 가 존재하고 이 값이 null 이나 undefined가 아니라면 1을 저장
            if ( o.x ) o.x = 1;

II. constructor 생성자 프로퍼티
    1. 모든 객체는 생성자 함수인 constructor 프로퍼티를 가지고 있다.
         var d = new Date();        // Date 라는 constructor 프로퍼티로 Date 객체를 생성
         if ( d.constructor == Date )   // 결과 값은 true
         if (  (typeof d == "object") && (d.constructor == Date) ) // 결과 값은 true

    2. instanceof 연산자는 constructor 프로퍼티의 값을 사용한다.
         if (  (typeof d == "object") && (d instanceof Date) ) // 결과 값은 true

III. hasOwnProperty() 메소드
    1. 객체가 해당 프로퍼티를 가지고 있는지 검사한다.
        프로퍼티가 상속받은 것이 아니고 객체 안에 지역적으로 정의되어 존재한다면 true 아니면 false
         var o = {};
         o.hasOwnProperty("undef");        // false; 정의되지 않은 프로퍼티
         o.hasOwnProperty("toString");    // false; 상속받은 프로퍼티
         Math.hasOwnProperty("cos");     // true; Math 객체에 cos 프로퍼티가 존재

IV. 모든 객체의 조상인 Object 클래스에 존재하는 최상의 프로퍼티들
    1. constructor 프로퍼티
    2. toString() 메소드
    3. toLocaleString() 메소드
    4. valueOf()  메소드
    5. hasOwnProperty() 메소드
    6. propertyIsEnumerable() 메소드
    7. isPrototypeOf() 메소드

V. 배열 객체
    1. 배열의 길이
        - 배열의 길이는 length 프로퍼티로 알 수 있으며, 배열 안에서 가장 큰 인덱스 값보다 하나 더 큰 수 이다.
        - 배열의 원소들도 undefined 값을 가질 수 있는 특징을 생각하면 위의 문장이 이해가 갈 듯.
            var a = new Array();       // a.length == 0
            a = new Array(10);         // a.length == 10
            a = new Array(1, 2, 3);   // a.length == 3
            a = [4, 5];                        // a.length == 2
            a[5] = 1;                          // a.length == 6
            a[49] = 0;                        // a.length == 50
 
    2. 배열의 메소드
        - join() 메소드
            . 배열의 모든 원소를 문자열로 변환하고 이어 붙여서 반환한다.
                var a = [1, 2, 3];
                var s = a.join();      // s = "1,2,3"
                s = a.join(", ");       // s = "1, 2, 3"
 
        - reverse() 메소드
            . 배열 안의 원소 순서를 반대로 정렬하여 반환한다.
                var a = new Array(1,2,3);    // a[0]=1, a[1]=2, a[2]=3
                a.reverse();                           // a[0]=3, a[1]=2, a[2]=1

        - sort() 메소드
            . 배열 안의 원소들을 정렬하여 반환한다.
                var a = new Array("banana", "cherry", "apple");
                a.sort();           // a[0]="apple", a[1]="banana", a[2]="cherry"

            . 배열 안의 undefined 원소는 배열의 끝 부분으로 정렬된다.
            . 배열 안의 원소들이 문자열이 아니라면 비교를 위해 임시로 문자열로 변환 작업이 수반된다.
            . 비교 함수를 전달인자로 하여 정렬할 수 있다. 비교 함수는 전달인자를 두 개 받는데,
              첫번째 전달인자가 두번째보다 먼저 나타나야 한다면 비교 함수는 0보다 작은 숫자를 반환해야 한다.
                var a = [33, 4, 1111, 222];
                a.sort();                                                   // 알파벳순 : 1111, 222, 33, 4
                a.sort( function(a, b) { return a-b; } );    // 번호순 : 4, 33, 222, 1111

        - concat() 메소드
            . 배열의 모든 원소에 전달인자들을 모두 이어 붙인 새로운 배열을 리턴한다.
                var a = [1, 2, 3];
                a.concat(3, 4, 5);   // [1, 2, 3, 4, 5] 를 리턴한다.

        - slice() 메소드
            . 배열의 일부분을 리턴한다.
                var a = [1, 2, 3, 4, 5];
                a.slice(0, 3);         // 0 번째 부터 3번째는 제외하고 그 이전까지 리턴  [1, 2, 3]
                a.slice(3);             // 3 번째 부터 끝까지 리턴 [4, 5]
                a.slice(1, -1);        // -1 은 맨 마지막 원소를 가리킨다. [2, 3, 4]

        - splice() 메소드
            . 배열의 원소를 삭제하거나 삽입할 때 
               var a = [1, 2, 3, 4, 5, 6, 7, 8];
               a.splice(4);           // [5, 6, 7, 8]을 리턴한다. a = [1, 2, 3, 4]
               a.splice(1, 2);       // 1번째에서 2개수 만큼 잘라낸다.  [2, 3]을 리턴한다. a = [1, 4]

        - push() 메소드
            . 배열의 끝 부분에 이어 붙이고 새로운 길이를 리턴한다.
               var stack = [];
               stack.push(1, 2);      // stack: [1, 2]     길이 2를 리턴한다.

        - pop() 메소드
            . 배열의 마지막 원소를 제거하고 배열의 길이를 감소시킨 후 배열에서 제거한 원소를 리턴한다.
               stack.pop();              // stack: [1]          원소 2를 리턴한다.
               
        - unshift() 메소드
            . 배열의 맨 앞에 원소를 삽입한 후 배열의 새로운 길이를 리턴한다.
               var a = [];
               a.unshift(1);             // a: [1]         길이 1을 리턴한다.
               a.unshift(22);           // a: [22, 1]   길이 2를 리턴한다.

        - shift() 메소드
            . 배열의 첫 번째 원소를 제거한 후, 나머지 배열 원소들을 전부 앞으로 옮기고 제거한 원소를 리턴한다.
               a.shift();                   // a: [1]         원소 22를 반환한다.