關(guān)于JavaScript中parseInt()的一個怪異行為解決
parseInt()
是一個內(nèi)置的 JavaScript
函數(shù),它可以將數(shù)字字符串解析為整數(shù)。比如,我們將數(shù)字字符串 '100'
解析為整數(shù):
const number = parseInt('100'); number; // 100
如預(yù)期那樣,'100'
被解析為整數(shù) 100
。
parseInt(numericalString, radix)
也接受第二個參數(shù):radix
(基數(shù)),另一個參數(shù)是數(shù)字字符串 numericalString
。radix
參數(shù)允許你解析來自不同數(shù)字基數(shù)的字符串為整數(shù),基數(shù)通常有 2,8, 10 和 16
。
我們使用基數(shù)為 2
的 parseInt()
來解析一個數(shù)字字符串:
const number = parseInt('100', 2); number; // 4
parseInt('100', 2)
以基數(shù) 2
解析 '100'
為一個整數(shù):所以它返回十進制數(shù)值 4
。
上面就是對 parseInt()
方法的簡單介紹。
1. parseInt() 中的一個怪異行為
parseInt(numericalString)
總是將其第一個參數(shù)轉(zhuǎn)換成字符串(如果它不是字符串的話),然后將這個字符串?dāng)?shù)字解析成整數(shù)。
這就是為什么你可以(但是不應(yīng)這么做! )使用 parseInt()
來提取浮點數(shù)的整數(shù)部分:
parseInt(0.5); // => 0 parseInt(0.05); // => 0 parseInt(0.005); // => 0 parseInt(0.0005); // => 0 parseInt(0.00005); // => 0 parseInt(0.000005); // => 0
取出浮點數(shù),比如 0.5
,0.05
等等整數(shù)的部分。結(jié)果就是 0
。這跟我們的預(yù)期結(jié)果一樣。
那么提取 0.0000005
整數(shù)的部分會怎樣呢?
parseInt(0.0000005); // => 5
parseInt()
將浮點數(shù) 0.0000005
解析為 5
。這就很有趣且不符合預(yù)期...
為什么 parseInt(0.0000005)
會有如此怪異的行為呢?
2.解決 parseInt() 該怪異行為
我們回顧下,parseInt(numericalString)
對它的第一個參數(shù)做了什么:如果不是字符串,就將其轉(zhuǎn)換為一個字符串,然后解析,之后返回解析的整數(shù)。
這可能是第一個線索。
我們手動將浮點數(shù)轉(zhuǎn)換為字符串表現(xiàn)形式:
String(0.5); // => '0.5' String(0.05); // => '0.05' String(0.005); // => '0.005' String(0.0005); // => '0.0005' String(0.00005); // => '0.00005' String(0.000005); // => '0.000005' String(0.0000005); // => '5e-7'
String(0.0000005)
數(shù)值的顯式轉(zhuǎn)換和其它浮點數(shù)不同:它是指數(shù)符號exponential notation 字符串表現(xiàn)形式。
這是第二個線索 -- 很重要!
然后當(dāng)指數(shù)符號字符串解析為整數(shù),你就會得到整數(shù) 5
:
parseInt(0.0000005); // => 5 // same as parseInt(5e-7); // => 5 // same as parseInt('5e-7'); // => 5
parseInt('5e-7')
考慮第一個數(shù)字 '5'
,跳過了 'e-7'
。
解密了!因為 parseInt()
總是將它第一個參數(shù)轉(zhuǎn)換為字符串,浮點數(shù)字小于 10−610^{-6}10−6 就會被寫成指數(shù)符號的形式。parseInt()
從浮點數(shù)的指數(shù)符號中取出整數(shù)。
譯者加 -- 注意,
parseInt()
取字符串前面整數(shù)的部分,比如:parseInt('12Jimmy34')
則有返回結(jié)果12
備注,安全地取出浮點數(shù)整數(shù)的部分,我推薦使用 Math.floor()
函數(shù):
Math.floor(0.5); // => 0 Math.floor(0.05); // => 0 Math.floor(0.005); // => 0 Math.floor(0.0005); // => 0 Math.floor(0.00005); // => 0 Math.floor(0.000005); // => 0 Math.floor(0.0000005); // => 0
3. 總結(jié)
parseInt()
是個將數(shù)字字符串轉(zhuǎn)換為整數(shù)的函數(shù)。
當(dāng)你使用 parseInt()
獲取浮點數(shù)的整數(shù)部分的時候,要小心。
小于 10−610^{-6}10−6 的浮點數(shù)(比如 0.0000005
等同于 5∗10−75 * 10^{-7}5∗10−7)被轉(zhuǎn)換為以指數(shù)符號表示形式(比如 5e-7
是 0.0000005
指數(shù)符號形式)。這就是為什么使用 parseInt()
作用于如此小的浮點數(shù)會出現(xiàn)非預(yù)期效果:僅解析指數(shù)表示形式的重要部分(比如 5e-7
中的 5
)。
挑戰(zhàn):你可以解釋為什么 parseInt(999999999999999999999)
會等于 1
?
到此這篇關(guān)于JavaScript中parseInt()的一個怪異行為解決的文章就介紹到這了,更多相關(guān)js中parseInt()怪異行為內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
原文鏈接 Solving a Mystery Behavior of parseInt() in JavaScript -- 作者 Dmitri Pavlutin
相關(guān)文章
viewer.js一個強大的基于jQuery的圖像查看插件(支持旋轉(zhuǎn)、縮放)
這篇文章主要介紹了Viewer這一款強大的 jQuery 圖像瀏覽插件,在信息詳情頁面實現(xiàn)點擊圖片可以預(yù)覽,腳本之家也是用的這個js,這里為分享一下使用方法,需要的朋友可以參考下2020-04-04詳談構(gòu)造函數(shù)加括號與不加括號的區(qū)別
下面小編就為大家?guī)硪黄斦剺?gòu)造函數(shù)加括號與不加括號的區(qū)別。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-10-10uni-app小程序中父組件和子組件傳值的實現(xiàn)實例
uniapp父子組件引用傳值,和vue的一樣,沒有小程序那樣的麻煩,下面這篇文章主要給大家介紹了關(guān)于uni-app小程序中父組件和子組件傳值的相關(guān)資料,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-08-08JavaScript canvas實現(xiàn)七彩時鐘效果
這篇文章主要為大家詳細(xì)介紹了JavaScript canvas實現(xiàn)七彩時鐘效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-05-05js監(jiān)聽鼠標(biāo)事件控制textarea輸入字符串的個數(shù)
一個js控制textarea輸入字符串的個數(shù)的腳本,當(dāng)鼠標(biāo)按下抬起時判斷輸入字符數(shù),很簡單,但很實用2014-09-09es7學(xué)習(xí)教程之Decorators(修飾器)詳解
這篇文章主要給大家介紹了關(guān)于es7中Decorators(修飾器)的相關(guān)資料,文中通過示例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面跟著小編一起來學(xué)習(xí)學(xué)習(xí)吧。2017-07-07JavaScript Math對象和調(diào)試程序的方法分析
這篇文章主要介紹了JavaScript Math對象和調(diào)試程序的方法,結(jié)合實例形式分析了javascript中Math對象生成隨機數(shù)以及使用alert()、console.log()函數(shù)進行錯誤調(diào)試相關(guān)操作技巧,需要的朋友可以參考下2019-05-05