JAVASCRIPT實現繼承的幾種方式
阿新 • • 發佈:2018-03-19
JAVASCRIPT實現繼承的幾種方式
call()方法(推薦):
a. 代碼:
apply()方法(推薦):
a. 代碼:
原型鏈(單繼承):
a. 代碼:
混用對象冒充與原型鏈(多繼承):
a. 代碼:
說明:
對象冒充(多繼承):
a. 代碼:
function ClassA(sColor) { this.color = sColor; this.sayColor = function () { console.log(this.color); }; } function ClassB(sName) { this.name = sName; this.sayName = function () { console.log(this.name); }; } function ClassC(sColor, sName) { this.newMethod = ClassA; this.newMethod(sColor); delete this.newMethod; this.newMethod = ClassB; this.newMethod(sName); delete this.newMethod; } var objA = new ClassA("blue"); var objC = new ClassC("red", "John"); objA.sayColor(); objC.sayColor(); objC.sayName();
b. 輸出:
blue
red
John
a. 代碼:
function ClassA(sColor) { this.color = sColor; this.sayColor = function () { console.log(this.color); }; } function ClassB(sName) { this.name = sName; this.sayName = function () { console.log(this.name); }; } function ClassC(sColor, sName) { ClassA.call(this,sColor) ClassB.call(this,sName) } var objA = new ClassA("blue"); var objC = new ClassC("red", "John"); objA.sayColor(); objC.sayColor(); objC.sayName();
b. 輸出:
blue
red
John
a. 代碼:
function ClassA(sColor) { this.color = sColor; this.sayColor = function () { console.log(this.color); }; } function ClassB(sName) { this.name = sName; this.sayName = function () { console.log(this.name); }; } function ClassC(sColor, sName) { ClassA.apply(this,new Array(sColor)) ClassB.apply(this,new Array(sName)) } var objA = new ClassA("blue"); var objC = new ClassC("red", "John"); objA.sayColor(); objC.sayColor(); objC.sayName();
b. 輸出:
blue
red
John
a. 代碼:
function ClassA(color) {
this.color = color
this.sayColor = function () {
console.log(this.color);
};
}
function ClassB(name) {
this.name = name
this.sayName = function () {
console.log(this.name);
};
}
ClassB.prototype = new ClassA("red");
var objA = new ClassA("blue");
var objB = new ClassB("John");
objA.sayColor();
objB.sayColor();
objB.sayName();
b. 輸出:
blue
red
John
a. 代碼:
function ClassA(sColor) {
this.color = sColor;
this.sayColor = function(){
console.log(this.color)
}
}
function ClassB(sName) {
this.name = sName;
this.sayName = function(){
console.log(this.name)
}
}
function ClassC(sColor, sName) {
ClassA.call(this, sColor);
ClassB.call(this, sName);
}
ClassC.prototype = new ClassA();
ClassC.prototype = new ClassB();
var objA = new ClassA("blue");
var objC = new ClassC("red", "John");
objA.sayColor();
objC.sayColor();
objC.sayName();
b. 輸出:
blue
red
John
推薦使用call()方法或apply()方法
JAVASCRIPT實現繼承的幾種方式