深刻理解javascript new的機制

咱們在使用對象的時候，除了一些瀏覽器內置的單體對象能夠直接使用外，都會new一個出來使用。

1.最簡單的莫過於以下獲取一個Object對象實例

var obj = new Object();

說明：此時的new關鍵字幹了最有用的一件事就是，繼承了全部Object.prototype上的方法，這個能夠去查看一下es5的參考資料中Object.prototype的方法列表。也就是說此時的obj對象能夠使用全部繼承而來的方法了！

2.然而是構造函數模式讓咱們對new有了一個深刻的瞭解！

function Person(name,age){
    this.name = name;
    this.age = age;
    this.sayName = function(){
        console.log(this.name);
    }
}
var person1 = new Person("wang",23);
var person2 = new Person("jiang",24);
var person3 = new Person;//當不傳參數的時候

咱們很容易知道構造函數使得每一個實例都獨自獲取了一份屬性和方法。可是這是怎麼實現出來的呢？

new過程當中發生了什麼？

1).建立一個對象。

2).將構造函數的做用域賦給新對象（所以this就指向了新對象）

3).執行構造函數中的代碼（爲新對象添加屬性）

4).返回新對象

值得注意的是它們的繼承關係是：person1/person2/person3繼承於Person,而Person繼承於Object(一切對象皆繼承於Object)

若是理解了上面的東西，在一些簡單編程中遇到new，基本也夠了。

下面繼續繼續介紹一些有關new的話題

3.模塊模式(Moudle模式)，下面講解一個最簡單的模塊模式例子

var Calculator = function (eq) {
    //這裏能夠聲明私有成員
    var name = 2;
    var eqCtl = document.getElementById(eq);

    return {
        // 暴露公開的成員
        name : name,
        add: function (x, y) {
            var val = x + y;
            eqCtl.innerHTML = val;
        }
    };
};
var c1 = new Calculator('eq');
var c2 = new Calculator('la');
c1.name = 3;//c1的name屬性改變了卻不會影響c2的name屬性
console.log(c1);
console.log(c2);
c1.add(2, 2);

值得注意的是，在Calculator這個構造函數中返回了一個對象！

說明：若是構造函數中返回了一個對象，（第4步）那麼new出來的對象將會被返回的對象覆蓋。模塊模式的結果是c1和c2都從返回的對象copy了一份屬性和方法，它們之間互不影響。

繼承關係也變了，c1和c2都直接繼承於Object