JavaScript数字之Number()、parseInt()和parseFloat()

参考网址:https://www.cnblogs.com/mawn/p/9197421.html

Number()、parseInt()、parseFloat()是javascript用于转换数据的函数。其中,Number()可以用于任何数据类型,而parseInt和parseFloat通常只能作用于字符串、数字类型。他们之间有什么特点,区别或联系呢?

Number

Number语法如下:

var num = new Number(value)

其中,value表示输入值。

Number()函数的转换规则如下:

  • 如果输入Boolean类型,true和false分别转换为1和0。
  • 如果输入数字,则返回输入的值。
  • 如数输入null,返回0。
  • 输入输入undefined,返回NaN。
  • 如果输入字符串,则遵循以下规则:
    • 如果输入字符串只包含数字(包括前面的正负号),则转换为十进制(前面的“0”会被忽略)。
    • 如果输入字符串只包含有效浮点格式,则转换为对应的浮点数(前面的“0”会被忽略)。
    • 如果输入字符串中包含二进制、八进制、十六进制格式,则转换为相同大小的十进制整数。
    • 如果输入字符串不包含任何字符,则将其转换为0。
    • 如果输入字符串包含除上述格式外的字符,则将其转换为NAN。
  • 如果输入对象,则调用对象的valueOf()方法(通常用于Date对象),然后依照前面的规则返回数值。如果转换的结果是NaN,则调用对象的toString()方法,然后再依照前面的规则将返回的字符串转换为对应数值。

依照规则,我们看一个“栗子”,不知道这个“栗子”好不好消化。

 1 // Boolean类型
 2 console.log(Number(true)); // 1 
 3 console.log(Number(false)); // 0 
 4 // 数字类型
 5 console.log(Number(3.5)); // 3.5
 6 // null
 7 console.log(Number(null)); // 0
 8 // undefined
 9 console.log(Number(undefined)); // NaN
10 // 字符串
11 console.log(Number("-03")); // -3 (只包含数字)
12 console.log(Number("-03.5")); // -3.5 (浮点数)
13 console.log(Number("0b10")); // 2 (0b为开头表示二进制值)
14 console.log(Number("0O10")); // 2 (0O为开头表示八进制值)
15 console.log(Number("0x10")); // 16 (0x为开头表示十六进制值)
16 console.log(Number("")); // 0 (不包含任何字符)
17 console.log(Number("5Hello world!")); // NaN (除上述格式外的字符)
18 // 对象
19 console.log(Number(new Date())); // 1625725184135 (Date对象的valueOf方法获取到的是Date对象的原始值。根据实际时间,值不同)
20 var testObj = {
21     toString: function() {
22         return '0x10';
23     }
24 };
25 console.log(testObj.toString(), Number(testObj)); // 0x10 16 (对象的toString() 方法返回值的转换值)

 parseInt

有上面可以知道,Number转换为字符串的时候,还是比较复杂的。如果只是处理整数的时候,通常使用parseInt()函数。parseInt()函数规则如下:

  • 输入数字类型,返回整数部分数字。
  • 输入字符串,如果字符串前面有空格,会忽略空格,直到出现第一个非空字符。
  • 输入字符串,如果非空第一个字符不是数字或正负符号,返回NAN。
  • 输入字符串,会依照顺序解析非空字符串的数字,直到出现非数字字符。
  • 输入不包含任何字符的字符串,返回NAN。
  • 输入字符串,可解析部分可以依据Number的转换方法,然后截取整数部分(支持二进制、八进制、十六进制转换为十进制)。
  • 如果输入Boolean类型、null、undefined,返回NaN。
  • 如果输入对象包含toString()方法,则调用toString()方法,然后将返回的字符串依据以上规则返回对应的数值;否则返回NaN。

用事实说话,用例子理解这些规则。

 1 // 数字类型
 2 console.log(parseInt(3.6)); // 3
 3 // 字符串
 4 console.log(parseInt(" 3.6")); // 3  (字符串,忽略前面的空格)
 5 console.log(parseInt("X3.6")); // NaN (第一个非空字符不是数字或正负符号,返回NaN)
 6 console.log(parseInt("-03534F222")); //-3534 (从左到右解析,直到出现数字的字符类型)
 7 console.log(parseInt("")); //NaN (没有任何字符串,返回NaN)
 8 console.log(parseInt("0b10")); // 2 (0b为开头表示二进制值)
 9 console.log(parseInt("0O10")); // 2 (0O为开头表示八进制值)
10 console.log(parseInt("0x10")); // 16 (0x为开头表示十六进制值)
11 // 非字符串类型(NaN)
12 console.log(parseInt(true)); // NaN 
13 console.log(parseInt(undefined)); // NaN
14 console.log(parseInt(null)); // NaN
15 console.log(parseInt(new Date())); // NaN
16 // 对象(含toString()反复)
17 var testObj = {
18     toString: function() {
19         return ' 0x10';
20     }
21 };
22 console.log(testObj.toString(), parseInt(testObj)); // 0x10 16 (对象的toString() 方法返回值的转换值)
parseInt规则

parseFloat

与parseInt()的规则类似,只不过parseFloat()的是可以取到熟的浮点,这里就不逐一举例了。

至于要用哪一个,那就仁者见仁智者见智了。

注:Number对象其实还有其他属性和方法,值得我们探究的哦。

有志者,事竟成,破釜沉舟,百二秦关终属楚; 苦心人,天不负,卧薪尝胆,三千越甲可吞吴。
原文地址:https://www.cnblogs.com/luyj00436/p/14985496.html