> 웹 프론트엔드 > JS 튜토리얼 > JavaScript 상속의 사용 예에 ​​대한 자세한 설명: 프로토타입 상속, 기생 상속, 기생 결합 상속

JavaScript 상속의 사용 예에 ​​대한 자세한 설명: 프로토타입 상속, 기생 상속, 기생 결합 상속

伊谢尔伦
풀어 주다: 2017-07-25 16:01:44
원래의
1417명이 탐색했습니다.

프로토타입 상속

 프로토타입 상속의 구현 방법은 일반적인 상속과 다릅니다. 프로토타입 상속은 엄밀한 의미에서 생성자를 사용하지 않고 프로토타입을 사용하여 기존 객체를 기반으로 새로운 객체를 생성할 필요도 없습니다. 사용자 정의 유형을 생성합니다. 구체적인 코드는 다음과 같습니다.


function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}
로그인 후 복사

코드 예:


/* 原型式继承 */
function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}

var person = {
  name : 'wuyuchang',
  friends : ['wyc', 'Nicholas', 'Tim']
}

var anotherPerson = object(person);
anotherPerson.name = 'Greg';
anotherPerson.friends.push('Bob');

var anotherPerson2 = object(person);
anotherPerson2.name = 'Jack';
anotherPerson2.friends.push('Rose');

alert(person.friends);  // wyc,Nicholas,Tim,Bob,Rose
로그인 후 복사

parasitic 상속


/* 寄生式继承 */
function createAnother(original) {
  var clone = object(original);
  clone.sayHi = function() {
    alert('hi');
  }
  return clone;
}
로그인 후 복사

사용 예:


/* 原型式继承 */
function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}
   
/* 寄生式继承 */
function createAnother(original) {
  var clone = object(original);
  clone.sayHi = function() {
    alert('hi');
  }
  return clone;
}

var person = {
  name : 'wuyuchang',
  friends : ['wyc', 'Nicholas', 'Rose']
}
var anotherPerson = createAnother(person);
anotherPerson.sayHi();
로그인 후 복사

기생 조합 수식 상속

  조합 JavaScript 패턴 구현 상속에는 고유한 단점이 있습니다. 이제 구현 아이디어는 생성자가 속성을 상속하고 프로토타입 체인의 하이브리드 형식이 메서드를 상속한다는 것입니다. 즉, 부모를 인스턴스화할 필요가 없습니다. 메소드 함수를 상속할 때 유형 생성자. 코드는 다음과 같습니다.


function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}

/* 寄生组合式继承 */
function inheritPrototype(subType, superType) {
  var prototype = object(superType.prototype);
  prototype.constructor = subType;
  subType.prototype = prototype;
}
로그인 후 복사

사용 시 조합 모드에서 "SubType.prototype = new SuperType();" 코드 줄을 상속프로토타입(subType, superType);으로 바꾸면 됩니다. 기생 결합 상속의 높은 효율성은 부모 유형 생성자를 한 번만 호출하여 불필요하거나 중복되는 속성이 생성되는 것을 방지한다는 사실에 반영됩니다. 동시에 프로토타입 체인은 변경되지 않은 상태로 유지되므로 instanceof 및 isPrototypeof()는 계속 정상적으로 사용할 수 있습니다. 이는 현재 가장 이상적인 상속 방법이며 현재 이 모델로 전환 중입니다. (YUI도 이 패턴을 사용합니다.)

위 내용은 JavaScript 상속의 사용 예에 ​​대한 자세한 설명: 프로토타입 상속, 기생 상속, 기생 결합 상속의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿