JavaScript 의 원형 과 주변

간단 한 소개
만약 에cpp,java같은 언어 를 배 웠 다 면 그들 은 유형class을 바탕 으로 계승 할 수 있다 는 것 을 알 게 될 것 이다.JavaScript에서 이런 개념 을 계승 하지 않 았 고JavaScript중의 계승 을 실현 하려 면 원형 적 인 도움 이 필요 하 다.
예 를 들 어 아래 코드 에서:
function Foo () {
  this.value = 1;
};

Foo.prototype = {
  method: function () {};
};

//  Bar    Foo()   
Bar.prototype = new Foo();
Bar.prototype.foo = 'Hello World';

//  Bar constructor
Bar.prototype.constructor = Bar;

//    Bar   
var test = new Bar();

이 코드 에서 원형 체인 을 유지 하고 추상 화 된 이 해 는 이 럴 수 있 습 니 다.
test [Bar   ]
     Bar.prototype [Foo   ]
         {foo: 'Hello World!'}
         Foo.prototype
            {method: function(){}}
            Object.prototype
                {...}

이해 하기 쉽다.test 는Bar.prototypeFoo.prototype에서 계승 되 었 기 때문에 그 는Foo실례 속성 중의value에 접근 할 수 있다.
주의해 야 할 것 은new Bar작업 에서Foo인 스 턴 스 를 다시 만 들 지 않 고 그의 원형 에 사용 되 는 인 스 턴 스 를 반복 합 니 다.
그 밖 에 원형 은 공 유 된 것 이다.만약 에 우리 가Foo.prototype = Bar.prototype의 서법 이 있다 면 이 두 대상 의 어떤 원형 도 다른 것 에 영향 을 줄 수 있다.이것 은 대부분 상황 에서 바람 직 하지 않다.
대상 이 속성 을 찾 을 때 그 는 원형 체인 을 따라 위 까지 추적 할 것 이다.물론Object.prototypr이 이 사슬 의 마지막 층 이 고 찾 지 못 하면 되 돌아 갑 니 다undefined.
hasOwnProperty
성능 에 있어 서 원칙적으로 원형 체인 이 너무 길 지 않도록 해 야 한다.for ... in ...로 옮 겨 다 닐 때 처럼 그 는 전체 원형 체인 을 옮 겨 다 니 는데 이것 은 비교적 높 은 성능 요구 나 일반적인 옮 겨 다 니 는 데 바람 직 하지 않다.
한 대상 이 포함 하 는 속성 이 그 자체 에 있 는 것 인지 원형 체인 에 있 는 것 인지 판단 하기 위해 서 는Object prototype에 계승 하 는hasOwnProperty방법 을 사용 해 야 한다.
예 를 들 면 아래 의 예 에서
Oboject.prototype.bar = 1;

var foo = {
  value: 2;
};

foo.var          //        Object,  1
'bar' in foo;    //           ,  true

foo.hasOwnProperty('bar');    //false
foo.hasOwnProperty('value')   //true
for ... in ...의 옮 겨 다 니 는 과정 에서 일반적으로hasOwnProperty의 방법 을 사용 하 는 것 을 권장 합 니 다.
주의해 야 할 것 은javascripthasOwnProperty에 대해 관련 보 호 를 하지 않 았 다 는 것 이다.만약 에 공교롭게도 대상 이hasOwnProperty라 는 속성 이 있다 면 발생 하 는 결 과 는 우리 가 기대 하 는 것 이 아 닐 것 이다.예 를 들 어 아래 처럼:
var foo = {
  hasOwnProperty: function () { return flase};
  bar: '1';
};

foo.hasOwnProperty('bar') //       ,       false

이 럴 때 해 야 할 일 은 외부hasOwnproperty를 호출 하 는 것 이다.그래,바로call또는apply를 사용 하 는 것 이다.아래 처럼:
//  true
Object.hasOwnProperty.call(foo, 'bar');
Object.hasOwnProperty.apply(foo, ['bar']);

원본 링크:http://life.rccoder.net/javascript/1207.html

좋은 웹페이지 즐겨찾기