JavaScript Number()方法和ParseInt()/ParseFloat()方法的轉換機制

weixin_34127717發表於2017-03-23
JavaScript

在專案開發中我們經常會用到轉型方法，尤其是JS這種鬆散型的語言。其中比較常用的方法就是Number()方法和ParseInt()/ParseFloat()方法了，下面我們分別對這幾種方法的轉型機制進行詳細地說明。

Number()

  • 如果傳入的引數為字串，則遵循以下規則：

    • 如果字串中只包含數字，則返回相應的數字值（前導的0會被忽略）

    • 如果包含浮點和負號，則返回相應的小數或負數

    • 如果是16進位制數字，則返回相應的10進位制數

    • 如果包含空格，則開始和結束的空格會被忽略，如果中間包含空格則會返回NaN

    • 如果是空字串，則返回0

    • 如果包含除去以上情況的其它字元，則返回NaN

  • 如果傳入的引數為true/false，則返回1/0

  • 如果傳入的引數為null,則返回0

  • 如果傳入的引數為undefined，則返回NaN

  • 如果是數字，則簡單的返回數字值

  • 如果是物件，則呼叫物件的valueOf()方法，將所得值按照以上規則進行轉型，如果得到NaN，再呼叫物件的toString()方法，將所得的值按以上規則進行轉型

總體來說Number()方法的轉型機制比較複雜且難懂，一般我們手動呼叫轉型方法會使用parseInt()/parseFloat()方法進行轉型，下面介紹這兩個方法的轉型機制。

parseInt()/parseFloat()

  • 如果傳入的引數為字串，則則從第0個位置開始，找到第一個非空格字元，如果第一個非空格字元不是數字或-號，則返回NaN,如果是數字或-號，則繼續往下尋找，直到找到非數字字元，然後忽略後面的內容，返回前面找到的數字值(前導的空格會被忽略，中間的空格則會當成非數字字元處理)

  • 如果是boolean，null，undefined型別值，則返回NaN

  • 如果需要對8進位制或者16進位制的數進行轉型，ECMAScript 3和ECMAScript 5有所不同，所以推薦傳入第二個引數，即進位制數

  • 如果是物件，則呼叫物件的toString()方法，將所得值再按照以上方法進行轉型

  • *以上只說明瞭parseInt()方法的機制，parseFloat()方法與其只有一個區別，即parseFloat()方法遇到第一個浮點會繼續往下尋找

下面舉一些典型的例子，對以上機制進行驗證和說明

console.log(Number("12a"));      //NaN
console.log(Number(""));         //0
console.log(Number(null));       //0
console.log(Number(undefined));  //NaN
console.log(Number(true));       //1
console.log(Number(false));      //0
console.log(Number([]);          //0
console.log(parseInt("-1-2a"));  //-1
console.log(parseInt("-a2a"));   //NaN
console.log(parseInt(" 12a"));   //12
console.log(parseInt("1 2a"));   //1
console.log(parseInt(""));       //NaN
console.log(parseInt(null));     //NaN
console.log(parseInt(undefined));//NaN
console.log(parseInt(true));     //NaN
console.log(parseInt(false));    //NaN
console.log(parseInt([]));       //NaN

以上便是所總結的Number()和parseInt()/parseFloat()方法的轉型機制，特別說明：大部分規則摘自《JavaScript高階程式設計第三版》。

相關文章