通常情況下,map 方法中的 callback 函數(shù)只需要接受一個(gè)參數(shù)拢切,就是正在被遍歷的數(shù)組元素本身秆吵。但這并不意味著 map 只給 callback 傳了一個(gè)參數(shù)。這個(gè)思維慣性可能會(huì)讓我們犯一個(gè)很容易犯的錯(cuò)誤主穗。
// 下面的語(yǔ)句返回什么呢:
["1", "2", "3"].map(parseInt);
// 你可能覺(jué)的會(huì)是[1, 2, 3]
// 但實(shí)際的結(jié)果是 [1, NaN, NaN]
// 通常使用parseInt時(shí),只需要傳遞一個(gè)參數(shù).
// 但實(shí)際上,parseInt可以有兩個(gè)參數(shù).第二個(gè)參數(shù)是進(jìn)制數(shù).
// 可以通過(guò)語(yǔ)句"alert(parseInt.length)===2"來(lái)驗(yàn)證.
// map方法在調(diào)用callback函數(shù)時(shí),會(huì)給它傳遞三個(gè)參數(shù):當(dāng)前正在遍歷的元素,
// 元素索引, 原數(shù)組本身.
// 第三個(gè)參數(shù)parseInt會(huì)忽視, 但第二個(gè)參數(shù)不會(huì),也就是說(shuō),
// parseInt把傳過(guò)來(lái)的索引值當(dāng)成進(jìn)制數(shù)來(lái)使用.從而返回了NaN.
function returnInt(element) {
return parseInt(element, 10);
}
['1', '2', '3'].map(returnInt); // [1, 2, 3]
// 意料之中的結(jié)果
// 也可以使用簡(jiǎn)單的箭頭函數(shù)忽媒,結(jié)果同上
['1', '2', '3'].map( str => parseInt(str) );
// 一個(gè)更簡(jiǎn)單的方式:
['1', '2', '3'].map(Number); // [1, 2, 3]
// 與`parseInt` 不同腋粥,下面的結(jié)果會(huì)返回浮點(diǎn)數(shù)或指數(shù):
['1.1', '2.2e2', '3e300'].map(Number); // [1.1, 220, 3e+300]
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/map