2014-01-08 2 views
1

아래 코드에서 Foo라는 클래스가 있는데 배열 인 data라는 프로토 타입을 추가하고 showData라는 함수를 클래스의 프로토 타입으로 추가합니다. 예, 중요한 차이가있다JavaScript의 프로토 타입 개념에 대해서

var Foo = function (name) 
    { 
     this.name = name; 
     this.data = [1, 2, 3]; 
     this.showData = function() 
     { 
      console.log(this.name, this.data); 
     }; 
    }; 
+0

'console.log (Foo)'와 차이점을 비교하십시오! :) – Phil

답변

4

: 나는 데이터를 정의하고으로 만들었와 푸 클래스 안에있는 경우 문제는

var Foo = function (name) 
{ 
    this.name = name; 
}; 
Foo.prototype.data = [1, 2, 3]; // setting a non-primitive property 
Foo.prototype.showData = function() 
{ 
    console.log(this.name, this.data); 
}; 

, 차이가있다.

첫 번째 경우에 data 배열은 모든 인스턴스 Foo에 의해 공유됩니다. 하나 개의 인스턴스의 속성을 수정한다면, 모두가 수정됩니다 인해 공유에 또한 적은 메모리를 소모

var f1 = new Foo(), 
    f2 = new Foo(); 
f2.data[2] = 4; // also changes f1.data 

을하지만 당신이 Foo의 인스턴스를 만들 떨어져 있다면 아마 당신의 문제이다 (JS에서 점에 유의, 메모리를 소비하는 gc 기반 언어에서 종종 그렇듯이 메모리 소비로 인해서뿐만 아니라 쓰레기 처리에 사용되는 CPU로 인해서 나쁘다.

하지만 검색은 항상 childest 요소에서 시작으로 prototype에 속성을 설정하면, 까다 롭습니다 : 당신이 f2.data = [1,2,4]을 설정하면, 당신은 f2.data을 변경할 수 있지만 (이 2 개 개의 다른 배열을 생산) f1.data을 변경하지 마십시오.

1

가장 큰 차이점은 프로토 타입에 속성을 추가하면 이미 만들어진 것조차도 모든 인스턴스에 Foo을 추가한다는 것입니다.

번째 버전은 오버의 잠재적 거대한 양 수있는 코드 new Foo가 인스턴스화 될 때마다 이러한 추가의 라인을 실행하는 것을 포함한다.

관련 문제