0.注

本文代碼來自于《JavaScript高級(jí)程序設(shè)計(jì)》一書曼月，非原創(chuàng)谊却，算是小弟讀書筆記。而且我也不認(rèn)為自己寫的實(shí)例代碼能比Zakas的更清晰易懂哑芹。主要記錄下自己認(rèn)為干貨的部分以及加入自己的理解炎辨。文中示意圖等均為原創(chuàng)。

1.對象聪姿？

ECMA的定義：無序?qū)傩缘募喜晗簦鋵傩钥梢园局狄亦帧ο蠡蛘吆瘮?shù)。
我自己的理解破喻，對象就是一個(gè)包含了若干鍵值對的無序列表虎谢。

2.創(chuàng)建對象的方式

• 工廠模式（其實(shí)并沒什么卵用）
  使用一個(gè)函數(shù)封裝創(chuàng)建對象的全過程：創(chuàng)建一個(gè)臨時(shí)對象、為這個(gè)對象添加屬性曹质、最后將這個(gè)對象返回

  //代碼來自《JavaScript高級(jí)程序設(shè)計(jì)》
   function createPerson(name,age,job) {
       var o = new Object();
       o.name = name;
       o.age = age;
       o.job = job;
       o.sayName = function () {
           alert(this.name);
       };
       return o;
   }
   var person1 = createPerson('gordenZ','24','front-end engineer');
     ```

* 構(gòu)造函數(shù)模式（問題也大婴噩，不會(huì)直接用）
  ```javascript
   //代碼來自《JavaScript高級(jí)程序設(shè)計(jì)》
   function Person(name,age,job) {
       this.name = name;
       this.age = age;
       this.job = job;
       this.sayName = function () {
           alert(this.name);
       };
   }
   var person1 = new Person('gordenZ','24','front-end engineer');
     ```
這個(gè)例子中，創(chuàng)建了一個(gè)構(gòu)造函數(shù)`Person`羽德，并使用`new`操作符實(shí)例化了一個(gè)對象`person1`几莽。
**為何要使用new 操作符？**
想像一下不使用new的情況：
```javascript
var person1 = Person('gordenZ','24','front-end engineer');
 console.log(name);//gordenZ

如果不使用new操作符宅静，相當(dāng)于在當(dāng)前環(huán)境下直接執(zhí)行Person這個(gè)函數(shù)（構(gòu)造函數(shù)也是函數(shù)章蚣，僅僅是第一個(gè)字母大寫了）。這里的執(zhí)行環(huán)境是window姨夹，那么Person中的this就指向了全局的window對象纤垂，所以name、age磷账、job洒忧、sayName等屬性都被創(chuàng)建在了全局對象上，可以直接被訪問到够颠。
new操作符干的事情：
1.創(chuàng)建一個(gè)新對象
2.將構(gòu)造函數(shù)的this指向這個(gè)對象（這樣就不再是創(chuàng)建到window上了）
3.執(zhí)行構(gòu)造函數(shù)
4.返回新對象
其實(shí)跟工廠模式?jīng)]有什么區(qū)別嘛
構(gòu)造函數(shù)模式問題：
構(gòu)造函數(shù)模式創(chuàng)建的每個(gè)對象的實(shí)例都是完全獨(dú)立的熙侍，意味著每個(gè)實(shí)例中的屬性都是不同的，這對于值是基本數(shù)據(jù)類型的屬性來說還好履磨，但是對于值是一個(gè)實(shí)現(xiàn)同一功能的函數(shù)的屬性來說就顯得冗余了蛉抓，每一個(gè)實(shí)例都會(huì)有一個(gè)自己的函數(shù)，有多少個(gè)實(shí)例就會(huì)創(chuàng)建多少個(gè)相同的函數(shù)（不要忘了剃诅，每個(gè)函數(shù)都是一個(gè)對象）巷送。

• 原型模式
  js中每一個(gè)函數(shù)都有一個(gè)prototype（即原型）屬性，指向一個(gè)對象矛辕，其功能是保存用這個(gè)函數(shù)類型創(chuàng)建的實(shí)例所共享的屬性和方法笑跛。所以我們可以把需要在各個(gè)實(shí)例上共享的屬性和方法放到這個(gè)類型的prototype中，即可只創(chuàng)建一次而被各實(shí)例所共享聊品。

function Person() {
}
Person.prototype.name = "gordenZ";
Person.prototype.age = "24";
Person.prototype.job = "front-end engineer";
Person.prototype.sayName = function () {
    alert(this.name);
};
 var person1 = new Person();
 var person2 = new Person();

  console.log(person1.sayName === person2.sayName); //true

其中飞蹂，Person是構(gòu)造函數(shù)、Person.prototype是原型對象翻屈、person1和person2是Person的實(shí)例陈哑，這三者的關(guān)系如下圖：

構(gòu)造函數(shù)、原型對象、實(shí)例之間的關(guān)系

person1.sex = "man"

2.可以在實(shí)例中添加與原型中屬性相同的屬性哭尝，這樣會(huì)屏蔽掉原型中的同名屬性。尋找屬性的方式是剖煌，首先在實(shí)例本身找材鹦，找到了就返回，如果沒有找到耕姊，則到__proto__指針指向的原型對象上尋找桶唐。

person1.name = "grey"
console.log(person1.name) //grey 

3.其他實(shí)例若沒有添加，則不受影響

console.log(person2.name) //gordenZ茉兰。

4.判斷是原型屬性還是實(shí)例屬性：hasOwnProperty()

console.log(person1.hasOwnProperty('name'));//true
console.log(person2.hasOwnProperty('name'));//false

5.判斷對象是否是一個(gè)實(shí)例的原型：isPrototypeOf()

console.log(Person.prototype.isPrototypeOf(person1));//true
console.log(Person.prototype.isPrototypeOf(person1));//true

6.獲取一個(gè)實(shí)例的原型：Object.getPrototypeOf()

console.log(Object.getPrototypeOf(person1) == Person);//true

原型模式的問題
高度共享帶來問題尤泽，在共享的屬性中，如果是數(shù)據(jù)屬性规脸，可以用在實(shí)例上添加同名屬性來屏蔽坯约，但如果某個(gè)屬性是一個(gè)引用類型，那么在任何一個(gè)實(shí)例上對其進(jìn)行修改莫鸭，都會(huì)影響到所有實(shí)例闹丐。

• 組合使用構(gòu)造函數(shù)模式和原型模式
  1.將每個(gè)實(shí)例自有的屬性寫在構(gòu)造函數(shù)中，即實(shí)例屬性
  2.將所有實(shí)例共享的方法寫在原型對象中被因，即原型屬性
  3.若直接使用對象字面量替換原型對象卿拴，需要將constructor屬性補(bǔ)全

function Person(name,age,job) {
        this.name = name;
        this.age = age;
        this.job = job;
        this.friends = ["aa","bb"];
}
Person.prototype = {
    //補(bǔ)全constructor屬性
    constructor:Person,
    sayName:function () {
       alert(this.name)
    }
};
var person1 = new Person();
var person2 = new Person();