JavaScript 語(yǔ)言本身的設(shè)計(jì)缺陷，誤打誤撞，成了解釋最為徹底的“世界原本的樣子”的計(jì)算機(jī)編程語(yǔ)言;

——西嶺《凡人凡語(yǔ)》

Everything is object (萬(wàn)物皆對(duì)象)，JS 語(yǔ)言中將一切都視為 對(duì)象 。

JavaScript 語(yǔ)言的對(duì)象體系，不基于“類(lèi)” 創(chuàng)建對(duì)象，是基于構(gòu)造函數(shù)(constructor)和原型鏈(prototype)。

簡(jiǎn)單方式創(chuàng)建對(duì)象

我們可以直接通過(guò) new Object() 創(chuàng)建：

var person = new Object() 
person.name = 'Jack' 
person.age = 18 
 
person.sayName = function () { 
    console.log(this.name) 
} 

字面量方式創(chuàng)建對(duì)象

每次創(chuàng)建通過(guò) new Object() 比較麻煩，所以可以通過(guò)它的簡(jiǎn)寫(xiě)形式對(duì)象字面量來(lái)創(chuàng)建：

var person = { 
  name: 'Jack', 
  age: 18, 
  sayName: function () { 
    console.log(this.name) 
  } 
} 

構(gòu)造函數(shù)

JavaScript 語(yǔ)言使用構(gòu)造函數(shù)作為對(duì)象的模板。

所謂 "構(gòu)造函數(shù)"，就是一個(gè)普通的函數(shù)，只不過(guò)我們專(zhuān)門(mén)用它來(lái)生成對(duì)象，這樣使用的函數(shù)，就是構(gòu)造函數(shù)。

它提供模板，描述對(duì)象的基本結(jié)構(gòu)。一個(gè)構(gòu)造函數(shù)，可以生成多個(gè)對(duì)象，這些對(duì)象都有相同的結(jié)構(gòu)。

function Person (name, age) { 
  this.name = name 
  this.age = age 
  this.sayName = function () { 
    console.log(this.name) 
  } 
} 
 
var p1 = new Person('Jack', 18) 
p1.sayName() // => Jack 
 
var p2 = new Person('Mike', 23) 
p2.sayName() // => Mike 

解析構(gòu)造函數(shù)代碼的執(zhí)行

在上面的示例中，使用 new 操作符創(chuàng)建 Person 實(shí)例對(duì)象;

以這種方式調(diào)用構(gòu)造函數(shù)會(huì)經(jīng)歷以下 5 個(gè)步驟：

• 創(chuàng)建一個(gè)空對(duì)象，作為將要返回的對(duì)象實(shí)例。
• 將這個(gè)空對(duì)象的原型，指向構(gòu)造函數(shù)的prototype屬性。先記住，后面講
• 將這個(gè)空對(duì)象賦值給函數(shù)內(nèi)部的this關(guān)鍵字。
• 執(zhí)行構(gòu)造函數(shù)內(nèi)部的代碼。
• 返回新對(duì)象 (this)

function Person (name, age) { 
  // 當(dāng)使用 new 操作符調(diào)用 Person() 的時(shí)候，實(shí)際上這里會(huì)先創(chuàng)建一個(gè)對(duì)象 
  // 然后讓內(nèi)部的 this 指向新創(chuàng)建的對(duì)象 
  // 接下來(lái)所有針對(duì) this 的操作實(shí)際上操作的就是剛創(chuàng)建的這個(gè)對(duì)象 
 
  this.name = name 
  this.age = age 
  this.sayName = function () { 
    console.log(this.name) 
  } 
 
  // 在函數(shù)的結(jié)尾處會(huì)將 this 返回，也就是這個(gè)新對(duì)象 
} 

構(gòu)造函數(shù)和實(shí)例對(duì)象的關(guān)系

構(gòu)造函數(shù)是根據(jù)具體的事物抽象出來(lái)的抽象模板，實(shí)例對(duì)象是根據(jù)抽象的構(gòu)造函數(shù)模板得到的具體實(shí)例對(duì)象。

實(shí)例對(duì)象由構(gòu)造函數(shù)而來(lái)，一個(gè)構(gòu)造函數(shù)可以生成很多具體的實(shí)例對(duì)象，而每個(gè)實(shí)例對(duì)象都是獨(dú)一無(wú)二的。

每個(gè)對(duì)象都有一個(gè) constructor 屬性，該屬性指向創(chuàng)建該實(shí)例的構(gòu)造函數(shù)。

反推出來(lái)，每一個(gè)對(duì)象都有其構(gòu)造函數(shù)

console.log(p1.constructor === Person) // => true 
console.log(p2.constructor === Person) // => true 
console.log(p1.constructor === p2.constructor) // => true 

因此，我們可以通過(guò)實(shí)例對(duì)象的 constructor 屬性判斷實(shí)例和構(gòu)造函數(shù)之間的關(guān)系。

構(gòu)造函數(shù)存在的問(wèn)題

以構(gòu)造函數(shù)為模板，創(chuàng)建對(duì)象，對(duì)象的屬性和方法都可以在構(gòu)造函數(shù)內(nèi)部定義。

function Cat(name, color) { 
  this.name = name; 
  this.color = color; 
  this.say = function () { 
    console.log('hello'+this.name,this.color); 
  }; 
} 
var cat1 = new Cat('貓', '白色');  
var cat2 = new Cat('貓', '黑色');  
cat1.say(); 
cat2.say(); 

在該示例中，從表面上看好像沒(méi)什么問(wèn)題，但是實(shí)際上這樣做，有一個(gè)很大的弊端。那就是對(duì)于每一個(gè)實(shí)例對(duì)象， name 和 say 都是一模一樣的內(nèi)容，每一次生成一個(gè)實(shí)例，都必須為重復(fù)的內(nèi)容，多占用一些內(nèi)存，如果實(shí)例對(duì)象很多，會(huì)造成極大的內(nèi)存浪費(fèi)。

那么，能不能將相同的內(nèi)容，放到公共部分，節(jié)約計(jì)算機(jī)資源呢?

原型

JavaScript 的每個(gè)對(duì)象都會(huì)繼承一個(gè)父級(jí)對(duì)象，父級(jí)對(duì)象稱(chēng)為 原型 (prototype) 對(duì)象。

原型也是一個(gè)對(duì)象，原型對(duì)象上的所有屬性和方法，都能被子對(duì)象 (派生對(duì)象) 共享，通過(guò)構(gòu)造函數(shù)生成實(shí)例對(duì)象時(shí)，會(huì)自動(dòng)為實(shí)例對(duì)象分配原型對(duì)象。而每一個(gè)構(gòu)造函數(shù)都有一個(gè)prototype屬性，這個(gè)屬性就是實(shí)例對(duì)象的原型對(duì)象。

null 沒(méi)有自己的原型對(duì)象。

這也就意味著，我們可以把所有對(duì)象實(shí)例需要共享的屬性和方法直接定義在構(gòu)造函數(shù)的 prototype 屬性上，也就是實(shí)例對(duì)象的原型對(duì)象上。

function Cat(color) { 
  this.color = color; 
} 
 
Cat.prototype.name = "貓"; 
Cat.prototype.sayhello = function(){ 
    console.log('hello'+this.name,this.color); 
} 
Cat.prototype.saycolor = function (){ 
    console.log('hello'+this.color); 
} 
 
var cat1 = new Cat('白色');  
var cat2 = new Cat('黑色');  
cat1.sayhello(); 
cat2.saycolor(); 

這時(shí)所有實(shí)例對(duì)象的 name 屬性和 sayhello() 、saycolor 方法，其實(shí)都是在同一個(gè)內(nèi)存地址的對(duì)象中，也就是構(gòu)造函數(shù)的 prototype 屬性上，因此就提高了運(yùn)行效率節(jié)省了內(nèi)存空間。

原型及原型鏈