摘要：如果我們把非布爾值作為條件呢打開控制臺并運行上述代碼，會打印說明條件為真值。在中，真值指的是在布爾值上下文中轉(zhuǎn)換后的值為真的值。兩個能夠建立元素間一一對應的集合稱為互相對等集合。

為了保證可讀性，本文采用音譯而非直譯。

Javascript 一直是神奇的語言。 不相信我？ 嘗試使用map和parseInt將字符串數(shù)組轉(zhuǎn)換為整數(shù)。打開 Chrome 的控制臺(F12)，粘貼以下內(nèi)容，然后按回車，查看輸出結(jié)果：

["1", "7", "11"].map(parseInt);

我們得到的不是一個整數(shù)數(shù)組[1,7,11]，而是[1,NAN, 3]，要了解究竟發(fā)生了什么，我們首先要討論一些Javascript概念。

想閱讀更多優(yōu)質(zhì)文章請猛戳GitHub博客,一年百來篇優(yōu)質(zhì)文章等著你！

以下是 JS 中一個簡單的if-else語句：

if (true) {
    // this always runs
} else {
    // this never runs
}

在上例中，if 條件為 true，因此總是執(zhí)行if塊，忽略else塊。這是一個簡單的例子，因為true是一個布爾值。如果我們把非布爾值作為條件呢 ？

if ("hello world") {
    console.log("Condition is truthy");
} else {
    console.log("Condition is falsy");
}  

打開控制臺并運行上述代碼，會打印 Condition is truthy,說明條件 "hello world" 為真(true)值。

在 JavaScript 中，Truthy (真值)指的是在 布爾值 上下文中轉(zhuǎn)換后的值為真的值。所有值都是真值，除非它們被定義為 falsy (即除了 false，0，""，null，undefined 和 NaN 外)。

falsy(虛值)是在 Boolean 上下文中已認定可轉(zhuǎn)換為‘假‘的值。

JS中的對象不是真值就是虛值。

令人困惑的是，這意味著字符串“false”，字符串“0”，空對象{}和空數(shù)組[]都是真的。 使用使用 Boolean 方法來驗證，如 Boolean("0")。

出于我們的目的，接下來只要記住0是假的就行了。

在數(shù)學上，基數(shù)（cardinal number）是集合論中刻畫任意集合大小的一個概念。兩個能夠建立元素間一一對應的集合稱為互相對等集合。例如3個人的集合和3匹馬的集合可以建立一一對應，是兩個對等的集合。

0 1 2 3 4 5 6 7 8 9 10

當我們從0數(shù)到9時，每個數(shù)字(0-9)都有不同的符號，但是當我們數(shù)到10時，我們需要兩個不同的符號(1和0)來表示這個數(shù)字。這是因為我們的十進制計數(shù)系統(tǒng)的基數(shù)是10。

基數(shù)是最小的數(shù)字，只能由多個符號表示。 不同的計數(shù)系統(tǒng)具有不同的基數(shù)，因此，相同的數(shù)字在不同的計數(shù)系統(tǒng)中可以表示不同的數(shù)字。

十進制   二進制    十六進制
RADIX=10  RADIX=2   RADIX=16
0         0         0
1         1         1
2         10        2
3         11        3
4         100       4
5         101       5
6         110       6
7         111       7
8         1000      8
9         1001      9
10        1010      A
11        1011      B
12        1100      C
13        1101      D
14        1110      E
15        1111      F
16        10000     10
17        10001     11

看上表，可以看到相同的數(shù)字11在不同的計數(shù)系統(tǒng)中可以表示不同的數(shù)字。如果基數(shù)是2，那么它表示數(shù)字為 3。如果基數(shù)是16，那么它指的是數(shù)字17。

你可能已經(jīng)注意到，在我們的示例中，當輸入為11時，parseInt返回3，這對應于上表中的二進制列。

JS 中函數(shù)調(diào)用，我們可以傳入任意的參數(shù)，即使它們不等于聲明時的函數(shù)參數(shù)的數(shù)量。缺少的參數(shù)被視為undefined 的，并且會忽略額外的參數(shù)，但會保存在類似數(shù)組的arguments對象中。

function foo(x, y) {
    console.log(x);
    console.log(y);
}
foo(1, 2);      // 打印 1, 2
foo(1);         // 打印 1, undefined
foo(1, 2, 3);   // 打印 1, 2    

map是 Es6 中新出的一個數(shù)組方法，它是一個高階函數(shù)，通過傳入一個函數(shù)進行邏輯操作，并返回一個數(shù)組， 例如，以下代碼將數(shù)組中的每個元素乘以3：

function multiplyBy3(x) {
    return x * 3;
}
const result = [1, 2, 3, 4, 5].map(multiplyBy3);
console.log(result);   // logs [3, 6, 9, 12, 15];

現(xiàn)在，將console.log作為參數(shù)傳給 map，來打印數(shù)組的元素：

[1, 2, 3, 4, 5].map(console.log);

等價于
 
 [1, 2, 3, 4, 5].map((val, index, array) => 
     console.log(val, index, array));

所以 map 回調(diào)方法中會傳入三個參數(shù)，分別是 當前遍歷的項，當前索引，及遍歷的整個數(shù)組。

ParseInt有兩個參數(shù)：string和radix。 如果提供的基數(shù)是虛值，則默認情況下，基數(shù)設置為10。

parseInt("11");                => 11
parseInt("11", 2);             => 3
parseInt("11", 16);            => 17
parseInt("11", undefined);     => 11 (radix is falsy)
parseInt("11", 0);             => 11 (radix is falsy)

現(xiàn)在一步一步解析開頭的事例。

["1", "7", "11"].map(parseInt);       => [1, NaN, 3]

// 第一次迭代: val = "1", index = 0, array = ["1", "7", "11"]
parseInt("1", 0, ["1", "7", "11"]);   => 1

因為0是虛值，基數(shù)設置為默認值10。parseInt()只接受兩個參數(shù)，因此忽略了第三個參數(shù)["1"、"7"、"11"]。以10為基數(shù)的字符串“1”表示數(shù)字1。

 // 第二次迭代: val = "7", index = 1, array = ["1", "7", "11"]
parseInt("7", 1, ["1", "7", "11"]);   => NaN

在基數(shù)1系統(tǒng)中，符號“7”不存在。與第一次迭代一樣，忽略最后一個參數(shù)。因此，parseInt()返回NaN。

 // Third iteration: val = "11", index = 2, array = ["1", "7", "11"]
parseInt("11", 2, ["1", "7", "11"]);   => 3

在基數(shù)2(二進制)系統(tǒng)中，符號“11”表示數(shù)字3。

至此原因已經(jīng)明了了。 有興趣可以試著寫下下列的打印結(jié)果：

["1", "7", "11"].map(numStr => parseInt(numStr));

代碼部署后可能存在的BUG沒法實時知道，事后為了解決這些BUG，花了大量的時間進行l(wèi)og 調(diào)試，這邊順便給大家推薦一個好用的BUG監(jiān)控工具 Fundebug。

## 交流

干貨系列文章匯總?cè)缦拢X得不錯點個Star，歡迎 加群 互相學習。

https://github.com/qq44924588...

我是小智，公眾號「大遷世界」作者，對前端技術保持學習愛好者。我會經(jīng)常分享自己所學所看的干貨，在進階的路上，共勉！

關注公眾號，后臺回復福利，即可看到福利，你懂的。