Javascript 프로그래밍_javascript 기술의 상속 예 요약-JS 튜토리얼-php.cn

Javascript 프로그래밍_javascript 기술의 상속 예 요약

WBOY

풀어 주다： 2016-05-16 15:29:18

원래의

1039명이 탐색했습니다.

이 기사의 예에서는 Javascript 프로그래밍의 상속을 설명합니다. 참고하실 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.

이 글은 "자바스크립트 왕의 귀환"을 읽고 요약한 글입니다. 글의 자세한 내용은 21장 P537

에 있습니다.

상속은 일반적으로 다음과 같은 세 가지 수준의 의미를 구현합니다.

1) 하위 클래스 인스턴스는 상위 클래스의 메서드를 공유할 수 있습니다.
2) 하위 클래스는 상위 클래스 메서드를 재정의하거나 새 메서드를 확장할 수 있습니다.
3) 하위 클래스와 상위 클래스는 모두 하위 클래스 인스턴스 유형입니다.

1. 구조적 상속 방법

하위 클래스는 상위 클래스의 생성자를 호출하여 이를 유지합니다. 이 상속 방법은 다중 상속을 달성할 수 있지만 상위 클래스의 공통 메서드만 상속할 수 있고 정적 메서드를 상속할 수 없으며 인스턴스를 확인하는 데 사용할 수 없습니다. 사례.

function a(){
  this.say=function(){
  alert("happy new year！");
  }
}
function b(){
  a.apply(this,arguments);
}
a.prototype.fuck=function(){
  alert("%^&%^&%&^%&");
}
var oB=new b();
alert(oB instanceof a);// false
oB.say();       // happy new year
oB.fuck();       // 读不到

로그인 후 복사

2. 프로토타입 상속/클래식 상속

이 상속 방법은 기존 프로토타입 객체를 복사하여 동작 재사용을 달성하므로 객체 인스턴스가 프로토타입 객체의 속성을 공유할 수 있습니다. 다중 상속을 지원하고, 프로토타입 정적 메서드를 상속하며, instanceof를 사용하여 인스턴스를 확인할 수 있습니다.

function a(){
 this.say=function(){
 alert("happy new year！");
 }
}
function b(){}
a.prototype.fuck=function(){
  alert("%^&%^&%&^%&");
}
a.prototype.z=123;
b.prototype=new a();
var oB=new b();
alert(oB instanceof a); // true
alert(oB.z);      // 123
oB.say();        // happy new year
oB.fuck();       // %^&%^&%&^%&

로그인 후 복사

3. 인스턴스 상속/기생 생성자 패턴

구성 메서드는 해당 유형의 정적 메서드를 상속할 수 없으며 프로토타입 상속은 불완전하지만(일부 핵심 개체의 열거 불가능한 메서드는 상속할 수 없음), 인스턴스 상속 메서드는 기본 핵심 개체 또는 DOM 개체를 상속할 수 있습니다. . 상속은 객체를 구성하고 반환하는 방식으로 구현되므로 검증 인스턴스가 거짓이 되고 다중 상속이 지원되지 않습니다.

function a(){
 var oA=new Array();
 oA.say=function(){
   alert("hello A!");
 }
 return oA;
}
var obj=new a();
alert(obj instanceof a); // false
obj.say();

로그인 후 복사

4. 복사 상속 방법

이 메서드는 기본 클래스 개체의 열거 가능한 모든 속성과 메서드를 복사하여 상속을 시뮬레이션하므로 다중 상속을 시뮬레이션할 수 있지만, 열거할 수 없는 항목은 상위 클래스의 정적 메서드를 상속할 수 없습니다. >

function a(){
  this.num=123;
  this.say=function(){
  alert("happy new year！");
  }
}
function b(){
  this.extends=function(obj){
    for(each in obj){
      this[each]=obj[each];
    }
  }
}
var oB=new b();
oB.extends(new a());
alert(oB instanceof a); // false
alert(oB.num);     // 123
oB.say();        // happy new year

로그인 후 복사

5. 혼합 상속 방식

이름에서 알 수 있듯이 위의 상속 방법을 결합하여 서로의 장점을 배우고 상속을 더욱 완벽하게 만드는 것입니다. 일반적인 것에는 구조적 프로토타입 상속, 의사 고전적 상속이 포함됩니다

function a(){
  this.num=123;
  this.say=function(){
  alert("happy new year！");
  }
}
function b(){
  a.apply(this);
}
b.prototype=new a();
b.prototype.z=123;
var oB=new b();
alert(oB instanceof a); // true
alert(oB.num);     // 123
oB.say();        // happy new year

로그인 후 복사

6. 각종 상속법의 장점과 단점

이 기사가 JavaScript 프로그래밍에 종사하는 모든 사람에게 도움이 되기를 바랍니다.