【JavaScript 學以至用】值的判斷以及類型轉換

引言

來到北京已經有4個年頭了，作過一些測試、打雜、前端的工做以後，最後仍是選擇了前端的工做。現階段主要仍是在寫業務代碼，代碼質量，工做效率就顯得尤其重要。【學以至用】這個系列主要記錄一些平時工做、學習遇到的一些問題，方便之後查漏補缺。

value 顯示強制類型轉換

最新的 ECMAScript 標準定義了 7 種數據類型:

• 6 種原始類型:

  • Boolean
  • Null
  • Undefined
  • Number
  • String
  • Symbol (ECMAScript 6 新定義)

和

• Object

一般咱們在工做的時候須要和後臺對接，函數在處理返回值的時候若是作了容錯判斷，把數據轉換成咱們想要的類型，在編寫後續業務代碼的時候就會更加輕鬆 :-D

下圖是 《JavaScript權威指南》中關於類型轉換的總結：

舉個栗子：後臺返回值爲一個字符串，內容是0 ~ 5的數字，如今使用的時候須要將參數轉化爲數字類型。

// wrong
return Number(value) 
// '' -> 0 
// undefined -> NaN 
// 'aaa' -> NaN

// right 前面是剔除掉 '' undefined ，後面能夠剔除掉 NaN 的類型
if (value && Number(value) >= 0) {
    return Number(value);
} else {
    return null; 
}

關於值的比較，當咱們只關心值是否正常時，還有一個比較靠譜的方法：正則表達式，上面的例子也能夠這樣來寫：

if (/[0-5]/.test(value)) {
    return Number(value);
} else {
    return null; 
}

小結：在判斷兩個值是否相等時，最好顯式的轉化，讓代碼更加清晰易讀，而後用全等運算符 === 或者 !== 來比較。

隱式強制類型轉換

隱式強制類型轉換指的是一些特殊的操做的反作用來實現類型轉換，而非 Number() 和 String() 等函數來實現值的類型轉換。隱式強制類型轉換一般會使代碼更加簡潔，但同時也增長了代碼的理解難度，咱們編寫的代碼大都是給別人看的，要考慮到你們的理解是否保持一致。

數字和字符串的轉換，我的習慣是使用顯示的轉換，這裏再也不贅述。

ToBoolean

下面幾種狀況會發生布爾值的強制類型轉換：

• if (..) 語句中的天健判斷表達式。
• for (.. ; .. ; ..) 語句中的條件判斷表達式。
• while (..) 循環中的條件判斷表達式。
• ? : 中的條件判斷表達式
• || 和 && 的作操做數

而 switch 語句使用的是全等判斷，不會發生隱式的強制轉換。

轉換的結果能夠參照上面的表格，或者下面的連接👇：

js比較表：https://dorey.github.io/JavaS...

對象轉換爲原始值

全部對象會繼承兩個方法toString()和valueOf()。

• 對象轉換爲字符串 String(Object)

  • 一、當對象具備toString()會優先調用；
  • 二、若是沒有toString()方法，或者toString()沒有返回一個原始值，則會調用valueOf()方法；
  • 三、沒法從toString()和valueOf()獲取原始值的時候，則會拋出一個類型錯誤異常。

String([1,2,3])  // "1,2,3"
String(function(x) {return x+1;})  // "function(x) {return x+1;}"
String("/\d+/g") // "/\d+/g"
String(new Date(2019,4,14)) // "Tue May 14 2019 00:00:00 GMT+0800 (中國標準時間)"

• 對象轉換爲數字 Number(Object)

  • 一、當對象具備valueOf()會優先調用；
  • 二、若是沒有valueOf()方法，或者valueOf()沒有返回一個原始值，則會調用toString()方法；
  • 三、沒法從toString()和valueOf()獲取原始值的時候，則會拋出一個類型錯誤異常。

Number([1,2,3])  // NaN 原始類型
Number(function(x) {return x+1;})  // NaN
Number("/\d+/g") // NaN
Number(new Date(2019,4,14)) // 1557763200000

當判斷兩個數組是否相等時，能夠簡單的將其轉換爲 String 類型進行比較。
當判斷兩個對象是否相等時，就須要藉助 其餘工具來完成了：https://lodash.com/docs/4.17....

參考文章

• JavaScript 權威指南 - 第3章：類型、值和變量
• 你不知道的 JavaScript 中卷，第4章：強制類型轉換
• Java​Script 數據類型和數據結構：https://developer.mozilla.org...