一 對象的概念

“面向對象編程”（Object Oriented Programming，縮寫為OOP）是目前主流的編程范式。它的核心思想是將真實世界中各種復雜的關系，抽象為一個個對象，然后由對象之間的分工與合作，完成對真實世界的模擬。

傳統的過程式編程（procedural programming）由一系列函數或一系列指令組成，而面向對象編程的程序由一系列對象組成。每一個對象都是功能中心，具有明確分工，可以完成接受信息、處理數據、發出信息等任務。因此，面向對象編程具有靈活性、代碼的可重用性、模塊性等特點，容易維護和開發，非常適合多人合作的大型軟件項目。

那么，“對象”（object）到底是什么？

我們從兩個層次來理解。

（1）“對象”是單個實物的抽象。

一本書、一輛汽車、一個人都可以是“對象”，一個數據庫、一張網頁、一個與遠程服務器的連接也可以是“對象”。當實物被抽象成“對象”，實物之間的關系就變成了“對象”之間的關系，從而就可以模擬現實情況，針對“對象”進行編程。

（2）“對象”是一個容器，封裝了“屬性”（property）和“方法”（method）。

所謂“屬性”，就是對象的狀態；所謂“方法”，就是對象的行為（完成某種任務）。比如，我們可以把動物抽象為animal對象，“屬性”記錄具體是那一種動物，“方法”表示動物的某種行為（奔跑、捕獵、休息等等）。

二 構造函數

“面向對象編程”的第一步，就是要生成“對象”。

前面說過，“對象”是單個實物的抽象。通常需要一個模板，表示某一類實物的共同特征，然后“對象”根據這個模板生成。

典型的面向對象編程語言（比如 C++ 和 Java），存在“類”（class）這個概念。所謂“類”就是對象的模板，對象就是“類”的實例。但是，JavaScript語言的對象體系，不是基于“類”的，而是基于構造函數（constructor）和原型鏈（prototype）。

JavaScript語言使用構造函數（constructor）作為對象的模板。所謂“構造函數”，就是專門用來生成“對象”的函數。它提供模板，描述對象的基本結構。一個構造函數，可以生成多個對象，這些對象都有相同的結構。

構造函數的寫法就是一個普通的函數，但是有自己的特征和用法。

var Vehicle=function(){

this.price=1000;

};

上面代碼中，Vehicle就是構造函數，它提供模板，用來生成對象實例。為了與普通函數區別，構造函數名字的第一個字母通常大寫。

構造函數的特點有兩個。

三 new 命令

基本用法

new命令的作用，就是執行構造函數，返回一個實例對象。

varVehicle=function(){this.price=1000;};varv=newVehicle();v.price// 1000

上面代碼通過new命令，讓構造函數Vehicle生成一個實例對象，保存在變量v中。這個新生成的實例對象，從構造函數Vehicle繼承了price屬性。在new命令執行時，構造函數內部的this，就代表了新生成的實例對象，this.price表示實例對象有一個price屬性，它的值是1000。

使用new命令時，根據需要，構造函數也可以接受參數。

varVehicle=function(p){this.price=p;};varv=newVehicle(500);

new命令本身就可以執行構造函數，所以后面的構造函數可以帶括號，也可以不帶括號。下面兩行代碼是等價的。

varv=newVehicle();varv=newVehicle;

一個很自然的問題是，如果忘了使用new命令，直接調用構造函數會發生什么事？

這種情況下，構造函數就變成了普通函數，并不會生成實例對象。而且由于后面會說到的原因，this這時代表全局對象，將造成一些意想不到的結果。

varVehicle=function(){this.price=1000;};varv=Vehicle();v.price// Uncaught TypeError: Cannot read property 'price' of undefinedprice// 1000

上面代碼中，調用Vehicle構造函數時，忘了加上new命令。結果，price屬性變成了全局變量，而變量v變成了undefined。

因此，應該非常小心，避免出現不使用new命令、直接調用構造函數的情況。為了保證構造函數必須與new命令一起使用，一個解決辦法是，在構造函數內部使用嚴格模式，即第一行加上use strict。

functionFubar(foo,bar){'use strict';this._foo=foo;this._bar=bar;}Fubar()// TypeError: Cannot set property '_foo' of undefined

上面代碼的Fubar為構造函數，use strict命令保證了該函數在嚴格模式下運行。由于在嚴格模式中，函數內部的this不能指向全局對象，默認等于undefined，導致不加new調用會報錯（JavaScript不允許對undefined添加屬性）。

另一個解決辦法，是在構造函數內部判斷是否使用new命令，如果發現沒有使用，則直接返回一個實例對象。

functionFubar(foo,bar){if(!(thisinstanceofFubar)){returnnewFubar(foo,bar);}this._foo=foo;this._bar=bar;}Fubar(1,2)._foo// 1(newFubar(1,2))._foo// 1

上面代碼中的構造函數，不管加不加new命令，都會得到同樣的結果。

new命令的原理

使用new命令時，它后面的函數調用就不是正常的調用，而是依次執行下面的步驟。

創建一個空對象，作為將要返回的對象實例

將這個空對象的原型，指向構造函數的prototype屬性

將這個空對象賦值給函數內部的this關鍵字

開始執行構造函數內部的代碼

也就是說，構造函數內部，this指的是一個新生成的空對象，所有針對this的操作，都會發生在這個空對象上。構造函數之所以叫“構造函數”，就是說這個函數的目的，就是操作一個空對象（即this對象），將其“構造”為需要的樣子。

如果構造函數內部有return語句，而且return后面跟著一個對象，new命令會返回return語句指定的對象；否則，就會不管return語句，返回this對象。

varVehicle=function(){this.price=1000;return1000;};(newVehicle())===1000// false

上面代碼中，構造函數Vehicle的return語句返回一個數值。這時，new命令就會忽略這個return語句，返回“構造”后的this對象。

但是，如果return語句返回的是一個跟this無關的新對象，new命令會返回這個新對象，而不是this對象。這一點需要特別引起注意。

varVehicle=function(){this.price=1000;return{price:2000};};(newVehicle()).price// 2000

上面代碼中，構造函數Vehicle的return語句，返回的是一個新對象。new命令會返回這個對象，而不是this對象。

另一方面，如果對普通函數（內部沒有this關鍵字的函數）使用new命令，則會返回一個空對象。

functiongetMessage(){return'this is a message';}varmsg=newgetMessage();msg// {}typeofmsg// "Object"

上面代碼中，getMessage是一個普通函數，返回一個字符串。對它使用new命令，會得到一個空對象。這是因為new命令總是返回一個對象，要么是實例對象，要么是return語句指定的對象。本例中，return語句返回的是字符串，所以new命令就忽略了該語句。

new命令簡化的內部流程，可以用下面的代碼表示。

function_new(/* 構造函數 */constructor,/* 構造函數參數 */param1){// 將 arguments 對象轉為數組varargs=[].slice.call(arguments);// 取出構造函數varconstructor=args.shift();// 創建一個空對象，繼承構造函數的 prototype 屬性varcontext=Object.create(constructor.prototype);// 執行構造函數varresult=constructor.apply(context,args);// 如果返回結果是對象，就直接返回，則返回 context 對象return(typeofresult==='object'&&result!=null)?result:context;}// 實例varactor=_new(Person,'張三',28);

new.target

函數內部可以使用new.target屬性。如果當前函數是new命令調用，new.target指向當前函數，否則為undefined。

functionf(){console.log(new.target===f);}f()// falsenewf()// true