JS-数据类型-数值Number

参考文章:数值

1.概述

1.1整数和浮点数

JavaScript不区分整数和浮点数,统一用Number表示,以下都是合法的Number类型:

123; // 整数123
0.456; // 浮点数0.456
1.2345e3; // 科学计数法表示1.2345x1000,等同于1234.5
-99; // 负数
NaN; // NaN表示Not a Number,当无法计算结果时用NaN表示
Infinity; // Infinity表示无限大,当数值超过了JavaScript的Number所能表示的最大值时,就表示为Infinity
复制代码
  • JavaScript 内部,所有数字都是以64位浮点数形式储存,即使整数也是如此。所以,11.0是相同的,是同一个数。
1 === 1.0 // true
复制代码

这就是说,JavaScript 语言的底层根本没有整数,所有数字都是小数64位浮点数)。

  • 由于浮点数不是精确的值,所以涉及小数的比较和运算要特别小心。
0.1 + 0.2 === 0.3
// false

0.3 / 0.1
// 2.9999999999999996

(0.3 - 0.2) === (0.2 - 0.1)
// false
复制代码
  • JS内部浮点数标准表达形式
(-1)^符号位 * (1.xx...xx) * (2^指数部分)
复制代码
  • 根据国际标准IEEE754,JavaScript 浮点数的64个二进制表示法有三部分组成:
    (1)符号位:第1位,0表示正数1表示负数
    (2)指数部分:第2位到第12位(共11位),决定了数值的大小范围
    (3)小数部分:第13位到第64位(共52位),决定了数值的精度

1.2数值精度

1.xx...xx表示有效数字。其中xx..xx的部分用52位二进制数表示。因此,加上.前面的二进制1JavaScript 提供的有效数字最长为53个二进制位。

  • 精度最多只能到53个二进制位,这意味着-2^53到2^53的整数,都可以精确表示。
Math.pow(2, 53)//pow()方法返回 x 的 y 次幂的值
// 9007199254740992
 
Math.pow(2, 53) + 1
// 9007199254740992

Math.pow(2, 53) + 2
// 9007199254740994

Math.pow(2, 53) + 3
// 9007199254740996

Math.pow(2, 53) + 4
// 9007199254740996
复制代码

上面代码中,大于2的53次方以后,整数运算的结果开始出现错误。所以,大于2的53次方的数值,都无法保持精度。由于2的53次方是一个16位的十进制数值,所以简单的法则就是,JavaScript 对15位十进制数都可以精确处理

1.3数值范围(指数决定)

11个二进制位表示指数部分。大小范围二进制00000000000 - 11111111111,十进制即为02047(2的11次方减1)。
也就是说,64位浮点数的指数部分的值最大为2047,分出一半表示负数,则 JavaScript 能够表示的数值范围为2^1024到2^-1023(开区间),超出这个范围的数无法表示。

  • 如果一个数大于等于2的1024次方,那么就会发生“正向溢出”,即 JavaScript 无法表示这么大的数,这时就会返回Infinity
Math.pow(2, 1024) // Infinity
复制代码
  • 如果一个数小于2的-1075次方(指数部分最小值-1023,再加上小数部分的52位),那么就会发生为“负向溢出”,即 JavaScript 无法表示这么小的数,这时会直接返回0。
Math.pow(2, -1076) // 0
复制代码
  • 下面是一个实际的例子。
var x = 0.5;

for(var i = 0; i < 25; i++) {
  x = x * x;
}

x // 0
复制代码

上面代码中,对0.5连续做25次平方,由于最后结果太接近0,超出了可表示的范围,JavaScript 就直接将其转为0。

  • JavaScript 提供Number对象MAX_VALUEMIN_VALUE属性,返回可以表示的具体的最大值最小值
Number.MAX_VALUE // 1.7976931348623157e+308
Number.MIN_VALUE // 5e-324
复制代码

2.数值的表示法

JavaScript 的数值有多种表示方法,可以用字面形式直接表示,比如35(十进制)和0xFF(十六进制)。

  • 数值也可以采用科学计数法表示,下面是几个科学计数法的例子。
123e3 // 123000
123e-3 // 0.123
-3.1E+12
.1e-23
复制代码

科学计数法允许字母e或E的后面,跟着一个整数,表示这个数值的指数部分。

  • 以下两种情况,JavaScript 会自动将数值转为科学计数法表示,其他情况都采用字面形式直接表示。

(1)小数点前的数字多于21位。

1234567890123456789012
// 1.2345678901234568e+21

123456789012345678901
// 123456789012345680000
复制代码

(2)小数点后的零多于5个。

// 小数点后紧跟5个以上的零,
// 就自动转为科学计数法
0.0000003 // 3e-7

// 否则,就保持原来的字面形式
0.000003 // 0.000003
复制代码

3.数值的进制

使用字面量(literal)直接表示一个数值时,JavaScript 对整数提供四种进制的表示方法:十进制、十六进制、八进制、二进制。

  • 十进制:没有前导0的数值(但如果前导0后面有数字8和9,则该数值被视为十进制。)。
  • 八进制:有前缀0o或0O的数值,或者有前导0、且只用到0-7的八个阿拉伯数字的数值。
  • 十六进制:有前缀0x或0X的数值。
  • 二进制:有前缀0b或0B的数值。

默认情况下,JavaScript 内部会自动将八进制、十六进制、二进制转为十进制。下面是一些例子。

0xff // 255
0o377 // 255
0b11 // 3
复制代码
  • 如果八进制、十六进制、二进制的数值里面,出现不属于该进制的数字,就会报错。
0xzz // 报错
0o88 // 报错
0b22 // 报错
复制代码

上面代码中,十六进制出现了字母z、八进制出现数字8、二进制出现数字2,因此报错。

  • 通常来说,有前导0的数值会被视为八进制,但是如果前导0后面有数字8和9,则该数值被视为十进制。
0888 // 888
0777 // 511
复制代码

前导0表示八进制,处理时很容易造成混乱。ES5 的严格模式和 ES6,已经废除了这种表示法,但是浏览器为了兼容以前的代码,目前还继续支持这种表示法。

4.特殊数值

4.1正零和负零

前面说过,JavaScript 的64位浮点数之中,有一个二进制位符号位。这意味着,任何一个数都有一个对应的负值,就连0也不例外。

JavaScript 内部实际上存在2个0:一个是+0,一个是-0,区别就是64位浮点数表示法的符号位不同。

  • 它们是等价的。
-0 === +0 // true
0 === -0 // true
0 === +0 // true
复制代码
  • 几乎所有场合,正零和负零都会被当作正常的0。
+0 // 0
-0 // 0
(-0).toString() // '0'
(+0).toString() // '0'
复制代码
  • 唯一有区别的场合是,+0或-0当作分母,返回的值是不相等的。
(1 / +0) === (1 / -0) // false
复制代码

上面的代码之所以出现这样结果,是因为除以正零得到+Infinity,除以负零得到-Infinity,这两者是不相等的(关于Infinity详见下文)。

4.2NaN

(1)含义

NaN是 JavaScript 的特殊值,表示“非数字”(Not a Number),主要出现在将字符串解析成数字出错的场合。

  • 下面代码运行时,会自动将字符串x转为数值,但是由于x不是数值,所以最后得到结果为NaN,表示它是“非数字”(NaN)。
5 - 'x' // NaN
复制代码
  • 另外,一些数学函数的运算结果会出现NaN。
Math.acos(2) // NaN
Math.log(-1) // NaN
Math.sqrt(-1) // NaN
复制代码
  • 0除以0也会得到NaN。
0 / 0 // NaN
复制代码
  • 需要注意的是,NaN不是独立的数据类型,而是一个特殊数值,它的数据类型依然属于Number,使用typeof运算符可以看得很清楚。
typeof NaN // 'number'
复制代码

(2)运算规则

  • NaN不等于任何值,包括它本身
NaN === NaN // false
复制代码
  • 数组的indexOf方法内部使用的是严格相等运算符,所以该方法对NaN不成立。
[NaN].indexOf(NaN) // -1
复制代码
  • NaN在布尔运算时被当作false。
Boolean(NaN) // false
复制代码
  • NaN与任何数(包括它自己)的运算,得到的都是NaN。
NaN + 32 // NaN
NaN - 32 // NaN
NaN * 32 // NaN
NaN / 32 // NaN
复制代码

4.3Infinity

(1)含义

Infinity表示“无穷”,用来表示两种场景。

  • 一种是一个正的数值太大,或一个负的数值太小,无法表示;
  • 另一种是非0数值除以0,得到Infinity。
// 场景一
Math.pow(2, 1024)
// Infinity

// 场景二
0 / 0 // NaN
1 / 0 // Infinity
复制代码
  • Infinity有正负之分,Infinity表示正的无穷,-Infinity表示负的无穷。
Infinity === -Infinity // false

1 / 0 // Infinity
1 / -0 // -Infinity
复制代码
  • 由于数值正向溢出(overflow)、负向溢出(underflow)和被0除,JavaScript 都不报错,所以单纯的数学运算几乎没有可能抛出错误

  • Infinity大于一切数值(除了NaN),-Infinity小于一切数值(除了NaN)。

Infinity > 1000 // true
-Infinity < -1000 // true
复制代码
  • Infinity与NaN比较,总是返回false。
Infinity > NaN // false
-Infinity > NaN // false

Infinity < NaN // false
-Infinity < NaN // false
复制代码

(2)运算规则

  • Infinity的四则运算,符合无穷的数学计算规则。
5 * Infinity // Infinity
5 - Infinity // -Infinity
Infinity / 5 // Infinity
5 / Infinity // 0
复制代码
  • 0乘以Infinity,返回NaN;0除以Infinity,返回0;Infinity除以0,返回Infinity。
0 * Infinity // NaN
0 / Infinity // 0
Infinity / 0 // Infinity
复制代码
  • Infinity加上或乘以Infinity,返回的还是Infinity。
Infinity + Infinity // Infinity
Infinity * Infinity // Infinity
复制代码
  • Infinity减去或除以Infinity,得到NaN。
Infinity - Infinity // NaN
Infinity / Infinity // NaN
复制代码
  • Infinity与null计算时,null会转成0,等同于与0的计算。
null * Infinity // NaN
null / Infinity // 0
Infinity / null // Infinity
复制代码
  • Infinity与undefined计算,返回的都是NaN。
undefined + Infinity // NaN
undefined - Infinity // NaN
undefined * Infinity // NaN
undefined / Infinity // NaN
Infinity / undefined // NaN
复制代码

5.与数值相关的全局方法

5.1parseInt()

(1)基本用法

  • parseInt方法用于将字符串转为整数
parseInt('123') // 123
复制代码
  • 如果字符串头部有空格,空格会被自动去除。
parseInt('   81') // 81
复制代码
  • 如果parseInt的参数不是字符串,则会先转为字符串再转换。
parseInt(1.23) // 1
// 等同于
parseInt('1.23') // 1
复制代码
  • 字符串转为整数的时候,是一个个字符依次转换,如果遇到不能转为数字字符,就不再进行下去,返回已经转好的部分。
parseInt('8a') // 8
parseInt('12**') // 12
parseInt('12.34') // 12
parseInt('15e2') // 15
parseInt('15px') // 15
复制代码

上面代码中,parseInt的参数都是字符串,结果只返回字符串头部可以转为数字的部分。

  • 如果字符串的第一个字符不能转化为数字(后面跟着数字的正负号除外),返回NaN。
parseInt('abc') // NaN
parseInt('.3') // NaN
parseInt('') // NaN
parseInt('+') // NaN
parseInt('+1') // 1
复制代码

所以,parseInt的返回值只有两种可能,要么是一个十进制整数,要么是NaN。 上面代码中,尤其值得注意,parseInt空字符串转为NaN。

  • 如果字符串以0x或0X开头,parseInt会将其按照十六进制数解析。
    默认情况下,JavaScript 内部会自动将八进制、十六进制、二进制转为十进制。
parseInt('0x10') // 16
parseInt('0o377') // 255
parseInt('0b11') // 3
复制代码
  • 如果字符串以0开头,将其按照10进制解析。
parseInt('011') // 11
复制代码
  • 对于那些会自动转为科学计数法的数字,parseInt会将科学计数法的表示方法视为字符串,因此导致一些奇怪的结果。
parseInt(1000000000000000000000.5) // 1
// 等同于
parseInt('1e+21') // 1

parseInt(0.0000008) // 8
// 等同于
parseInt('8e-7') // 8
复制代码

(2)进制转换

parseInt方法还可以接受第二个参数(2到36之间),表示被解析的值的进制,返回该值对应的十进制数

  • 默认情况下,parseInt的第二个参数为10,即默认是十进制转十进制。
parseInt('1000') // 1000
复制代码

// 等同于

parseInt('1000', 10) // 1000
复制代码
  • 下面是转换指定进制的数的例子。
parseInt('1000', 2) // 8
parseInt('1000', 6) // 216
parseInt('1000', 8) // 512
复制代码

上面代码中,二进制、六进制、八进制的1000,分别等于十进制的8、216和512。这意味着,可以用parseInt方法进行进制的转换。

  • 如果第二个参数不是数值,会被自动转为一个整数。
parseInt('10', '10') // 10
复制代码
  • 第二个参数转换后的整数只有在2到36之间,才能得到有意义的结果,超出这个范围,则返回NaN。
parseInt('10', 37) // NaN
parseInt('10', 1) // NaN
复制代码
  • 如果第二个参数是0、undefined和null,则直接忽略。
parseInt('10', 0) // 10
parseInt('10', null) // 10
parseInt('10', undefined) // 10
复制代码
  • 如果字符串包含对于指定进制无意义的字符,则从最高位开始,只返回可以转换的数值。如果最高位无法转换,则直接返回NaN。
parseInt('1546', 2) // 1
parseInt('546', 2) // NaN
复制代码

上面代码中,对于二进制来说,1是有意义的字符,5、4、6都是无意义的字符,所以第一行返回1,第二行返回NaN。

5.2parseFloat()

  • parseFloat方法用于将一个字符串转为浮点数
parseFloat('3.14') // 3.14
复制代码
  • 如果字符串符合科学计数法,则会进行相应的转换。
parseFloat('314e-2') // 3.14
parseFloat('0.0314E+2') // 3.14
复制代码
  • 如果字符串包含不能转为浮点数的字符,则不再进行往后转换,返回已经转好的部分。
parseFloat('3.14more non-digit characters') // 3.14
复制代码
  • parseFloat方法会自动过滤字符串前导的空格。
parseFloat('\t\v\r12.34\n ') // 12.34
复制代码
  • 如果参数不是字符串,或者字符串的第一个字符不能转化为浮点数,则返回NaN。
parseFloat([]) // NaN
parseFloat('FF2') // NaN
parseFloat('') // NaN
复制代码

上面代码中,尤其值得注意,parseFloat会将空字符串转为NaN。

  • 这些特点使得parseFloat的转换结果不同于Number函数。

JavaScript 中 Number()、parseInt()、parseFloat()的区别

parseFloat(true)  // NaN
Number(true) // 1

parseFloat(null) // NaN
Number(null) // 0

parseFloat('') // NaN
Number('') // 0

parseFloat('123.45#') // 123.45
Number('123.45#') // NaN
复制代码

5.3isNaN()

  • isNaN方法可以用来判断一个值是否为NaN。
isNaN(NaN) // true
isNaN(123) // false
复制代码
  • 但是,isNaN只对数值有效,如果传入其他值,会被先转成数值。
    比如,传入字符串的时候,字符串会被先转成NaN,所以最后返回true,这一点要特别引起注意。也就是说,isNaN为true的值,有可能不是NaN,而是一个字符串。
isNaN('Hello') // true
// 相当于
isNaN(Number('Hello')) // true
// 相当于
isNaN(isNaN) // true
复制代码

出于同样的原因,对于对象和数组,isNaN也返回true。

isNaN({}) // true
// 等同于
isNaN(Number({})) // true

isNaN(['xzy']) // true
// 等同于
isNaN(Number(['xzy'])) // true
复制代码

但是,对于空数组和只有一个数值成员的数组,isNaN返回false。

isNaN([]) // false
isNaN([123]) // false
isNaN(['123']) // false
复制代码

上面代码之所以返回false,原因是这些数组能被Number函数转成数值,请参见《数据类型转换》一章。

  • 因此,使用isNaN之前,需要先判断一下数据类型
function myIsNaN(value) {
  return typeof value === 'number' && isNaN(value);
}
复制代码

5.4isFinite()

isFinite方法返回一个布尔值,表示某个值是否为正常的数值。

isFinite(Infinity) // false
isFinite(-Infinity) // false
isFinite(NaN) // false
isFinite(undefined) // false
isFinite(null) // true
isFinite(-1) // true
复制代码

除了Infinity、-Infinity、NaN和undefined这几个值会返回false,isFinite对于其他的数值都会返回true。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值