由一道小題引起的對ECMA規範的瀏覽

由夕姐一道題引起的對ECMA規範的瀏覽

有幸參加前端小姐姐Step-By-Setp的活動，因一道題發現本身的基礎至關薄弱，以前都是看大佬們的文章，百度，mdn,畏懼去讀一些規範相關的東西，不免出現不理解和不全面的狀況。所以就着當前的問題，讀了一下下ECMA的規範，本文僅做學習筆記。

題目：如何讓 (a == 1 && a == 2 && a == 3) 的值爲true？
來源：github.com/YvetteLau/S…

本題主要考察的知識點有三個：

• == 操做運算符的下數據的隱式類型轉換
• 數據的隱式類型轉換作了什麼
• 數據劫持

1. 首先 == 操做運算符的數據隱式類型轉換，如下是ECMA2016原文

   

   能夠看到是先轉換爲原始數據類型再進行比較。若是a本就是原始數據類型，則不能(也許有我不知道的方法)同時等於1，2，3，因1此a是Object類型，則按8，9條規則做ToPrimitive處理。

2. ToPrimitive

   

   能夠看到原始數據類型是不變，Object類型有如下規則

3. Object => Primitive規則

   

• 若是有@@toPrimitive方法，則使extoicToPrim方法指向該方法，即Symbol.toPrimitive
• 若是沒有，則使用默認的方法，下文可得知是valueOf和toString
• 默認方法會根據hint值判斷使用valueOf仍是toString，其中根據第6條，默認是number，即便用valueOf，可是有例外是Date(下面說)
• 根據下面方框第5條，會將可執行的方法排成列表依次執行，若是得到原始類型則返回，不然返回result，繼續執行。都沒成功，則報錯。
• Note提示顯示Symbol和Date重寫了該行爲使用@@toPrimitive方法，此處便是Symbol.toPrimitive

4. 特殊對象，Date

   

   從Date的標準中能夠看出，Date的默認hint是String而不是Number，即默認調用toString. 這樣是爲何使用 + new Date()返回時間戳的緣由，使用+運算符改變hint爲number。 而Date的Symbol.toPrimitive在不傳hint，默認的狀況下則會報錯。

測試以下：

1. valueOf和toString的優先級

var a = [1,2,3]
a.valueOf = function(){
    console.log('調用valueOf');
    
    return 3;
}
a.toString = function(){
    console.log('調用toString');
    return this;
}

a == 3  //「調用valueOf」 「調用toString」
var b = [1,2]
b[a] //「調用toString」 「調用valueOf」

複製代碼

2. Symbol.toPrimitive優先級

//Symbol.toPrimitive優先級最高
let a = {
    [Symbol.toPrimitive]: () => 2,
    valueOf :function(){
        console.log('調用valueOf');
        return 3
    },
    toString :function(){
        console.log('調用toString');
        return 4;
    }
};
a == 2 //true
複製代碼

3. Date

var date = new Date();
d //Fri May 24 2019 06:41:02 GMT+0800 (中國標準時間)
+d //1558651262982
date[Symbol.toPrimitive]('number');//1558651262982
date[Symbol.toPrimitive]();//error
複製代碼

而關於本道題的答案，大佬們的回答很好且全面，直接看github的issue便可。此處不寫。

參考文獻

1. [ECMAScript® 2016 Language Specification]
   www.ecma-international.org/ecma-262/7.…
2. [ECMAScript7規範中的ToPrimitive抽象操做] blog.csdn.net/weixin_3409…
3. [前端小姐姐對於問題的解答]
   github.com/YvetteLau/S…