研究js加號操作符的時候,無意中試驗了一個
console.log({}+"str");//NaN
發現結果居然是NaN,這讓我百思不得其解。
我查閱資料,js高級編程里是這樣總結的:
如果兩個操作符都是數字,執行常規的加法計算;(試驗這句沒毛病)
如果有一個操作數是字符串,那么就要應用如下規則:
如果兩個操作數都是字符串,則將第二個操作數與第一個操作數拼接起來;(試驗這句沒毛病)
如果只有一個操作數是字符串,則將另一個操作數轉換為字符串,然后再將兩個字符串拼接起來。
如果有一個操作數是對象、數值或布爾值,則調用他們的toString()方法取得相應的字符串值,然后再應用前面關於字符串的規則。對於undefined和null,則分別調用String()函數並取得字符串"undefined"和"null"。
正如我前面的試驗,有一個操作數是字符串,一個操作數是對象,按照這一規律理解,計算步驟:空對象{}.toString(),得到字符串"[object Object]",然后再與字符串"str"進行拼接,最后結果是字符串"[object Object]str",試驗所得為NaN,顯然摘抄自高級編程里的結論不適用。
console.log({}+1);//1
console.log({};+"str");//NaN
對象與數字,如果按照結論來,應該是字符串"[object Object]1",而試驗結果是數字1;有沒有覺得奇怪。這該如何理解。
當然我想到的這些都是比較特殊的,對於一般的字符串與數字相加,不需要特殊處理。
看一個比較正常的對象分別字符串和數字相加。
console.log(({})+"str");
console.log(({})+2);
這兩個用上面的規律,沒毛病,結果如你所想。
總結出的規律,可以任意做實驗:
+ 遇到字符串是字符串拼接(由於加引用類型值,首先會轉換為字符串,所以也是字符串拼接),如果遇不到字符串就是數學運算
{}+"str" 不是按照加法運算的,它是先把{}當做一個塊級作用域(ES6中的語法),也就是瀏覽器是執行兩個操作,一個操作是{這里可以寫任何代碼}的塊級作用域,一個是+"str"的操作,注意這里的 + 並不是數學加,也不是字符串連接,而是正號,"str"轉換為Number,為NaN