jsの5つの継承方法
10098 ワード
正式に発表されたES 6はすでにパッケージ化されており、他のOO言語での継承形態を実現しています.Class Extensは、ここでは主にjsの原型継承と借用構造関数の継承を記録しています.
一、プロトタイプチェーン継承
単独での借用構造関数の使用は、超クラスのプロトタイプの属性と方法を継承することができません.
三、結合式継承(原型継承+借用構造関数継承)
組み合わせ継承も実際に開発された中で最もよく使われている継承方式です.
一、プロトタイプチェーン継承
function Super(){
this.name=" ";
}
Super.prototype.sayName = function(){
alert(this.name)
};
function Sub(){}
Sub.prototype = new Super();
var instance = new Sub();
instance.sayName();//
プロトタイプチェーン継承の問題// , , ,
//
function Super(){
this.name=" ";
this.friends = [' ',' '];
}
Super.prototype.sayName = function(){
alert(this.name)
};
function Sub(){}
Sub.prototype = new Super();
var instance1 = new Sub();
var instance2 = new Sub();
instance1.friends.push(' ');
console.log(instance1.friends);//[" ", " ", " "]
console.log(instance2.friends);//[" ", " ", " "]
二、構造関数を借りて継承するfunction Super(){
this.name=" ";
this.friends = [' ',' '];
}
Super.prototype.sayName = function(){
alert(this.name)
};
function Sub(){
Super.call(this);
}
var instance1 = new Sub();
var instance2 = new Sub();
instance1.friends.push(' ');
console.log(instance1.friends);//[" ", " ", " "]
console.log(instance2.friends);//[" ", " "]
構造関数を借りる問題単独での借用構造関数の使用は、超クラスのプロトタイプの属性と方法を継承することができません.
三、結合式継承(原型継承+借用構造関数継承)
組み合わせ継承も実際に開発された中で最もよく使われている継承方式です.
function Super(){
this.name=" ";
this.friends = [' ',' '];
}
Super.prototype.sayName = function(){
alert(this.name)
};
function Sub(){
Super.call(this);
}
Sub.prototype = new Super();
var instance1 = new Sub();
var instance2 = new Sub();
instance1.friends.push(' ');
console.log(instance1.friends);//[" ", " ", " "]
console.log(instance2.friends);//[" ", " "]
instance1.sayName();//
instance2.sayName();//
組み合わせ継承の問題// ,
function Super(){
this.name=" ";
this.friends = [' ',' '];
}
Super.prototype.sayName = function(){
alert(this.name)
};
function Sub(){
Super.call(this);//
}
Sub.prototype = new Super();//
var instance = new Sub();
四、寄生式継承// , ,
function createAnother(original){
var clone = Object(original);// ,original
clone.sayName = function(){ // ,
alert('hi');
}
return clone;
}
var person = {
name:' ',
friends:[' ',' ']
}
var person1 = createAnother(person);
var person2 = createAnother(person);
person1.friends.push(' ');
console.log(person.friends);//[" ", " ", " "]
console.log(person1.friends);//[" ", " ", " "]
console.log(person2.friends);//[" ", " ", " "]
寄生ユニット引き継ぎ//
function inheritPrototype(sub,superr){
var prototype = Object.create(superr.prototype);//ES5
prototype.constructor = superr; // constructor
sub.prototype = prototype;
}
function Super(name){
this.name = name;
this.friends = [' ',' '];
}
Super.prototype.sayName = function(){
alert(this.name);
}
function Sub(name){
Super.call(this,name);
}
inheritPrototype(Sub,Super);
var person1 = new Sub(' ');
var person2 = new Sub(' ');
person1.friends.push(' ');
console.log(person1.friends);//[" ", " ", " "]
console.log(person2.friends);//[" ", " "]
console.log(person1.sayName());//
console.log(person2.sayName());//