這一節梳理對象的繼續。

我們重要運用繼續來完成代碼的籠統和代碼的復用，在應用層完成功用的封裝。

javascript 的對象繼續體式格局真的是百花齊放，屬性繼續、原型繼續、call/aplly繼續、原型鏈繼續、對象繼續、構造函數繼續、組合繼續、類繼續… 十幾種，每一種都細講須要花許多時候，這裏大抵梳理經常使用的幾種。 javascript 中的繼續並非明確規定的，而是經由歷程模仿完成的。下面我們簡樸梳理幾種有代表性的繼續。

原型繼續

ECMAScript 5 中引入了一個新要領： Object.create。能夠挪用這個要領來建立一個新對象。新對象的原型就是挪用 create 要領時傳入的參數：

let too = {
    a: 1
}
let foo = Object.create(too)
console.log(foo.a) // 1

經由歷程運用Object.create要領， 對象 too 會被自動加入到 foo 的原型上。我們能夠手動模仿完成一個Object.create雷同功用的函數:

let too = {
    a: 1
}
function create (prot) {
    let o = function () {}
    o.prototype = prot
    return new o()
}
let foo = create(too)
console.log(foo.a) // 1

或許用更簡樸直白的體式格局來寫：

function Foo() {}
Foo.prototype = {
    a: 1
}

let too = new Foo()
console.log(too.a) // 1

原型繼續是基於函數的prototype屬性

原型鏈的繼續

function Foo (id) {
    this.a = 1234
    this.b = id || 0
}
Foo.prototype.showData = function () {
    console.log(`${this.a}, id: ${this.b}`)
}
function Too (id) {
    Foo.apply(this, arguments)
}
Too.prototype = new Foo()
let bar = new Too(999)
bar.showData() // 1234, id: 999

上面構造函數TOO 經由歷程從新指定prototype屬性，指向了構造函數Foo的一個實例，然後在Too構造函數中挪用Foo的構造函數，從而完成對構造函數Foo功用的繼續。實例bar 經由歷程屬性__proto__來接見原型鏈上的同享屬性和要領。

class繼續

javascript 中的 class繼續又稱模仿類繼續。ES6中正式引入了 class 關鍵字來完成類言語體式格局建立對象。今後我們也能夠運用籠統類的體式格局來完成繼續。

// 父類
class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}
// 子類
class Square extends Polygon {
  constructor(sideLength) {
    super(sideLength, sideLength); // 挪用父對象的搞糟函數
  }
  get area() {
    return this.height * this.width;
  }
  set sideLength(newLength) {
    this.height = newLength;
    this.width = newLength;
  }
}

var square = new Square(2);

在JavaScript中沒有類的觀點，只要對象。雖然我們運用class關鍵字，這讓 JavaScript 看起來似乎是具有了”類”，可外表看到的不一定是本質，class只是語法糖，本質照樣原型鏈那一套。因而，JavaScript中的繼續只是對象與對象之間的繼續。反觀繼續的本質，繼續就是讓子類具有父類的一些屬性和要領，在JavaScript中就是讓一個對象具有另一個對象的屬性和要領。

繼續的完成是有許多種，這裏不一一列舉。須要注重的是 javascript 引擎在原型鏈上查找屬性是比較耗時的，對機能有副作用。與此同時我們遍歷對象時，原型上的屬性也會被羅列出來。要辨認屬性是在對象上照樣從原型上繼續的，我們能夠運用對象上的hasOwnProperty要領：

let foo = {
    a: 1
}
foo.hasOwnProperty('a') // true
foo.hasOwnProperty('toString') // false

運用hasOwnProperty要領檢測屬性是不是直接存在於該對象上並不會遍歷原型鏈。

javascript 支撐的是完成繼續，不支撐接口繼續，完成繼續重要依靠的是原型鏈。

思索

前面我們講到的基本是 javascript 怎樣完成面向對象編程的一些知識點。

不從觀點來講，簡樸來講當我們有屬性和要領須要被重複運用，或許屬性須要被多個對象同享時就須要去斟酌繼續的題目。在函數層面，人人一般的做法是運用作用域鏈來完成內層作用域對外層作用域屬性或函數的同享接見。舉個栗子吧~~

function car (userName) {
    let color = 'red'
    let wheelNumber = 4
    let user = userName
    let driving = function () {
        console.log(`${user} 的汽車，${wheelNumber}個輪子滾啊滾...`)
    }
    let stop = function () {
        console.log(`${user} 的汽車，${wheelNumber}個輪子滾不動了,嘎。。。`)
    }
    return {
        driving: driving,
        stop: stop
    }
}
var maruko = car('小丸子')
maruko.driving() // 小丸子 的汽車，4個輪子滾啊滾...
maruko.stop() // 小丸子 的汽車，4個輪子滾不動了,嘎。。。

var nobita = car('大雄')
nobita.driving() // 大雄 的汽車，4個輪子滾啊滾...
nobita.stop() // 大雄 的汽車，4個輪子滾不動了,嘎。。。

這。。。什麼鬼。是不是是有種素昧平生的覺得，這實在就是典範的閉包 ，jquery 年代許多插件 js 庫都採納這類體式格局去封裝自力的功用。說閉包也是繼續是不是是有點委曲，然則 javascript 里函數也是對象，閉包應用函數的作用域鏈來接見上層作用域的屬性和函數。固然像閉包如許不運用this去完成私有屬性比較貧苦, 閉包只合適單實例的場景。再舉一個栗子：

function GoToBed (name) {
    console.log(`${name}, 睡覺了...`)
}
function maruko () {
    let name = '小丸子'
    function dinner () {
        console.log(`${name}, 吃完晚飯`)
        GoToBed(name)
    }
    dinner()
}

function nobita () {
    let name = '大雄'
    function homework () {
        console.log(`${name}, 做完作業`)
        GoToBed(name)
    }
    homework()
}

maruko()
nobita()

// 小丸子, 吃完晚飯
// 小丸子, 睡覺了...
// 大雄, 做完作業
// 大雄, 睡覺了...

像上面栗子中如許，以面向歷程的體式格局將大眾要領抽離到上層作用域的用法比較罕見， 最少我很長時候都是這麼乾的。將GoToBed函數抽離到全局對象中，函數maruko、nobita 內部直接經由歷程作用域鏈查找GoToBed函數。這類鬆懈構造的代碼塊構造實在跟上面閉包寄義是差不多的。

所以根據作用域鏈來舉行大眾屬性、要領的治理嚴厲意義上不能算是繼續， 只能算是 javascript 面向歷程的一種代碼籠統剖析的體式格局，一種編程範式。這類範式編程是基於作用域鏈，與前面講的繼續是基於原型鏈的本質區別是屬性查找體式格局的差別。

全局對象 window 構成一個閉合上下文，假如我們將全部 window 對象假定為一個全局函數，一切建立的部分函數都是該函數的內部函數。當我們運用這個假定時許多題目就要清楚多了，全局函數在頁面被封閉前是一向存在的，且在存活時期為內嵌函數供應實行環境，一切內嵌函數都同享對全局環境的讀寫權限。

這類函數挪用時敕令式的，函數構造是嵌套的，運用閉包（函數嵌套）的體式格局來構造代碼流是無形式的一種常態。