大廠就是吊，這面試題把我整懵了
大廠就是吊，這面試題把我整懵了
題目如下：
['1', '2', '3'].map(parseInt)
然后讓你說出返回值，以及為什么？
不得不說，大廠就是吊啊，是大廠真會造火箭，還是我們的基礎(chǔ)不太好，明顯是第二種嘛？一般人都會回答 ['1', '2', '3']。
大佬們是不會回答 ['1', '2', '3']，而是回答 [1, NaN, NaN]。
這就把我給整懵逼了，就這還能難得到我，誒，還真把我難倒了。
接下來我們就來好好解析一下為什么？
解析之前，我們得想想面試官到底想問什么？
我猜想有以下幾個可能
map 方法 parseInt 方法
map 方法解析
['1', '2', '3'].map(function(item){
console.log(item)
})
你以為他會只打印 1,2,3。其實(shí)不是，來看看瀏覽器控制臺是怎么打印的：
1
2
3
(3)[undefined, undefined, undefined]
神了，還打印出四個值來，其實(shí)最后一個是返回值，就是因?yàn)?code style="font-size: 14px;overflow-wrap: break-word;padding: 2px 4px;border-radius: 4px;margin-right: 2px;margin-left: 2px;background-color: rgba(27, 31, 35, 0.05);font-family: "Operator Mono", Consolas, Monaco, Menlo, monospace;word-break: break-all;color: rgb(255, 93, 108);">function(item){} 沒有真正的返回值，默認(rèn)返回undefined
所以 map 之后返回一個三個 undefined 元素的數(shù)組
[undefined, undefined, undefined]
其實(shí)上面我們可以這樣寫，就更加清楚了
var a = ['1', '2', '3'].map((item) => console.log(item))
console.log(a)
其實(shí)打印出來就是：
[undefined, undefined, undefined]
繼續(xù)深入研究：
['1', '2', '3'].map(function(item, index){
// item: 數(shù)組元素
// index: 數(shù)組元素的下標(biāo)
console.log(item, index)
})
會打印出：
item, index
1 0
2 1
3 2
繼續(xù)深入研究：
['1', '2', '3'].map(function(item, index, array){
console.log("item", item)
console.log("index", index)
console.log("array", array)
})
會打印出：
item 1
index 0
array (3) ["1", "2", "3"]
item 2
index 1
array (3) ["1", "2", "3"]
item 3
index 2
array (3) ["1", "2", "3"]
這里有個經(jīng)常面試的考點(diǎn)就是考 map 與 forEach 的核心區(qū)別：
1. map 會重新返回?cái)?shù)組
2. forEach 不會重新返回?cái)?shù)組
ok
parseInt
記住核心的一點(diǎn)就是其實(shí) parseInt(string, radix) 解析一個字符串并返回指定基數(shù)的十進(jìn)制整數(shù)， radix 是2-36之間的整數(shù)，表示被解析字符串的基數(shù)。
parseInt 其實(shí)是有兩個參數(shù)的，只是如果我們平時不注意的話，會以為只有一個參數(shù)，所以回答 ['1', '2', '3'] 可能就以為只有一個參數(shù)，而且會認(rèn)為默認(rèn)就是 10 進(jìn)制的。
實(shí)際上面那道題目可以轉(zhuǎn)化為：
['1', '2', '3'].map(parseInt(item, index))
是不是這樣的呢？是的，就是這樣的，他會把數(shù)組元素當(dāng)做 parseInt 第一個參數(shù)，將數(shù)組元素的下標(biāo)當(dāng)做 parseInt 第二個參數(shù)
那么為什么是 [1, NaNa, NaN] 呢？
其實(shí)就是執(zhí)行了三遍：
parseInt("1", 0) // 0
parseInt('2', 1) // NaN
parseInt('3', 2) // NaN
第一個元素是 1，是問啥。
如果 radix 是 undefined、0或未指定的，JavaScript會假定以下情況：
如果輸入的 string以 "0x"或 "0x"（一個0，后面是小寫或大寫的X）開頭，那么radix被假定為16，字符串的其余部分被當(dāng)做十六進(jìn)制數(shù)去解析。
如果輸入的 string以 "0"（0）開頭， radix被假定為8（八進(jìn)制）或10（十進(jìn)制）。具體選擇哪一個radix取決于實(shí)現(xiàn)。ECMAScript 5 澄清了應(yīng)該使用 10 (十進(jìn)制)，但不是所有的瀏覽器都支持。因此，在使用 parseInt 時，一定要指定一個 radix。
如果輸入的 string 以任何其他值開頭， radix 是 10 (十進(jìn)制)。
如果第一個字符不能轉(zhuǎn)換為數(shù)字，parseInt會返回 NaN。
那么第二個元素是 NaN，很納悶。
你想想看：
radix 可選
從 2 到 36，表示字符串的基數(shù)。例如指定 16 表示被解析值是十六進(jìn)制數(shù)。請注意，10不是默認(rèn)值！
沒有 1進(jìn)制轉(zhuǎn)換，所以是 NaN。
第三個元素是 NaN 又是為啥呢？
parseInt('3', 2) // NaN
因?yàn)?2 進(jìn)制轉(zhuǎn)換，只有 0 和 1，2進(jìn)制沒法表示 3
所以打印出來就是 NaN