广告
返回顶部
首页 > 资讯 > 精选 >ECMAScript数据类型之Number类型实例分析
  • 905
分享到

ECMAScript数据类型之Number类型实例分析

2023-06-30 18:06:26 905人浏览 安东尼
摘要

这篇文章主要介绍“ECMAScript数据类型之Number类型实例分析”,在日常操作中,相信很多人在ECMAScript数据类型之Number类型实例分析问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”ECM

这篇文章主要介绍“ECMAScript数据类型之Number类型实例分析”,在日常操作中,相信很多人在ECMAScript数据类型之Number类型实例分析问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”ECMAScript数据类型之Number类型实例分析”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

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;

不清晰的话请看下图:

ECMAScript数据类型之Number类型实例分析

浮点值精确度

浮点值的精确度最高可达 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() 返回整数

到此,关于“ECMAScript数据类型之Number类型实例分析”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注编程网网站,小编会继续努力为大家带来更多实用的文章!

--结束END--

本文标题: ECMAScript数据类型之Number类型实例分析

本文链接: https://www.lsjlt.com/news/330819.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • ECMAScript数据类型之Number类型实例分析
    这篇文章主要介绍“ECMAScript数据类型之Number类型实例分析”,在日常操作中,相信很多人在ECMAScript数据类型之Number类型实例分析问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”ECM...
    99+
    2023-06-30
  • ECMAScript 数据类型之Number类型
    目录前言练习场景其他进制八进制十六进制浮点值科学计数法小数值浮点值精确度值的范围最大值与最小值InfinityisFinite() 函数NaN练习场景NaN特性isNaN()函数数值...
    99+
    2022-11-13
  • js数据类型之数字类型的示例分析
    这篇文章主要介绍了js数据类型之数字类型的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。我们具体介绍一下js的数据类型其中一种。一、...
    99+
    2022-10-19
  • JavaScript中的数据类型Number实例分析
    这篇“JavaScript中的数据类型Number实例分析”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“JavaScript...
    99+
    2023-06-30
  • PHP数据类型之NULL型的示例分析
    这篇文章给大家分享的是有关PHP数据类型之NULL型的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。1:什么是NULL?对于MULL这个单词来说,他代表着空,并非是错误(false)以及0,也不是我们常用...
    99+
    2023-06-15
  • Go数据类型实例分析
    本篇内容介绍了“Go数据类型实例分析”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!每一个变量都有数据类型,Go中的数据类型有:简单数据类型:...
    99+
    2023-06-30
  • Python数据类型实例分析
    本篇内容主要讲解“Python数据类型实例分析”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Python数据类型实例分析”吧!一、内容概要字符串(str)列表(list)元组(tup)字典(di...
    99+
    2023-06-02
  • Ajax的数据类型实例分析
    今天小编给大家分享一下Ajax的数据类型实例分析的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。在 Ajax 的使用中,遇到了...
    99+
    2023-06-27
  • JS数值Number类型的示例分析
    小编给大家分享一下JS数值Number类型的示例分析,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!Number 问题下面的问题你都能回答对了吗?0.1 + 0.2 == 0.3 成立吗?....
    99+
    2022-10-19
  • JavaScript基础之数据类型的示例分析
    这篇文章主要为大家展示了“JavaScript基础之数据类型的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JavaScript基础之数据类型的示例分析...
    99+
    2022-10-19
  • Redis中String数据类型实例分析
    本文小编为大家详细介绍“Redis中String数据类型实例分析”,内容详细,步骤清晰,细节处理妥当,希望这篇“Redis中String数据类型实例分析”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。概述:字符串类...
    99+
    2023-06-29
  • JavaScript数据类型使用实例分析
    这篇文章主要讲解了“JavaScript数据类型使用实例分析”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript数据类型使用实例分析”吧! ...
    99+
    2022-10-19
  • ECMAScript的数据类型有哪些
    这篇文章的内容主要围绕ECMAScript的数据类型有哪些进行讲述,文章内容清晰易懂,条理清晰,非常适合新手学习,值得大家去阅读。感兴趣的朋友可以跟随小编一起阅读吧。希望大家通过这篇文章有所收获!ECMAS...
    99+
    2022-10-19
  • JavaScript中Number类型的示例分析
    这篇文章将为大家详细讲解有关JavaScript中Number类型的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。NumberNumber数字类型:包含整数和小数...
    99+
    2022-10-19
  • redis数据类型的示例分析
    这篇文章主要介绍redis数据类型的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!Redis支持5种数据类型,它们描述如下:Strings - 字符串Redis的字符串是字节...
    99+
    2022-10-18
  • javascript数据类型的示例分析
    这篇文章将为大家详细讲解有关javascript数据类型的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。1. undefined 和 nullundefined是...
    99+
    2022-10-19
  • Redis的五种数据类型实例分析
    本篇内容主要讲解“Redis的五种数据类型实例分析”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Redis的五种数据类型实例分析”吧!1.Redis的5种数据类...
    99+
    2022-10-19
  • Mysql中的Enum数据类型实例分析
    这篇文章主要介绍了Mysql中的Enum数据类型实例分析的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇Mysql中的Enum数据类型实例分析文章都会有所收获,下面我们一起来看看...
    99+
    2022-10-19
  • ECMAScript 的 6 种简单数据类型
    目录前言typeof 操作符类型检测使用说明小知识Undefined 类型练习场景undefined 与 not defined 的区别使用 typeof 检测 undefined小...
    99+
    2022-11-13
  • Python数据类型详解之字符串、数字实例分析
    这篇文章主要介绍“Python数据类型详解之字符串、数字实例分析”,在日常操作中,相信很多人在Python数据类型详解之字符串、数字实例分析问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Python数据类型详...
    99+
    2023-06-30
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作