為何用“繼承”為標題，而不用“原型鏈”？

原型鏈如果解釋清楚了很容易理解，不會與常用的java/C#產生混淆。而“繼承”確實常用面向對象語言中最基本的概念，但是java中的繼承與javascript中的繼承又完全是兩回事兒。因此，這裏把“繼承”著重拿出來，就為了體現這個不同。

javascript中的繼承是通過原型鏈來體現的。先看幾句代碼

以上代碼中，f1是Foo函數new出來的對象，f1.a是f1對象的基本屬性，f1.b是怎麽來的呢？——從Foo.prototype得來，因為f1.__proto__指向的是Foo.prototype

訪問一個對象的屬性時，先在基本屬性中查找，如果沒有，再沿著__proto__這條鏈向上找，這就是原型鏈

看圖說話：

上圖中，訪問f1.b時，f1的基本屬性中沒有b，於是沿著__proto__找到了Foo.prototype.b。

那麽我們在實際應用中如何區分一個屬性到底是基本的還是從原型中找到的呢？大家可能都知道答案了——hasOwnProperty，特別是在for…in…循環中，一定要註意。

等等，不對！ f1的這個hasOwnProperty方法是從哪裏來的？ f1本身沒有，Foo.prototype中也沒有，哪兒來的？

好問題。

它是從Object.prototype中來的，請看圖：

對象的原型鏈是沿著__proto__這條線走的，因此在查找f1.hasOwnProperty屬性時，就會順著原型鏈一直查找到Object.prototype。

由於所有的對象的原型鏈都會找到Object.prototype，因此所有的對象都會有Object.prototype的方法。這就是所謂的“繼承”。

當然這只是一個例子，你可以自定義函數和對象來實現自己的繼承。

說一個函數的例子吧。

我們都知道每個函數都有call，apply方法，都有length，arguments，caller等屬性。為什麽每個函數都有？這肯定是“繼承”的。函數由Function函數創建，因此繼承的Function.prototype中的方法。不信可以請微軟的Visual Studio老師給我們驗證一下：

看到了吧，有call、length等這些屬性。

那怎麽還有hasOwnProperty呢？——那是Function.prototype繼承自Object.prototype的方法。有疑問可以看看上一節將instanceof時候那個大圖，看看Function.prototype.__proto__是否指向Object.prototype。

原型、原型鏈，大家都明白了嗎？

---------------------------------------------------------------------------

本文已更新到《深入理解javascript原型和閉包系列》的目錄，更多內容可參見《深入理解javascript原型和閉包系列》。

另外，歡迎關註我的微博。

學習作者教程：《前端JS高級面試》《前端JS基礎面試題》《React.js模擬大眾點評webapp》《zepto設計與源碼分析》《json2.js源碼解讀》

深入理解javascript原型和閉包（6）——繼承