這些關於 parseInt 的題你都會嗎？

下面的結果你都知道是多少嗎？歡迎在評論區給出推算過程~

parseInt(6.1e23, 10)
parseInt(' 10 ', 10)
parseInt(' 2 10 ', 10)
parseInt(NaN)
parseInt(NaN, 36)
['1', '7', '11'].map(parseInt)
['1', '2', '3'].map(parseInt)
parseInt('0x1')
parseInt('0x11')
複製代碼

parseInt

parseInt(str[, radix: ]) // 返回一個整數或者 NaN
複製代碼

parseInt 表示把一個參數 str 按 radix 進制轉換成 10 進制數。

明確指定 radix 將會給你省不少麻煩，同時你最好能明確知道str是什麼樣的字符串。

• str 要被解析的值，應該是字符串類型，若是不是字符串，則按照 ToString 規則轉換，str 開頭和尾部的空格會被省略；
• radix 表示的是 str 的基數，介於 2 到 36 之間的整數（包括二、36），這個基數要特別注意
  • radix 不填 或者爲 0 或者爲 undefined 時， str 以 0x 或者 0X 開頭則默認 radix 爲 16，str 以 0 開頭，radix 多是 8 或 10 （這個不肯定，依據環境而定），若是以其餘任何值開頭則 radix 爲 10；
  • 基數爲 [2, 36] 之間的值時，以 radix 爲基數進行轉換；
• 返回值： 首尾空格自動省略，首個不爲空格的字符不可表示則返回 NaN
  • 省略首尾空格，例如 parseInt(' 3 10 ', 10) str 有多個空格，這時候會省略首尾空格，從 3 開始，若是再遇到空格，則沒法解析，直接返回 3；
  • 若是 str 的第一個非空格字符沒法被轉化爲數值類型，則返回 NaN，好比 parseInt('2', 2) parseInt('a', 10) 等第一位超過了 radix 能表示的數，因此返回 NaN；
  • 中途碰到不可轉換的值則中止轉換，如 parseInt('10a11', 10) str 前兩位爲 1 和 0，在十進制能夠表示，a 不能，就會直接中止轉換，返回 10；

總結：

• str 首尾空格會被省略
• 若是 parseInt 遇到了不屬於 radix 參數所指定的基數中的字符（首尾空格除外）那麼該字符和其後的字符都將被忽略；
• 在被 parseInt 轉換前，最好已經明確知道 str 是字符串，radix 也不要省略，避免出現推斷從而致使脫離本意；
• radix 明確指定屬於 [2, 36]（包括邊界）

上面的規則可能比較晦澀，下面來幾組 demo。

// [parseInt('1', 0), parseInt('2', 1), parseInt('3', 2)]
// radix 爲 0， str 爲 1，則轉換爲 parseInt(1, 10) => 1
// [1, NaN, NaN]
['1', '2', '3'].map(parseInt) => [1, NaN, NaN]

// 去除首尾空格
parseInt(' 10 ', 10) // 10
// 去收首尾空格以後，中途有空格則返回前面的數字
parseInt(' 3 10 ', 10) // 3
// 10 進制沒法表示 a
parseInt(' a 10 ', 10) // NaN

parseInt('0x1') // 1 正常，radix 16
+'0x1' // 1
Number('0x1') // 1

// 帶 e 的字符串對 parseInt 可能觸發錯誤的結果
parseInt('6.1e23', 10) // 6 異常
+'6.1e23' // 6.1e+23
Number('6.1e23') // 6.1e+23

parseInt(6.1e23, 10) // 6 異常
+6.1e23 // 6.1e+23
Number(6.1e23) // 6.1e+23
複製代碼

parseInt 涉及到的類型轉換

str 最好是你已經知道的字符串，若是傳入了數字和其餘類型，那會怎麼處理？來看看 ToString 內部轉換的規則。

能夠看到 undefined 、null 被轉換成了對應的字符串。

轉換數字

對數字類型，第 5 條以後的很是難懂，其中包括如下數字的轉換，一個數能夠用科學計數法來表示，相似 s*10ew(s在 [1, 10] 閉區間上)，而後呢 w 小於等於 20 則用常規表示，若是大於 20 則用指數形式表示，以下圖。

簡單來講，數字的轉換規則就是應用 Number.prototype.toString ( [ radix ] )

radix 爲 [2, 36] 閉區間的值，不填則默認爲 10，不能填 0，在 parseInt 這裏是 10。

轉換對象

對象轉換爲字符串涉及到 ToPrimitive 內部處理機制，下一篇文章將會詳細介紹。這裏給出大概轉換流程。

parseInt(obj, radix) 會把 obj 對象先轉換成字符串，而後按照 radix 轉換爲對應的結果。obj 對 obj 結果有影響的三個是 valueOf、toString、Symbol.toPrimitive。

var obj = {
  value: 1,
  valueOf() {
    console.log('valueOf')
    return 2
  },
  toString() {
    console.log('toString')
  	return '3'
  },
  [Symbol.toPrimitive](hint){
  	console.log(hint)
    if(hint === 'string') {
    	return '4'
    }
    return 5
  }
}

parseInt(obj, 10)
// string
// 4

// 去掉 Symbol.toPrimitive 屬性，再執行
// toString
// 3
複製代碼

因爲是轉換爲字符串，而 toString 返回的是原始值，因此不會執行 valueOf。

---

今天的文章就到這裏，感謝閱讀~

歡迎在本文下面評論發表您的看法。

歡迎你們關注個人掘金和公衆號，專一於提高前端程序員的核心競爭力，不斷探索 【前端規範】、【框架原理】，經過分析源碼告訴你們如何【參與開源項目】、提高知名度，創建我的品牌。