ECMAScript 数据类型之Number类型

2024-04-02 19:55

短信预约 -IT技能 免费直播动态提醒

前言

本文为【JSRedBook】中数据类型的篇章，主要讲述 ECMAScript 的 6 种简单数据类型（原始类型）中的其中一种：Number 类型；主要说明五个方面：Number定义，浮点值，值的范围，NaN与 数值转换；

Number 类型：

Number 类型使用 IEEE 754 格式表示整数和浮点值（在某些语言中也叫双精度值），不同的数值类型相应地也有不同的数值字面量格式。

练习场景

最基本的数值字面量格式是十进制整数，如下：

 const intNum = 42;

其他进制

整数也可以用八进制（以 8 为基数）或十六进制（以 16 为基数）字面量表示

八进制

对于八进制字面量，第一个数字必须是零（0），然后是相应的八进制数字（数值 0~7），如果字面量中包含的数字超出了应有的范围，就会忽略前缀的零，后面的数字序列会被当成十进制数。

下面是几个例子：

 let octalNum1 = 070; // 八进制的 56 
 let octalNum2 = 079; // 无效的八进制值，当成 79 处理
 let octalNum3 = 08; // 无效的八进制值，当成 8 处理

注意： 八进制字面量在严格模式下是无效的，会导致 JavaScript 引擎抛出语法错误

原因是ECMAScript 2015 或 ES6 中的八进制值通过前缀 0o 来表示；严格模式下，前缀 0 会被视为语法错误，如果要表示八进制值，应该使用前缀 0o

十六进制

要创建十六进制字面量，必须让真正的数值前缀 0x（区分大小写），然后是十六进制数字（09 以及 AF），十六进制数字中的字母大小写均可

下面是几个例子：

 let hexNum1 = 0xA; // 十六进制 10 
 let hexNum2 = 0x1f; // 十六进制 31

使用八进制和十六进制格式创建的数值在所有数学操作中都被视为十进制数值。

注意： 由于 JavaScript 保存数值的方式，实际中可能存在正零（+0）和负零（-0）；其中正零和负零在所有情况下都被认为是等同的

浮点值

要定义浮点值，数值中必须包含小数点，而且小数点后面必须至少有一个数字，虽然小数点前面不是必须有整数，但推荐加上

下面是几个例子：

 const floatNum1 = 1.1;
 const floatNum2 = 0.1;
 const floatNum3 = .1; // 有效 但不推荐

因为存储浮点值使用的内存空间是存储整数值的两倍，所以 ECMAScript 总是想方设法把值转换为整数。在小数点后面没有数字的情况下，数值就会变成整数。类似地，如果数值本身就是整数，只是小数点后面跟着 0（如 1.0），那它也会被转换为整数.

下面是几个例子：

 let floatNum1 = 1.; // 小数点后面没有数字，当成整数 1 处理
 let floatNum2 = 10.0; // 小数点后面是零，当成整数 10 处理

科学计数法

科学记数法用于表示一个应该乘以10 的给定次幂的数值，对于非常大或非常小的数值浮点值可以用科学记数法来表示。

ECMAScript 中科学记数法的格式要求是一个数值（整数或浮点数）后跟一个大写或小写的字母 e，再加上一个要乘的 10 的多少次幂。如下：

 let floatNum = 3.125e7; // 等于 31250000

解法：3.125 作为系数，乘以 10 的 7 次幂，正常也直接书写出来，只是用科学计数法会更加简洁。

小数值

科学记数法也可以用于表示非常小的数值

默认情况下，ECMAScript 会将小数点后至少包含 6 个零的浮点值转换为科学记数法

例如，0.0000003 用科学记数法可以表示为 3e-7 ，又例如 0.000000000000000 03 会被转换为 3e-17；

不清晰的话请看下图：

浮点值精确度

浮点值的精确度最高可达 17 位小数，但在算术计算中远不如整数精确。

举例一个坑， 0.1 加 0.2 得到的不是 0.3，而是 0.30000000000000004，如下：

 
 
 if (a + b == 0.3) { // 别这么干！ 
  console.log("You got 0.3."); 
 } // 并不等于 0.3 因此if中的语句不会执行

如果两个数值分别是 0.05 和 0.25，或者 0.15 和 0.15，那没问题；但如果是 0.1 和 0.2，如前所述，测试将失败。由于这种微小的舍入错误，导致很难测试，因此永远不要测试某个特定的浮点值。

注意：之所以存在这种舍入错误，是因为使用了 IEEE 754 数值，这种错误并非 ECMAScript 所独有，其他使用相同格式的语言也有这个问题。

值的范围

由于内存的限制，ECMAScript 并不支持表示这个世界上的所有数值

最大值与最小值

ECMAScript 可以表示的最小数值保存在 Number.MIN_VALUE 中，这个值在多数浏览器中是 5e-324；可以表示的最大数值保存在 Number.MAX_VALUE 中，这个值在多数浏览器中是1.7976931348623157e+308。

小知识： 使用 Number.NEGATIVE_INFINITY（负无穷大）和 Number.POSITIVE_INFINITY（正无穷大）也可以获取正负 Infinity

Infinity

如果某个计算得到的数值结果超出了 JavaScript 可以表示的范围，那么这个数值会被自动转换为一个特殊的 Infinity（无穷）值；任何无法表示的负数以 -Infinity（负无穷大）表示，任何无法表示的正数以 Infinity（正无穷大）表示。

isFinite() 函数

如果计算返回正 Infinity 或负 Infinity，则该值将不能再进一步用于任何计算

这是因为 Infinity 没有可用于计算的数值表示形式，如果要确定一个值是不是有限大（即介于 JavaScript 能表示的最小值和最大值之间），可以使用 isFinite()函数，如下所示：

 let result = Number.MAX_VALUE + Number.MAX_VALUE; 
 console.log(isFinite(result)); // false

注意： 虽然超出有限数值范围的计算并不多见，但总归还是有可能的；因此在计算非常大或非常小的数值时，有必要检测一下计算结果是否超出范围。

NaN

有一个特殊的数值叫 NaN，意思是 Not a Number（不是数值），用于表示本来要返回数值的操作失败了（而不是抛出错误）。

练习场景

比如，用 0 除任意数值在其他语言中通常都会导致错误，从而中止代码执行。

但在 ECMAScript 中，0、 +0 或 -0 相除都会返回 NaN：

 console.log( 0/0 ); // NaN 
 console.log( -0/+0 ); // NaN

如果分子是非 0 值，分母是有符号 0 或无符号 0，则会返回 Infinity 或 -Infinity：

 console.log( 5/0 );  // Infinity 
 console.log( 5/-0 );  // -Infinity

NaN特性

任何涉及 NaN 的操作始终返回 NaN（如 NaN/10），并且 NaN 不等于包括 NaN 在内的任何值。

例如，下面的比较操作会返回 false：

 console.log(NaN == NaN); // false

isNaN()函数

ECMAScript 提供了 isNaN()函数用于判断检测数值。

用法： 该函数接收一个参数，可以是任意数据类型，然后判断这个参数是否 “不是数值”。

性质： 把一个值传给 isNaN() 后，该函数会尝试把它转换为数值；某些非数值的值可以直接转换成数值，如字符串"10"或布尔值；任何不能转换为数值的值都会导致这个函数返回true。

语法： isNaN(vallue) 必传，参数为要检测的值

列举了5种常见场景，如下：

 
 
 console.log(isNaN(NaN)); // true 
 console.log(isNaN(10)); // false，10 是数值
 console.log(isNaN("10")); // false，可以转换为数值 10 
 console.log(isNaN("blue")); // true，不可以转换为数值
 console.log(isNaN(true)); // false，可以转换为数值 1

解释： 首先测试的是 NaN 本身，因为 Not a Number ，显然会返回 true；接着测试了数值 10

和字符串"10"，都返回 false，因为它们的数值都是 10；字符串"blue"不能转换为数值，因此函数返

回 true；布尔值 true 可以转换为数值 1，因此返回 false；

小知识： 虽然不常见，但 isNaN()可以用于测试对象。

机制： 首先会调用对象的 valueOf()方法，然后再确定返回的值是否可以转换为数值；如果不能，再调用 toString() 方法，并测试其返回值。

数值转换

有 3 个函数可以将非数值转换为数值：Number()、parseInt()和 parseFloat()。

Number()

Number()是转型函数，可用于任何数据类型。

语法

Number(object) 参数可选，为一个 JavaScript 对象；如果没有提供参数，则返回0。

Number()函数转换规则：

布尔值，true 转换为 1，false 转换为 0
数值，直接返回
null，返回 0
undefined，返回 NaN

字符串，应用以下规则：

如果字符串包含数值字符，包括数值字符前面带加、减号的情况，则转换为一个十进制数值。
因此，Number("123")返回 123，Number("011") 返回 11（忽略前面的零）
如果字符串包含有效的浮点值格式如"1.1"，则会转换为相应的浮点值（忽略前面的零）。
如果字符串包含有效的十六进制格式如"0xf"，则会转换为与该十六进制值对应的十进制整

数值：

如果是空字符串（不包含字符），则返回 0

如果字符串包含除上述情况之外的其他字符，则返回 NaN

对象，调用 valueOf()方法，并按照上述规则转换返回的值。如果转换结果是 NaN，则调用toString()方法，再按照转换字符串的规则转换

Number()函数场景练习

从不同数据类型到数值的转换有时候会比较复杂，看一看 Number() 的转换规则就知道了

下面是几个具体的例子：

 Number("一二三") // NaN
 Number(undefined) //NaN
 Number("001.01") // 1.01
 Number("") // 0
 Number(null) // 0

可以看到，字符串 "一二三" 转换之后是 NaN，因为它找不到对应的数值；undefined转换后为NaN；字符串 001.101 转换后是 1.01，因为前面的零被忽略了；最后空字符串与null转换后都是 0；

parseInt()

parseInt() 函数会解析一个字符串，并返回一个整数，并且更专注于字符串是否包含数值模式。

语法

parseInt(string, radix)

参数1必选，为要被解析的字符串。

参数2可选，表示要解析的数字的基数；该值介于 2 ~ 36 之间。

parseInt()函数转换规则

字符串最前面的空格会被忽略，从第一个非空格字符开始转换
如果第一个字符不是数值字符、加号或减号，parseInt()立即返回 NaN；这意味着空字符串也会返回 NaN（这一点跟 Number()不一样，它返回 0）。
如果第一个字符是数值字符、加号或减号，则继续依次检测每个字符，直到字符串末尾，或碰到非数值字符；如， "1234blue" 会被转换为 1234，因为 "blue" 会被完全忽略；类似地，"22.5"会被转换为 22，因为小数点不是有效的整数字符。

进制转换

假设字符串中的第一个字符是数值字符，parseInt() 函数也能识别不同的整数格式（十进制、八进制、十六进制）；换句话说，如果字符串以"0x"开头，就会被解释为十六进制整数；如果字符串以"0"开头，且紧跟着数值字符，在非严格模式下会被某些实现解释为八进制整数

parseInt()函数练习场景

只有一个参数的场景

请看下面几个例子：

 parseInt("22")  // 22
 parseInt("21.33") // 21
 parseInt(" 34 age 43 ")  // 34
 parseInt("Are you 99 ?")  // NaN
 parseInt("0010") // 10

两个参数的场景

不同的数值格式很容易混淆，因此 parseInt() 也接收第二个参数，用于指定底数（进制数）。如果知道要解析的值是十六进制，那么可以传入 16 作为第二个参数，以便正确解析：

 parseInt("0xAF", 16); // 175 
 parseInt("33",8) // 102

事实上，如果提供了十六进制参数，那么字符串前面的"0x"可以省掉：

 let num1 = parseInt("AF", 16); // 175 
 let num2 = parseInt("AF"); // NaN

在这个例子中，第一个转换是正确的，而第二个转换失败了。区别在于第一次传入了进制数作为参数，告诉 parseInt() 要解析的是一个十六进制字符串。而第二个转换检测到第一个字符就是非数值字符，随即自动停止并返回 NaN。

通过第二个参数，可以极大扩展转换后获得的结果类型。比如：

 let num1 = parseInt("10", 2); // 2 按二进制解析
 let num2 = parseInt("10", 8); // 8 按八进制解析
 let num3 = parseInt("10", 10); // 10，按十进制解析
 let num4 = parseInt("10", 16); // 16，按十六进制解析

因为不传底数参数相当于让 parseInt() 自己决定如何解析，所以为避免解析出错，建议始终传给它第二个参数。

注意： 大多数情况下解析的应该都是十进制数，此时第二个参数就要传入10.

parseFloat()

parseFloat() 函数可解析一个字符串，并返回一个浮点数

从下标 0 开始检测每个字符，解析到字符串末尾或者解析到一个无效的浮点数值字符为止；与parseInt()不同的是它第一次出现的小数点是有效的，但第二次出现的小数点就无效了，此时字符串的剩余字符都会被忽略

语法

parseFloat(string) 参数必选，为要被解析的字符串。

parseFloat()函数转换规则

parseFloat()函数的另一个不同之处在于，它始终忽略字符串开头的零。

这个函数能识别前面讨论的所有浮点格式，以及十进制格式（开头的零始终被忽略），十六进制数值始终会返回；因为 parseFloat() 只解析十进制值，因此不能指定底数。

parseInt()函数练习场景

下面是几个示例：

 parseFloat("1234blue"); // 1234，按整数解析
 parseFloat("0xA"); // 0 
 parseFloat("22.5"); // 22.5 
 parseFloat("0022.34.5"); // 22.34 
 parseFloat("3.125e7"); // 31250000

注意： 如果字符串表示整数（没有小数点或者小数点后面只有一个零），则 parseFloat() 返回整数

总结

Number类型为JavaScript中唯一的数字类型，整数的精度最多为15位

进制： JavaScript 会把数值常量解析，若前缀为 0，则解释为八进制数；如果前缀为 "0x"，则解释为十六进制数
浮点值： 要定义浮点值，数值中必须包含小数点，而且小数点后面必须至少有一个数字
科学记数法： 用于表示一个应该乘以10 的给定次幂的数值，较大的数值使用它会更加简洁
无穷： 最大值（Infinity）表示 1.7976931348623157e+308，最小值表示 5e-324
NaN： 意思是 Not a Number（不是数值），可以把 Number 对象设置为该值，来指示其不是数字值；任何涉及 NaN 的操作始终返回 NaN，并且 NaN 不等于包括 NaN 在内的任何值
Number()适用于向多样类型转型为数值型
parseInt()适用于将字符串转换成浮点数
parseFloat()适用于将字符串转换成整型数字