秒懂JS對象、構造器函數和原型對象之間的關系

學習JS的過程中，想要掌握面向對象的程序設計風格，對象模型（原型和繼承）是其中的重點和難點，拜讀了各類經典書籍和各位前輩的技術文章，感覺都太過高深，花費了不少時間才搞明白（個人智商是硬傷/(ㄒoㄒ)/~~），這里略作總結盡量通俗易懂。

一、基本概念

　　1、對象：屬性和方法的集合，即變量和函數的封裝。每個對象都有一個__proto__屬性，指向這個對象的構造函數的原型對象。

　　2、構造器函數：用於創建對象的函數，通過new關鍵字生成對象。函數名一般首字母大寫的。

　　3、原型對象：每個函數都有一個prototype屬性，它是一個指向原型對象的指針（原型對象在定義函數時同時被創建）

 

二、創建對象的方法

　　1、使用構造函數和原型對象共同創建

如上圖，構造器函數Person()，通過new關鍵字創建了兩個實例化對象p1、p2，這兩個新對象都繼承了，構造器Person()函數prototype屬性所指向的原型對象。通過構造函數創建實例對象p1和p2的時候，其中name、age、job這些是通過構造函數生成的（本地部分），sayName方法是通過繼承原型對象來實現共享的（遠程部分），這樣多個實例對象都是由本地（私有）和遠程（共享）兩部分組成。還是不清楚，沒關系我們上代碼。

function Person(name, age, job){//構造器函數
    this.name = name;
    this.age = age;
    this.job = job;
}
Person.prototype = {//設置構造器函數prototype指定的對象，即重置原型對象
    constructor : Person,
    sayName : function(){alert(this.name);}
}
var p1 = new Person("Tom", 29, "Teacher");//實例化對象p1
//{name:"Tom",age:29,job:"Teacher",__proto__:object}，object即原型對象：Person.prototype指向的對象
var p2 = new Person("Jack", 27, "Doctor");//實例化對象p2
//{name:"Jack",age:27,job:"Doctor",__proto__:object}

 

　　2、僅使用原型對象創建

如上圖，使用Object.create方法從原型對象直接生成新的實例對象，新對象p1繼承原型對象的屬性和方法，但是這里沒有用到構造函數


var person={ classname:'human'}//將這個對象當做原型
var p1=Object.create(person)//生成實例對象
console.log(p1.classname)//human，相當於p1.__proto__.classname

這樣表述還是感覺有些生硬，來點更形象的比喻吧~

構造函數是媽，原型對象是爸，實例對象是孩子。媽讓每個孩子擁有私有能力，爸讓它們擁有共有能力（這個共有能力其實都是爸代勞的/(ㄒoㄒ)/~~）；沒有構造函數的情況下，可以直接理解為克隆哦~怎么樣，這樣應該能理解三者之間的關系了吧。

 

當然創建對象的方法遠不止這兩種，這里有九種創建對象方法，oh no？我只想要個對象，為什么這么復雜？為了優化代碼，這個理由足夠吧。