js面向物件3-繼承
阿新 • • 發佈:2019-01-06
一、瞭解繼承
1.1 繼承就是後輩繼承前輩的屬性和方法
1.2 面向物件程式設計(OOP)
JavaScript不是面向物件程式語言, 但是它的特性支援面向物件的程式設計思維。
二、繼承的方法
- 從父類繼承屬性和方法
物件冒充, 模仿java中的繼承物件冒充, 模仿java中的繼承。通過改變父類的執行環境進行繼承;
// 從父類中繼承屬性和方法
function Father() {
this.say = 'hi';
this.fn = function () {
return this.say;
}
console.log(1); //1
}
function Son() {
this.name = "a";
//物件冒充
this.f = Father; //將函式Father作為子類的方法,複製的是一個函式物件的指標
this.f(); //執行函式,得到一個屬性和一個方法fn,同時會執行函式
delete this.f; //刪除這個指標連結
}
var s = new Son();
console.log(s);
console.log(s.fn()); //hi son存在存在了Father的方法fn
2. 通過原型鏈繼承
原型鏈的查詢順序: 先自身查詢, 找到就結束, 沒有找到就沿著原型鏈向上查詢, 直到找到Object.prototype.proto
function A() {
this.a = "A";
this.fn = function () {
return this.a;
}
}
function B() {
this.a = "B";
}
B.prototype = new A(); //將A的例項作為B的原型,原來存在於A例項的所有方法和屬性,存在於B原型prototype中
var b = new B();
console.dir(b);
- 更改this指向
apply()
call()
bind()
這裡就不詳細概述了 - class繼承extends
class C {
constructor(name) {
//建構函式
this.name = name; //給新的物件新增一個name屬性
}
// sayName相當於 A.prototype.sayName = function(){return this.name}
sayName() {
return this.name;
}
}
class D extends C { //D類,該類通過extends關鍵字,繼承了C類的所有屬性和方法
}
var newc = new D("haode");
console.log(newc.name); //"haode"
console.log(newc.sayName()); //"haode"