JS高級測試: ['1', '2', '3'].map(parseInt) 的運算結果是多少?
- 2019 年 10 月 4 日
- 筆記
考核內容: es6 數組map() 方法
題發散度: ★★★
試題難度: ★★★
解題思路:
1. map方法概述
map() 方法返回一個由原數組中的每個元素調用一個指定方法後的返回值組成的新數組。
2. 例子
在字元串中使用map
在一個 String 上使用 map 方法獲取字元串中每個字元所對應的 ASCII 碼組成的數組:
var map = Array.prototype.map var a = map.call("Hello World", function(x) { return x.charCodeAt(0); }) // a的值為[72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
易犯錯誤
通常情況下,map 方法中的 callback 函數只需要接受一個參數(很多時候,自定義的函數形參只有一個),就是正在被遍歷的數組元素本身。
但這並不意味著 map 只給 callback 傳了一個參數(會傳遞3個參數)。這個思維慣性可能會讓我們犯一個很容易犯的錯誤。
如上題所示效果為
你可能會覺得會輸出[1,2,3],實際結果卻是上圖所示。
參考解析:
- 通常使用parseInt時,只需要傳遞一個參數.
- 但實際上,parseInt可以有兩個參數.第二個參數是進位數.可以通過語句"alert(parseInt.length)===2"來驗證.
- map方法在調用callback函數時,會給它傳遞三個參數:當前正在遍歷的元素, 元素索引, 原數組本身.
- 第三個參數parseInt會忽視, 但第二個參數不會,也就是說,parseInt把傳過來的索引值當成進位數來使用.從而返回了NaN.
正常返回數據的方法
答案:
A. [1, NaN, NaN]