構造函數、實例和原型的概念和關系

每個函數都屬于對象，都會有一個屬性叫prototype。這個屬性指向一個對象，我們把他叫做當前函數的原型對象。原型對象下面有個屬性叫constructor.這個屬性指向當前函數。函數又分為普通函數和構造函數。這里我們說一下構造函數：

定義一個函數 ：

function Person(x, y ) {

this.age = x;

this.name = y;

}

var xiaoming= new Person(12, "xiaoming" );

這里創建實例對象 xiaoming的時候就是調用了Person構造函數，使xiaoming有了自己的屬性和方法，之后xiaoming和Person也就沒有什么直接交集了（可以理解為小明分手了，哎程序員好難╥..╥）

但是每個實例對象都會有一個隱藏屬性[[prototype]],這個屬性在chrome/firefox下叫__proto__，僅僅供學習調試用.它指向的就是構造函數的原型對象。

原型對象的深入理解

對于這個原型對象，我們就要重點理解下了。這個對象的作用就是為了讓所有的實例對象都能共享這個對象的屬性和方法（當然實例本身的屬性和方法優先級是高于原型的）。每個構造函數都會有一個默認的原型對象。我們只要在改原型對象上做文章就可以實現很多功能。

● 共享屬性和方法：

Person.prototype.eyes = 2;

Person.prototype.walk = function ( ){……}；

var xiaoming= new Person(12, "xiaoming" );

var xiaohong= new Person(12, "xiaohong" );

xiaoming.eyes

xiaohong.eyes

// 小明和小紅都有2只眼

xiaoming.walk

xiaohong.walk

//小明和小紅都會走路

● 原型鏈：

我們先做一個假設，假如我們把一個函數對象Man的原型直接給換成另一個函數對象Person的實例對象xiaoming會怎么樣呢？

前面說了，通過實例對象是可以找到函數對象Person的原型。那我們現在Man對象的實例xiaoming是不是也就可以訪問到Person對象的原型對象了呢。

function Man( ) {

this.beard = "xxx";

}

Man.prototype = new Person( 23, "xiaoming" );

這里我們相當于把默認的那個原型給重寫了，給參數其實就是給原型添加屬性和方法

var xiaoming = new Man();

xiaoming.beard //xxx 這里實例xiaoming自己的屬性（小明有胡子）

xiaoming.age //23

xiaoming.name //xiaoming 這兩個屬性是實例的原型上面的屬性（其實這個屬性是Person實例的屬性,但是現在的原型不就是Person實例嗎）

xiaoming.eyes //2 這個屬性呢，是Person的原型對象上面的了

這里我們基本上都可以訪問到，是不是有點繼承的味道了。

如果我們再這樣搞一個對象，也這么干，這里是不是就感覺像條鏈一樣。最頂端的對象是Object，也就是說到最后了。我們把這條鏈接方式叫做原型鏈。這也是繼承的依據。

繼承

和傳統的OOP語言來說，JavaScript語言比較蛋疼的是它沒有類這個機制。所以說我們事先js的繼承就從對象角度下手了。我們重點說一下依據原型鏈繼承的。（其他的繼承我就不說了，比如借用父對象的構造函數等，實用性不強）

1.上面所說的實現原型鏈的方法雖然有點繼承的味道了，但是你有沒有發現 實例化xiaoming這個對象的時候調用了Man這個構造函數，但是xiaoming自己的age和name都沒能進行構造，只不過是原型上的屬性而已（其實是Person自己構造的，new Person( 23, "xiaoming" )）。我們其實可以這樣用call和apply這個object原型下面給我們定義好的方法改進下(call和apply方法自己看api說明吧）

function Man(x, y) {

Person.call(this, x, y); //這里你可以這樣理解，this指的是Man,這樣其實就是借用Person構造函數

this.beard = "xxx";

}

我們把Man的構造函數這樣一改，實例化的時候傳參，這樣age和name這兩個屬性就是Man自己構造出來的了，并不會被共享

Man.prototype = new Person( );

Man.prototype.constructor = Man;

var xiaoming = new Man(23, "xiaoming");

這里只是讓Man的原型的構造函數變成原有的構造函數，如果不加這一句的話，那么Man原型的構造函數就變成undefied,因為實例和構造函數并沒有直接關系。這樣一來，原型找不到構造函數，這是非常蛋疼的事情，違反了原型鏈的定義啊。

這邊可能會有人問了，我為什么不自己像胡子beard 那個屬性一樣直接構造呢。

大哥，我這是舉例子，你以為實際的項目中就會有這么兩個屬性嗎。而且這樣不正是繼承的目的嗎

可以少寫很多代碼啊。（說多了都是淚）

但是也是有缺點的：兩次調用父類構造函數（第一次是在創建子類原型的時候，第二次是在子類構造函數內部）；子類繼承父類的屬性，一組在子類實例上，一組在子類原型上（在子類原型上創建不必要的多余的屬性,實例上的屏蔽原型上的同名屬性，是不是感覺有點多余了 ，效率低。

2.為了改進這種方法，下面說的這種繼承方式是借助我們偉大的道爺（這個人很厲害，自行百度）的靈感 。這種就是利用一個空函數對象來做一個橋梁.

具體實現方式如下:

function inherits(Child, Parent) {

var F = function () {};

F.prototype = Parent.prototype;

Child.prototype = new F();

Child.prototype.constructor = Child;

}

另外在子對象的構造函數中別忘了借用父對象的構造函數哦。（就是那個call或者apply方法）

這里和上面的區別是，子對象的原型現在不是父對象的實例了，變成了空函數對象的實例（父對象不用再創建兩次了，并且子對象的原型上也不會有啥屬性和方法了）。而空函數對象的原型變成了父對象的原型。前面我們說過，有了實例就能找到原型。所以現在子對象原型和父對象原型是就建立關系了。這種方式現在是最穩的方法，也已經被很多框架給寫到源碼里面了。

這里我們就用google closure 關于繼承的兩個api,這邊簡單舉個例子：

Child = function( ){

goog.base(this);

this.height = 12;

}

goog.inherits(Child, Parent);

這里就實現了我們上述實現的，不過封裝起來了而已。