作爲前端，你需要懂得javascript實現繼承的方法

在ES6之前，javascript不跟其他語言一樣，有直接繼承的方法，它需要藉助於構造函數+原型對象模擬實現繼承。現在我們可以利用ES6的extends方法實現繼承，如果想了解更多有關ES6實現的繼承請查看《ES6學習筆記（二）：教你玩轉類的繼承和類的對象》，在這裏不再做更多的介紹。

ES6之前並沒有給我們提供extends繼承，我們可以通過構造函數+原型對象模擬實現繼承，被稱爲組合繼承。

1. call()

調用這個函數，並且修改函數運行時的this指向

fun.call(thisArg, arg1,arg2,...)

• thisArg：當前調用函數this的指向對象
• arg1, arg2：傳遞的普通參數

function fn() {
console.log('前端嵐楓') 
  console.log(this)
}
fn.call() //說明call()可以調用函數,this指向window
var obj = {
	name: 'lanfeng
}
fn.call(obj) //this指向obj， 說明call可以改變this指向

2. 借用構造函數繼承父類型屬性

核心思想：通過call()把父類型的this指向子類型的this,這樣就可以實現子類型繼承父類型的屬性。

// 借用父構造函數繼承屬性
//父構造函數
function Father (uname, age) {
  //this指向父構造函數的對象實例
	this.uname = uname
  this.age = age
}
// 子構造函數
function Son (uname, age){
  // this指向子構造函數的對象實例
  //藉助於call,this指向子構造函數對象實例
  Father.call(this, uname, age)
  
}
var son = new Son('王俊凱'，18)
console.log(son) //

3. 借用原型對象繼承父類型方法

// 父構造函數
function Father (uname, age) {
  //this指向父構造函數的對象實例
	this.uname = uname
  this.age = age
}
// 父原型方法
Father.prototype.money = function() {
	console.log(10000)
}
// 子構造函數
function Son (uname, age){
  // this指向子構造函數的對象實例
  //藉助於call,this指向子構造函數對象實例
  Father.call(this, uname, age)
  
}

// Son.prototype = Father.prototype 這樣直接賦值會有問題，如果修改了子原型對象，父原型對象也會變化/
Son.prototype = new Father()

//手動改constructor指回原來的構造函數
Son.prototype.constructor = Son  
Son.prototype.exam= function() {
 console.log('考試')
}
var son = new Son('王俊凱'，18)
console.log(son) //
son

結構關係如下圖：

總結

今天主要分享了call()方法的用法和javascript通過構造函數+原型對象模擬實現繼承的方式。