周嵐

摘? 要：JavaScript是面向Web的編程語言，其高端、動(dòng)態(tài)以及面向?qū)ο蟮木幊田L(fēng)格，使得它已經(jīng)從一門簡單的腳本語言進(jìn)化成為一門強(qiáng)大的編程語言。JS的核心是支持面向?qū)ο蟮模瑫r(shí)它也提供了強(qiáng)大靈活的面向?qū)ο笳Z言的編程能力。本文針對(duì)JavaScript繼承機(jī)制的實(shí)現(xiàn)方式進(jìn)行了總結(jié)歸納，深入介紹了基于原型的繼承、構(gòu)造函數(shù)方式繼承、組合繼承、寄生式繼承等繼承機(jī)制，并分析了各自方式的優(yōu)缺點(diǎn)，便于讀者更深層次的理解JavaScript面向?qū)ο缶幊虣C(jī)制。

關(guān)鍵詞：原型鏈;繼承;原型對(duì)象;構(gòu)造函數(shù)

中圖分類號(hào)：TP311? ? ?文獻(xiàn)標(biāo)識(shí)碼：A

Research on JavaScript Inheritance Mechanism

ZHOU Lan

（Xuzhou Finance and Economics Branch，Jiangsu Union Technical Institute，Xuzhou 221008，China）

Abstract：Javascript is a web-oriented programming language.Its high-end，dynamic and object-oriented programming style has evolved from a simple scripting language to a powerful programming language.The core of JS is to support object-oriented，and it also provides powerful and flexible programming ability of object-oriented language.This paper summarizes the implementation of JavaScript inheritance mechanism，introduces the inheritance mechanism based on prototype，constructor，combination and parasitism，and analyzes the advantages and disadvantages of each method，which is convenient for readers to understand the JavaScript object-oriented programming mechanism.

Keywords：prototype chain;inheritance;prototype object;constructor

1? ?引言（Introduction）

JavaScript是面向Web的編程語言，其高端、動(dòng)態(tài)和面向?qū)ο蟮木幊田L(fēng)格，使得JavaScript已經(jīng)從一門簡單的腳本語言進(jìn)化成為一門強(qiáng)大的編程語言[1]。在面向?qū)ο螅∣OP）的程序設(shè)計(jì)范型中通常強(qiáng)調(diào)類的概念，早期的JavaScript中并沒有類的概念，JavaScript采用基于原型的繼承風(fēng)格，雖然使用起來非常靈活、高效，但對(duì)于初學(xué)者，要正確理解和使用原型對(duì)象及其繼承機(jī)制是非常困難的，本文對(duì)比類的繼承機(jī)制，并通過實(shí)例深入的討論了JavaScript特有的原型鏈繼承、構(gòu)造函數(shù)繼承、組合繼承、寄生組合繼承、class extend等多種繼承機(jī)制。希望能給初學(xué)者答疑解惑。

2? ?基于類的繼承（Class-based inheritance）

繼承是面向?qū)ο蟪绦蛑凶钪匾母拍钪?。繼承允許我們根據(jù)一個(gè)類來定義另一個(gè)類，當(dāng)創(chuàng)建一個(gè)類時(shí)，不需要完全重新編寫新的數(shù)據(jù)成員和數(shù)據(jù)函數(shù)，只需要設(shè)計(jì)一個(gè)新的類，繼承了已有的類的成員即可。這個(gè)已有的類被稱為基類（父類），新的類被稱為派生類（子類）。實(shí)現(xiàn)繼承的好處：（1）提高代碼重用性高。如果我們新創(chuàng)建的類與已有的類有絕大部分相類似，則沒有必要再重新定義這個(gè)完整的類。這樣做可以實(shí)現(xiàn)代碼的重用，大大減少了軟件開發(fā)的成本。（2）繼承可以實(shí)現(xiàn)面向?qū)ο蟮摹岸鄳B(tài)”特性。程序員可以將子類的對(duì)象直接賦值給父類的引用，無須再編寫顯式的類型[2]。

// 基類

public class Person

{

string _name;

public string Name

{

get {return _name;}

set {_name=value;}

}

public void Show（）

{

Console.WriteLine（"我是人，早上好！"）;

}

}

//派生類

public class Student：Person

{

public void? SayHello（）

{

base.Show（）;//調(diào)用父類Show方法

Console.WriteLine（"我是學(xué)生，早上好！"）;

}

}

上例中，class Student從class Person繼承而來，子類Student的對(duì)象就繼承了父類Person的所有非私有化成員。

3? ?基于原型的繼承（Prototype-based inheritance）

3.1? ?原型

在JavaScript中，只要?jiǎng)?chuàng)建一個(gè)新函數(shù)，就會(huì)根據(jù)一組特定規(guī)則為該函數(shù)創(chuàng)建一個(gè)prototype屬性，而這個(gè)屬性指向函數(shù)的原型對(duì)象。在默認(rèn)情況下，原型對(duì)象會(huì)自動(dòng)獲得一個(gè)constructor屬性，而這個(gè)屬性包含一個(gè)指向prototype屬性所在函數(shù)對(duì)象的指針[3]，如圖1所示。當(dāng)一個(gè)函數(shù)對(duì)象被創(chuàng)建時(shí)，function構(gòu)造器產(chǎn)生的函數(shù)對(duì)象會(huì)運(yùn)行代碼“：this.prototype={constructor：this};”。實(shí)例沒有prototype屬性，但是有__proto__屬性。函數(shù)同時(shí)有prototype和__proto__屬性。__proto__屬性雖然在ECMAScript6語言規(guī)范中標(biāo)準(zhǔn)化，但是不推薦被使用。

3.2? ?原型鏈

當(dāng)訪問一個(gè)對(duì)象的屬性時(shí)，先在對(duì)象的本身找，如果找不到就去對(duì)象的原型上找，如果還是找不到，就去對(duì)象的原型（原型也是對(duì)象，也有它自己的原型）的原型上找，如此繼續(xù)，直到找到為止，或者查找到最頂層的原型對(duì)象（原型鏈的頂端Object類型，Object.prototype.__proto__是原型鏈的頂端了，指向null）中也沒有找到，就結(jié)束查找，返回undefined，這條由對(duì)象及其原型組成的鏈就叫作原型鏈[4]，如圖2所示。

繼承存在的意義就是屬性共享，而原型鏈存在的意義就是繼承：訪問對(duì)象屬性時(shí)，在對(duì)象本身找不到，就在原型鏈上一層一層找。說白了就是一個(gè)對(duì)象可以訪問其他對(duì)象的屬性。如下列所示：

這種繼承方式的缺點(diǎn)是子類的實(shí)例可以訪問父類的私有屬性，子類的實(shí)例還可以更改該屬性，這樣不安全。

4? ?構(gòu)造函數(shù)方式繼承（Constructor mode inheritance）

如下例所示，構(gòu)造函數(shù)方式繼承，用.call（）和.apply（）將父類構(gòu)造函數(shù)引入子類函數(shù)，父類原型上的方法不會(huì)被子類繼承。

這種方式的優(yōu)點(diǎn)是，借用構(gòu)造函數(shù)可以解決原型中引用類型值被修改的問題，但是也存在一個(gè)問題，那就是，只能繼承父對(duì)象的實(shí)例屬性和方法，不能繼承父對(duì)象原型屬性和方法[5]。

5? ?組合繼承（Combinatorial inheritance）

組合繼承，就是原型鏈繼承+借用構(gòu)造函數(shù)。它的優(yōu)點(diǎn)是：（1）能夠在實(shí)例化子類對(duì)象的時(shí)候給繼承來的屬性賦值;（2）能夠繼承父類的原型對(duì)象中的方法。缺點(diǎn)是：繼承了兩次父類的模板，分別是call綁定和子類原型對(duì)象賦值的時(shí)候，如果繼承來的屬性特別多，這會(huì)很耗費(fèi)時(shí)間來維護(hù)[6]。

6? ?寄生式繼承（Parasitic inheritance）

寄生式繼承是通過Object.create（）將子類的原型繼承到父類的原型上。寄生式繼承其實(shí)就是對(duì)原型繼承的第二次封裝，在封裝過程中對(duì)繼承的對(duì)象進(jìn)行了擴(kuò)展，也存在原型繼承的缺點(diǎn)，這種思想的作用也是為了寄生組合式繼承模式的實(shí)現(xiàn)[7]。

7? ?ES6新增的Class（類）（ES6 new class）

ES6新增的Class（類），給我們編程帶來了極大方便，可以通過class聲明一個(gè)類，通過extends關(guān)鍵字來實(shí)現(xiàn)繼承關(guān)系。新的class寫法只是讓對(duì)象原型的寫法更加清晰、更像面向?qū)ο缶幊痰恼Z法而已，ES6中的類，實(shí)際上也是函數(shù)，寫法更加面向?qū)ο?，原理還是原型鏈[8]。

8? ?結(jié)論（Conclusion）

傳統(tǒng)基于類的面向?qū)ο笏季S在一定程度上妨礙了大家對(duì)JavaScript面向?qū)ο筇匦缘睦斫?，本文通過比較分析及舉例說明的研究方法深入討論了JavaScript的面向?qū)ο蟮睦^承的特性。它的弱類型，簡單易用性、解釋性和跨平臺(tái)性，使其在Web的應(yīng)用開發(fā)中可以說是無處不在，但它的無類動(dòng)態(tài)對(duì)象、原型鏈繼承、組合繼承、寄生式繼承等特性使其具有更高的靈活性[9]。所以，只有深入理解JavaScript中實(shí)現(xiàn)繼承的原理，實(shí)現(xiàn)繼承機(jī)制才可以變得游刃有余。

參考文獻(xiàn)（References）

[3] 呂遠(yuǎn).基于JavaScript原型鏈的繼承機(jī)制研究[J].江陰工學(xué)院學(xué)報(bào)，2017（10）：13-18.

[4] 石正喜.MySQL數(shù)據(jù)庫實(shí)用教程[M].北京：北京師范大學(xué)出版社，2014.

[5] 姜承堯.高性能網(wǎng)站MySQL數(shù)據(jù)庫實(shí)踐[J].程序員，2013（9）：

49-53.

[6] 黃華林，宋陽秋.JavaScript面向?qū)ο筇匦詼\析與范例[J].安慶師范學(xué)院學(xué)報(bào)：自然科學(xué)版，2005（4）：85-88.

[7] Zakas N C.JavaScript高級(jí)程序設(shè)計(jì)（第3版）[M].北京：人民郵電出版社，2015：147-161.

[8] Nicholas C，Zakas.JavaScript面向?qū)ο缶猍M].北京：人民郵電出版社，2014：53-60.

[9] Stoyan Stefanov，Kumar Chetan Sharma.JavaScript面向?qū)ο缶幊讨改希ǖ?版）[M].北京：人民郵電出版社，2015：4-6.

作者簡介：

周? 嵐（1977-），女，碩士，副教授.研究領(lǐng)域：程序設(shè)計(jì)，軟件開發(fā)與數(shù)據(jù)庫.