JavaScript繼承機制研究

周嵐

摘? 要：JavaScript是面向Web的編程語言，其高端、動態以及面向對象的編程風格，使得它已經從一門簡單的腳本語言進化成為一門強大的編程語言。JS的核心是支持面向對象的，同時它也提供了強大靈活的面向對象語言的編程能力。本文針對JavaScript繼承機制的實現方式進行了總結歸納，深入介紹了基于原型的繼承、構造函數方式繼承、組合繼承、寄生式繼承等繼承機制，并分析了各自方式的優缺點，便于讀者更深層次的理解JavaScript面向對象編程機制。

關鍵詞：原型鏈;繼承;原型對象;構造函數

中圖分類號：TP311? ? ?文獻標識碼：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的編程語言，其高端、動態和面向對象的編程風格，使得JavaScript已經從一門簡單的腳本語言進化成為一門強大的編程語言[1]。在面向對象（OOP）的程序設計范型中通常強調類的概念，早期的JavaScript中并沒有類的概念，JavaScript采用基于原型的繼承風格，雖然使用起來非常靈活、高效，但對于初學者，要正確理解和使用原型對象及其繼承機制是非常困難的，本文對比類的繼承機制，并通過實例深入的討論了JavaScript特有的原型鏈繼承、構造函數繼承、組合繼承、寄生組合繼承、class extend等多種繼承機制。希望能給初學者答疑解惑。

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

繼承是面向對象程序中最重要的概念之一。繼承允許我們根據一個類來定義另一個類，當創建一個類時，不需要完全重新編寫新的數據成員和數據函數，只需要設計一個新的類，繼承了已有的類的成員即可。這個已有的類被稱為基類（父類），新的類被稱為派生類（子類）。實現繼承的好處：（1）提高代碼重用性高。如果我們新創建的類與已有的類有絕大部分相類似，則沒有必要再重新定義這個完整的類。這樣做可以實現代碼的重用，大大減少了軟件開發的成本。（2）繼承可以實現面向對象的“多態”特性。程序員可以將子類的對象直接賦值給父類的引用，無須再編寫顯式的類型[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（）;//調用父類Show方法

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

}

}

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

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

3.1? ?原型

在JavaScript中，只要創建一個新函數，就會根據一組特定規則為該函數創建一個prototype屬性，而這個屬性指向函數的原型對象。在默認情況下，原型對象會自動獲得一個constructor屬性，而這個屬性包含一個指向prototype屬性所在函數對象的指針[3]，如圖1所示。當一個函數對象被創建時，function構造器產生的函數對象會運行代碼“：this.prototype={constructor：this};”。實例沒有prototype屬性，但是有__proto__屬性。函數同時有prototype和__proto__屬性。__proto__屬性雖然在ECMAScript6語言規范中標準化，但是不推薦被使用。

3.2? ?原型鏈

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

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

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

4? ?構造函數方式繼承（Constructor mode inheritance）

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

這種方式的優點是，借用構造函數可以解決原型中引用類型值被修改的問題，但是也存在一個問題，那就是，只能繼承父對象的實例屬性和方法，不能繼承父對象原型屬性和方法[5]。

5? ?組合繼承（Combinatorial inheritance）

組合繼承，就是原型鏈繼承+借用構造函數。它的優點是：（1）能夠在實例化子類對象的時候給繼承來的屬性賦值;（2）能夠繼承父類的原型對象中的方法。缺點是：繼承了兩次父類的模板，分別是call綁定和子類原型對象賦值的時候，如果繼承來的屬性特別多，這會很耗費時間來維護[6]。

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

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

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

ES6新增的Class（類），給我們編程帶來了極大方便，可以通過class聲明一個類，通過extends關鍵字來實現繼承關系。新的class寫法只是讓對象原型的寫法更加清晰、更像面向對象編程的語法而已，ES6中的類，實際上也是函數，寫法更加面向對象，原理還是原型鏈[8]。

8? ?結論（Conclusion）

傳統基于類的面向對象思維在一定程度上妨礙了大家對JavaScript面向對象特性的理解，本文通過比較分析及舉例說明的研究方法深入討論了JavaScript的面向對象的繼承的特性。它的弱類型，簡單易用性、解釋性和跨平臺性，使其在Web的應用開發中可以說是無處不在，但它的無類動態對象、原型鏈繼承、組合繼承、寄生式繼承等特性使其具有更高的靈活性[9]。所以，只有深入理解JavaScript中實現繼承的原理，實現繼承機制才可以變得游刃有余。

參考文獻（References）

[3] 呂遠.基于JavaScript原型鏈的繼承機制研究[J].江陰工學院學報，2017（10）：13-18.

[4] 石正喜.MySQL數據庫實用教程[M].北京：北京師范大學出版社，2014.

[5] 姜承堯.高性能網站MySQL數據庫實踐[J].程序員，2013（9）：

49-53.

[6] 黃華林，宋陽秋.JavaScript面向對象特性淺析與范例[J].安慶師范學院學報：自然科學版，2005（4）：85-88.

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

[8] Nicholas C，Zakas.JavaScript面向對象精要[M].北京：人民郵電出版社，2014：53-60.

[9] Stoyan Stefanov，Kumar Chetan Sharma.JavaScript面向對象編程指南（第2版）[M].北京：人民郵電出版社，2015：4-6.

作者簡介：

周? 嵐（1977-），女，碩士，副教授.研究領域：程序設計，軟件開發與數據庫.