js字串轉換數字方方式主要有三類：轉換函式、強制型別轉換、弱型別隱式型別轉換，利用這三類轉換的方式可以有5種轉換的方法。

parseInt()

parseInt()和Number.parseInt()是最常用的轉換字串為整數數值的方法，其中Number.parseInt()是ES6之後為了減少全域性方法的定義才增加的靜態方法，實質與全域性方法parseInt()相同，他們的規則如下：

• 忽略字串前面的空格，直至找到第一個非空字元。
• 如果第一個非空字元不是數字或者是正負號則返回NaN。
• 如果第一個是數字字元一直解析到一個非數字字元。
• 如果第一個是數字字元，能識別出各種整數格式。
• 接受第二個引數，即轉換時使用的基數。
• 小數向下取整。

console.log(Number.parseInt(true));        // NaN
console.log(Number.parseInt(false));       // NaN
console.log(Number.parseInt(null));        // NaN
console.log(Number.parseInt(undefined));   // NaN
console.log(Number.parseInt(NaN));         // NaN
console.log(Number.parseInt("   123"));    // 123
console.log(Number.parseInt(" ab123"));    // NaN
console.log(Number.parseInt(""));          // NaN
console.log(Number.parseInt(" 31avs"));    // 31
console.log(Number.parseInt("0xF"));       // 15
console.log(Number.parseInt("070"));       // es3->56 es5->70
console.log(Number.parseInt("A", 16));     // 10
console.log(Number.parseInt("A"));         // NaN
console.log(Number.parseInt("51.2"));      // 51
console.log(Number.parseInt("-51.2"));     // -51
 

parseFloat()

parseFloat()和Number.parseFloat()是最常用的轉換字串為浮點數數值的方法，其中Number.parseFloat()是ES6之後為了減少全域性方法的定義才增加的靜態方法，實質與全域性方法parseFloat()相同，他們的轉換規則如下：

• 忽略字串前面的空格，直至找到第一個非空字元。
• 如果第一個非空字元不是數字或者是正負號則返回NaN。
• 如果第一個是數字字元一直解析到一個非數字字元。
• 字串中第一個小數點是有效的第二個小數點是無效的。
• 只解析10進位制，不接受第二個引數。

console.log(Number.parseFloat(true));            // NaN
console.log(Number.parseFloat(false));           // NaN
console.log(Number.parseFloat(null));            // NaN
console.log(Number.parseFloat(undefined));       // NaN
console.log(Number.parseFloat(NaN));             // NaN
console.log(Number.parseFloat("123"));           // 123
console.log(Number.parseFloat("  123.1"));       // 123.1
console.log(Number.parseFloat("  ab123.1"));     // NaN
console.log(Number.parseFloat(""));              // NaN
console.log(Number.parseFloat("  123.3.4eqw"));  // 123.3
console.log(Number.parseFloat("0xF"));           // 0
 

Number()

Number()建構函式會返回一個字面量值，而使用new Number()則會返回一個數字物件，他們的轉換規則如下：

• 如果是Boolean值，true和false分別返回1或0。
• 如果是數字，只是單純的傳入和返回。
• 如果是null，則返回0。
• 如果是undefined返回NaN。
• 如果是字串且字串為空則返回零，忽略前導零。
• 如果是字串且字串為整數則返回整數，忽略前導零。
• 如果是字串且字串為浮點數則返回浮點數。
• 如果是字串且字串為16進位制，轉為10進位制返回。
• 除以上格式返回NaN。
• 如果是物件，則呼叫物件的valueOf，按照前面的規則返回值，如果返回NaN，再呼叫toString()，按照前面的規則返回值。

console.log(Number(true));        // 1
console.log(Number(false));       // 0
console.log(Number(null));        // 0
console.log(Number(undefined));   // NaN
console.log(Number(NaN));         // NaN
console.log(Number(""));          // 0
console.log(Number("123"));       // 123
console.log(Number("  123"));     // 123
console.log(Number("123.12"));    // 123.12
console.log(Number("0xF"));       // 15

位運算

位運算是直接對二進位制位進行計算，它直接處理每一個位元位，是非常底層的運算，好處是速度極快，缺點是很不直觀。位運算只對整數起作用，如果一個運算數不是整數，會自動轉為整數後再執行。在JavaScript內部，很多時候數值都是以64位浮點數的形式儲存，但是做位運算的時候，是以32位帶符號的整數進行運算的，並且返回值也是一個32位帶符號的整數。

console.log(~~(true));        // 1
console.log(~~(false));       // 0
console.log(~~(null));        // 0
console.log(~~(undefined));   // 0
console.log(~~(NaN));         // 0
console.log(~~(""));          // 0
console.log(~~("123"));       // 123
console.log(~~("  123"));     // 123
console.log(~~("123.12"));    // 123
console.log(~~("0xF"));       // 15

https://www.51220.cn 51220網站目錄

一元運算子

一元運算子可以將字串進行隱式的型別轉換，與其它的解析方式不同，如果是一個NaN值，那麼返回的也是NaN，通常使用+操作符，因為這個方式不容易混淆。

console.log(+(true));        // 1
console.log(+(false));       // 0
console.log(+(null));        // 0
console.log(+(undefined));   // NaN
console.log(+(NaN));         // NaN
console.log(+(""));          // 0
console.log(+("123"));       // 123
console.log(+("  123"));     // 123
console.log(+("123.12"));    // 123
console.log(+("0xF"));       // 15