블로그 이미지

GUEST

html/css/javascript 2014. 4. 2. 13:33

javascript - 상속

아리까리해서 정리하는 javascript 싸지르기 2.

1. psuedo-classical

유사 class 방식.
객체는 생성자 함수의 prototype에 접근할 수 있는 특성을 이용한다.


function A(_a){
    this.a = _a;
}                                    // ------------------- (1)
function B(_b){
    this.b = _b;
}                                    // -------------------- (2)

B.prototype = new A(1);        // ------------------- (3)
B.prototype.constructor = B; // ------------------(4)

var o = new B(2); //----------------------- (5)
console.log(o.a);    // ----------------------- (6)


(1), (2) 함수가 생성되면서 prototype property 생성 및 초기화


A.property = {constructor:A}
B.property = {constructor:B}


(3) B의 prototype property에 A의 객체를 할당.
    (2)에서 기본 할당되었던 {constructor:A}에 대한 참조를 잃는다.
   
(4) constructor property를 다시 B로 할당한다.
   
(5) 이제 B를 통해 생성한 모든 객체는 A의 property a를 참조한다.



2. prototypal
프로토타입 방식.
built in object Object의 create 함수를 이용한다. [참조]


var A = {
    a:0
}
var o = Object.create( A );

o.b = 1;
console.log(o.a);

console.log(o.b);


create 함수가 작동하는 방식은 다음과 같다.[참조]


function create( proto ){
    function F(){};
    F.prototype = proto;
    return new F();
}




3. 차이점 [참조]


psuedo-classical : class -> object

prototypal : object -> object


psuedo-classical 방식은  class(function)로부터 object를 생성한다. java에서 class - object 관계와 유사하다.

prototypal 방식은 object로부터 object를 생성한다. 


javascript 초기에 java와 유사하게 사용할 수 있도록 psuedo-classical 방식을 도입했다.

그러나 OOP의 상속 구현은, 꼭 class가 있어야 할 필요가 없다. 상위 객체의 속성을 하위 객체에서 받아서 쓸 수 있으면 된다.

class가 없는 javascript에서는 prototypal 방식이 언어 특성에 더 적합하다.


cf1) new의 작동방식, create의 작동방식을 보고 있으면 둘의 차이가 뭔지 헷갈린다. javascript의 기능이 막강해서 이런 저런 방식으로 다 사용이 가능하지만, prototypal방식이 언어 특성에 부합하다. (실제 내부 구현이 vender마다 다르니 꼭 저렇다고 말하기 어렵고..)


cf2) prototypal 방식에서는 method chaining이 가능하다.

ex) Object.create().apply(...)




,
TOTAL TODAY