今天就跟大家聊聊有關javascript中怎么實現繼承,可能很多人都不太了解,為了讓大家更加了解,小編給大家總結了以下內容,希望大家根據這篇文章可以有所收獲。
對象冒充(多繼承):
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
call()方法(推薦):
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
apply()方法(推薦):
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中怎么實現繼承有進一步的了解嗎?如果還想了解更多知識或者相關內容,請關注億速云行業資訊頻道,感謝大家的支持。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。