【面試題】439- 這是一道網紅面試題
- 2019 年 12 月 24 日
- 筆記
在騰訊和百度的面試中，出現了這樣一道面試題，，被大家親切的稱呼為網紅面試題，這道面試題就是。['1', '2', '3'].map(parseInt)的輸出結果是什麼？['1', '2', '3'].fliter(parseInt)的輸出結果是什麼？這個面試題，面試官可能不僅僅需要你說出他的結果，還需要你知道為什麼會出現這樣的結果。
一、關鍵語法
1、parseInt
2、parseFloat
先看看parseInt和parseFloat的語法和使用，以便後續在實際例子中解釋。
二、Map
1、['1', '2', '3'].map(parseInt)
['1', '2', '3'].map(parseInt) // [1, NaN, NaN]
其實在使用map時，map的callback的第二個參數index引索值就成為parseeInt的radix值。['1', '2', '3'].map(parseInt)在遍歷的過程。其實是經歷了下面的過程。
parseInt('1', 0); parseInt('2', 1); parseInt('3', 2);
- parseInt('1', 0)：radix的值為0，判斷字符串發現介於1~9，用10進制轉換，結果為1.
- parseInt('2', 1)：radix的值為1，如果該參數小於 2 或者大於 36，則 parseInt() 將返回 NaN。
- parseInt('3', 2): radix的值為2，這就意味着字符串將被解析成位元組數，也就是僅僅包含數值0和1。parseInt的規範指出，它僅嘗試分析第一個字符的左側。這個字符串的第一個字符是「3」，它並不是基礎基數2的一個有效數字。所以這個子字符串將被解析為空。如果子字符串被解析成空了，函數將返回為NaN。
2、['1', '2', '3'].map(parseFloat)
['1', '2', '3'].map(parseFloat) // [1, 2, 3]
parseFloat相對於parseInt比較簡單，不用考慮第二個參數，只需要看第一個參數是否能正常轉換為數字就行。
parseFloat('1'); // 1 parseFloat('2'); // 2 parseFloat('3'); // 3
一個小的知識點：如何快速將一個字符串數組轉化為數字類型的數組
['1', '2', '3'].map(parseFloat) ['1', '2', '3'].map(Number)
三、filter
1、['1', '2', '3'].filter(parseInt)
['1', '2', '3'].filter(parseInt) // ["1"]
filter 為數組中的每個元素調用一次 callback 函數，並利用所有使得 callback 返回 true 或等價於 true 的值的元素創建一個新數組。
parseInt('1', 0); parseInt('2', 1); parseInt('3', 2);
- parseInt('1', 0)：radix的值為0，判斷字符串發現介於1~9，用10進制轉換，結果為1，所以callback的結果等價於true，返回元素'1'。
- parseInt('2', 1)：radix的值為1，如果該參數小於 2 或者大於 36，則 parseInt() 將返回 NaN，結果不等價於true，不返回。
- parseInt('3', 2): radix的值為2，這就意味着字符串將被解析成位元組數，也就是僅僅包含數值0和1。parseInt的規範指出，它僅嘗試分析第一個字符的左側。這個字符串的第一個字符是「3」，它並不是基礎基數2的一個有效數字。所以這個子字符串將被解析為空。如果子字符串被解析成空了，函數將返回為NaN。
2、['1', '2', '3'].filter(parseFloat)
['1', '2', '3'].filter(parseFloat) // ["1", "2", "3"]
使用parseFloat時，遍歷之後結果的每一項都是結果等價於true，所以全部返回。
四、反思
通過上述的map、filter，我們聯想到數組其他方法，當使用parseInt或者是parseFloat來替代callback使用，你只需要理解到parseInt和parseFloat工作原理，那麼針對這類問題，其實結果都是能很快輸出的，也能套用上面的解析過來，來回答面試官。這類面試題也不是什麼難題了。
源自：https://juejin.im/post/5dbff8735188252ddb2fd25e
聲明：文章著作權歸作者所有，如有侵權，請聯繫小編刪除。
