讀書筆記:深入理解ES6 (四)

第四章 擴展對象的功能性

第1節 對象類比

  1.1 對象的分類:

  • 普通對象
  • 特異對象(Exotic)
  • 標準對象
  • 內建對象

  1.2 四類對象的關係:

  

第2節 對象字面量語法擴展

  2.1 屬性初始值的所繫。

    原來是這樣聲明對象和其內部屬性:

function createPerson(name, age)
{
     return {
         name: name,
         age: age       
    }
}

    在ES6中,當 key 和 value 相同時,只寫一個。可以來這樣聲明對象和其內部屬性:

 function createPerson(name, age)
 {
      return {
           name,
           age   
      }
 }

    即可。

 

  2.2 對象方法的縮寫。

    在ES6中,同樣也可以對方法進行一定的簡寫。在ES5的時候,我們這樣寫方法:

var person = {
    name: 'foo',
    sayName: function() {
        console.log(this.name);
    }
}

    在ES6中,可以這樣簡寫方法:

var person = {
    name: "foo",
    sayName() {
        console.log(this.name);
    }
}

    可以看到,在ES中,省略了冒號和function關鍵字。

 

  2.3 可計算屬性名(Computed Property Name)

    在ES6中,當對象通過“[ ]”獲取屬性值時,該屬性名可以用 “字符串 + 變量”的方式來寫,然後對象可以根據該最終拼接後的值來獲取到屬性的名字,進而獲取到屬性的值。

 

第3節 新增方法

  3.1 Object.is()

  該方法接收兩個參數,判斷它們是否相等。與全等“===”類似。但是有兩個特例:

    1)參數:+0 和 -0

console.log(+0 === -0); //true
console.log(Object.is(+0, -0)); //false

    2) 參數:NaN

console.log(NaN === NaN); //false
console.log(Object.is(NaN, NaN)); //true

  3.2 Object.assign()

    類似於mixin()方法,共2個參數,將第2個參數複製到第1個參數中。

 

第4節 重複的對象字面量屬性

  在ES5中,有重複的屬性名時,程序會報錯;

  在ES6中,有重複的屬性名時,程序不會報錯,而是獲取最後一個屬性的值。

 

第5節 自有屬性枚舉順序

  5.1 在ES5中沒有定義對象屬性的枚舉順序,在ES6中,嚴格規定了對象的自有屬性被枚舉時的返回順序。

  5.2 自有屬性枚舉順序的規則:

    1)所有數字鍵按升序排序;

    2)所有字符串鍵按照它們被加入對象的順序排序;

    3)所有symbol鍵按它們被加入對象的順序排序。

   舉例:

var obj = {
    a: 1,
    0: 1,
    c: 1,
    2: 1,
    b: 1,
    1: 1
}
obj.d = 1;
console.log( Object.getOwnPropertyNames(obj).join("") ); // "012adcd"

  5.3 注意:1)數值鍵在枚舉時會被重新組合和排序;

         2)先枚舉數字,再枚舉字符串

 

第6節 增強對象原型

  爲了讓開發者獲得更多對原型的控制力,於是ES6對原型進行了修改。

  6.1 改變原型對象。

    在ES6中,添加了Object.setPropertyOf()方法來改變原型的對象及替代第一個參數原型的對象。

  6.2 簡化原型方法的 Super 引用。

    1)ES6中的許多的改進目的就是爲了使其更加易用。所以,ES6中引入了Super引用的屬性,通過它可以更便捷地訪問對象原型。

    2)Super引用相當於指向對象原型的指針,並且在多重繼承的情況下非常有用。

 

第7節 正式的方法定義

  7.1 ES6中正式定義了“方法” 的概念。

    即在對象的內部的函數叫方法,沒有在對象內部的函數叫函數。例如:

 1 let person = {
 2     //是方法
 3     getGreetings() {
 4         return 'Hello'
 5     }
 6 };
 7 
 8 //不是方法
 9 function shareGreeting() {
10     return 'Hi'
11 }

  7.2 [[ HomeObject ]]屬性

  對於“方法”,其會有一個內部的[[ HomeObject ]]屬性來容納這個方法從屬的對象。在上面的例子中,getGreeting()方法的[[ HomeObject ]]屬性值即爲person。

    

(本節完)

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章