做爲前端，你須要懂得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經過構造函數+原型對象模擬實現繼承的方式。
若是想了解更多請掃描二維碼