new命令的原理

function Person(name, age) {
    this.name = name;
    this.age = age
}

var person = new Person('小明', 18);
console.log(person.name);  //小明
console.log(person.age);   //18

執行new命令會通過如下幾個步驟

  1. 建立一個空對象,這個對象將會是new Person()返回的對象實例;
  2. 將這個空對象的原型指向構造函數prototype屬性;
  3. 構造函數this指向空對象,並運行構造函數;
  4. 判斷構造函數返回的是否是對象,是的話返回默認對象,不是的話返回以前建立的空對象,沒有返回值默認返回空對象

用代碼解釋一下

function Person(name, age) {
    this.name = name;
    this.age = age
    //return '小明' //若是返回的不是Object類型,將忽略這個return 返回以前建立的空對象
   /* return {     //若是返回的是Object類型,直接返回這個對象
        'name' : '小花',
        'age' : 22
    } */
}

function _new(person, ...rest){
    var obj = {};  // 建立一個空對象,這個對象將會是返回的對象實例
    obj.__prototype__ = person.prototype; // 將這個空對象的原型指向person的prototype屬性;
    //上述兩步能夠合爲一步 :  var obj = Object.create(person.prototype)  
   
    var res = person.apply(obj, rest);  // 將person的this指向空對象,並運行person函數,apply命令綁定this後就會運行person
    return (typeof res === 'object' && res != null) ? res: obj;
    // 判斷res返回的是否是對象,是的話返res,不是的話返回以前建立的obj,沒有返回值默認返回obj
}

var xiaoming = _new(Person, '小明', 15)
console.log(xiaoming .name);  //小明
console.log(xiaoming .age);   //15

本篇如能對您有所幫助,實在是感到榮幸。若有不合理之處也請你們多多指點。app

相關文章
相關標籤/搜索