JavaScript 프로토타입 체인 상속 방법의 사용법과 단점에 대한 자세한 설명

프로토타입 체인 방법

function Person(){
     this.name = 'Simon';
}
Person.prototype.say = function(){
     alert('My name is '+this.name);
}
function F2E(id){
     this.id = id;
     this.showId = function(){
          alert('Good morning,Sir,My work number is '+this.id);
     }
}
F2E.prototype = new Person();

var simon = new F2E(9527);
simon.say();
simon.showId();
alert(simon.hasOwnProperty('id')); //检查是否为自身属性

다음으로 위의 예를 따라 다음 js 프로토타입 체인 개념을 이해하세요.

프로토타입 체인은 다음과 같이 이해될 수 있습니다. js의 각 객체에는 인스턴스화된 객체인 숨겨진 __proto__ 속성이 있습니다. __proto__ 속성 해당 클래스의 프로토타입 메서드를 가리키며 이 프로토타입 메서드는 다른 인스턴스화된 개체에 할당될 수 있습니다. 이 개체의 __proto__는 해당 클래스를 가리켜서 이전 코드인 체인을 형성해야 합니다. 열쇠. js 객체가 특정 속성을 읽으면 먼저 자체 속성을 검색합니다. 그렇지 않은 경우 프로토타입 체인에서 객체의 속성을 검색합니다. 즉 프로토타입 체인 방식을 공유할 수 있어 객체 ​​흉내와 메모리 낭비 문제를 해결할 수 있다.

단점에 대해 이야기해 보겠습니다.

프로토타입 체인 상속은 하위 클래스를 인스턴스화할 때 매개 변수를 상위 클래스에 전달할 수 없다는 것을 의미합니다. 따라서 이 예제에서는 함수 Person()에 매개 변수가 없지만 this.name="Simon"의 이유라고 직접 작성되었습니다. 다음 코드는 예상한 결과를 얻지 못합니다.

F2E.prototype = new Person()

마지막으로 제가 생각하는 상속 구현 방법을 요약해 보겠습니다. 멤버 변수는 객체 가장을 사용하고 멤버 메서드는 프로토타입 체이닝을 사용합니다.

function Person(name){
     this.name = name;
}
Person.prototype.say = function(){
     alert('My name is '+this.name);
}
function F2E(name,id){
     this.id = id;
     this.showId = function(){
          alert('Good morning,Sir,My work number is '+this.id);
     }
}
F2E.prototype = new Person();

var simon = new F2E("Simon",9527);
simon.say();
simon.showId();

 
function Person(name){
     this.name = name;
}

Person.prototype.say = function(){
     alert('My name is '+this.name);
}

function F2E(name,id){
     this.id = id;
     this.showId = function(){
          alert('Good morning,Sir,My work number is '+this.id);
     }
}

F2E.prototype = new Person();  //此处无法进行传值，this.name或者name都不行，直接写F2E.prototype = new Person('wood')是可以的，但是这样的话simon.say()就变成了My name is wood

var simon = new F2E("Simon",9527);
simon.say();  //弹出 My name is undefined
simon.showId();

위 내용은 JavaScript 프로토타입 체인 상속 방법의 사용법과 단점에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!