广告
返回顶部
首页 > 资讯 > 精选 >es6 number对象的新增方法怎么用
  • 620
分享到

es6 number对象的新增方法怎么用

2023-07-04 11:07:43 620人浏览 泡泡鱼
摘要

本文小编为大家详细介绍“es6 number对象的新增方法怎么用”,内容详细,步骤清晰,细节处理妥当,希望这篇“es6 number对象的新增方法怎么用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。es6 num

本文小编为大家详细介绍“es6 number对象的新增方法怎么用”,内容详细,步骤清晰,细节处理妥当,希望这篇“es6 number对象的新增方法怎么用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

es6 number新增方法有:1、“Number.isFinite()”,可判断指定值是否为一个有限的数值;2、“Number.isNaN()”,可检测变量是否是一个NaN;3、“Number.parseInt()”,可将字符串转换为整数;4、“Number.parseFloat()”,可将字符串转换为浮点数;5、“Number.isInteger()”,可判断值是否为整数。

在 ES5 中,全局下的 isFinite () 和 isNaN () 两种方法存在类型转换,对最终的判断结果存在歧义。ES6 在 Number 对象上,新提供了 Number.isFinite () 和 Number.isNaN () 两个方法,更加健壮地进行数值的判断,接下来让我看看这两种方法。

Number.isFinite()


在 ES5 中有全局的 isFinite() 函数用来判断被传入的参数值是否为一个有限的数值,如果参数是字符串,会首先转为一个数值,然后在进行验证。

isFinite(Infinity);  // falseisFinite(NaN);       // falseisFinite(-Infinity); // falseisFinite(0);         // trueisFinite(2e64);      // trueisFinite('2e64');    // trueisFinite("0");       // true

上面的代码可以看出,字符串也会被先转为数值再进行判断,而 ES6 Number 对象上提供的 isFinite() 更健壮,和全局的 isFinite() 函数相比,这个方法不会强制将一个非数值的参数转换成数值,这就意味着,只有数值类型的值,且是有穷的(finite),才返回 true。

Number.isFinite(Infinity);  // falseNumber.isFinite(NaN);       // falseNumber.isFinite(-Infinity); // falseNumber.isFinite(0);         // trueNumber.isFinite(2e64);      // trueNumber.isFinite('2e64');// falseNumber.isFinite('0');       // false

Number.isNaN()


javascript 中与其它的值不同,NaN 不能通过相等操作符(== 和 ===)来判断 ,因为 NaN == NaN 和 NaN === NaN 都会返回 false。 因此,判断一个值是不是 NaN 是有必要的。

1、NaN 值的产生

当算术运算的结果返回一个未定义的或无法表示的值时,NaN 就产生了。但是,NaN 并不一定用于表示某些值超出表示范围的情况。

  • 将某些非数值强制转换为数值的时候,会得到 NaN。

  • 0 除以 0 会返回 NaN —— 但是其他数除以 0 则不会返回 NaN。

我们知道可以使用 Number() 方法进行类型转换,下面列举被强制类型转换为 NaN 的例子:

Number(undefined)// NaNNumber('undefined')// NaNNumber('string')// NaNNumber({})// NaNNumber('10,3')// NaNNumber('123ABC')// NaNNumber(new Date().toString())// NaN

上面的例子可以看出,很多值在强制类型转换下转为 NaN,针对这样的值去进行判断无疑是有问题的,下面我们来看下 isNaN () 的问题。

2、isNaN () 的问题

默认情况全局下存在方法 isNaN () 用了判断是否为 NaN 值,它要求接收的是数值类型的参数,但是当参数不是 Number 类型, isNaN 函数会首先尝试将这个参数转换为数值,然后才会对转换后的结果是否是 NaN 进行判断。

实例:

isNaN(NaN);       // trueisNaN(undefined); // trueisNaN('undefined')// trueisNaN({});        // trueisNaN(true);      // falseisNaN(null);      // falseisNaN(37);        // false// stringsisNaN("37");      // false: 可以被转换成数值37isNaN("37.37");   // false: 可以被转换成数值37.37isNaN("37,5");    // trueisNaN('123ABC');  // true:  parseInt("123ABC")的结果是 123, 但是Number("123ABC")结果是 NaNisNaN("");        // false: 空字符串被转换成0isNaN(" ");       // false: 包含空格的字符串被转换成0// datesisNaN(new Date());                // falseisNaN(new Date().toString());     // trueisNaN("imooc")   // true: "blabla"不能转换成数值                 // 转换成数值失败, 返回NaN

结合上面 NaN 是如何产生的例子的结果可以看出,使用 isNaN 来判断返回的是 true,这显然不是我们想要的结果。针对这样的问题,ES6 做了修补,下面我们看 ES6 中的 isNaN 方法。

3、Number.isNaN () 详情

ES6 提供了 Number.isNaN(x) ,通过这个方法来检测变量 x 是否是一个 NaN 将会是一种可靠的做法,它不会对所判断的值进行强制类型转换。

Number.isNaN(NaN);        // trueNumber.isNaN(Number.NaN); // trueNumber.isNaN(0 / 0)       // true// 下面这几个如果使用全局的 isNaN() 时,会返回 true。Number.isNaN("NaN");      // false,字符串 "NaN" 不会被隐式转换成数字 NaN。Number.isNaN(undefined);  // falseNumber.isNaN('undefined');// falseNumber.isNaN({});         // falseNumber.isNaN("blabla");   // falseNumber.isNaN(true);    // falseNumber.isNaN(null);    // falseNumber.isNaN(37);    // falseNumber.isNaN("37");    // falseNumber.isNaN("37.37"); // falseNumber.isNaN("");    // falseNumber.isNaN(" ");    // false

通过上面的实例,基本覆盖了现有程序的所有情况,不会出现使用全局下的 isNaN() 多带来的问题。所有推荐使用 Number.isNaN(x) 方式来判断是否是 NaN。在不支持 Number.isNaN 函数情况下,可以通过表达式 (x != x) 来检测变量 x 是不是 NaN 会更加可靠。

Number.parseInt()&Number.parseFloat()


为了保持方法上的统一,把全局下的 parseInt() 和 parseFloat() 移植到 ES6 的 Number 对象上。

ES6 的 Number 对象上提供的 Number.isFinite () 和 Number.isNaN () 两个函数是相同的,如何证明 Number 下的这两个方法只是移植全局的呢?可以利用 === 运算符来判断,如下实例:

Number.parseInt === parseInt;// trueNumber.parseFloat === parseFloat;// true

上面的代码返回的结果都为 ture 说明此两种函数和全局是一样的,没有发生变化。具体的使用方法可以参考 ES5 中的 parseInt() 和 parseFloat() 函数。

// ES5的写法parseInt('12.34') // 12parseFloat('123.45#') // 123.45// ES6的写法Number.parseInt('12.34') // 12Number.parseFloat('123.45#')  // 123.45

将这两个全局方法移植到 Number 对象上,为了逐步减少全局性方法,使语言逐步模块化。

Number.isInteger()


在学习这个函数之前,我们先来回顾一下,我们是怎么判断一个值为整数的?

1、判断一个值为整数

一种方法是:任何整数都会被 1 整除,即余数是 0。利用这个规则来判断是否是整数。就有如下函数:

function isInteger(value) {return typeof value === 'number' && value%1 === 0;}isInteger(5) // trueisInteger(5.5) // falseisInteger('') // falseisInteger('8') // falseisInteger(true) // falseisInteger([]) // false

另一种方法是:使用 Math.round、Math.ceil、Math.floor 判断,因为整数取整后还是等于自己。利用这个特性来判断是否是整数,使用 Math.floor 示例,如下:

function isInteger(value) {return Math.floor(value) === value;}isInteger(5) // trueisInteger(5.5) // falseisInteger('') // falseisInteger('8') // falseisInteger(true) // falseisInteger([]) // false

上面的两种方法算是比较常用的判断方式,其他的一些方式都存在一些问题,这里就不一一列举了。但是,这两种方法都不够简洁,ES6 把判断整数提升到了语言层面,下面我们来看下 Number.isInteger() 的使用。

2、Number.isInteger () 的用法

Number.isInteger() 是 ES6 新增的函数,用来判断给定的参数是否为整数。

Number.isInteger(25) // trueNumber.isInteger(25.1) // false

如果被检测的值是整数,则返回 true,否则返回 false。注意 NaN 和正负 Infinity 不是整数。

Number.isInteger(0);         // trueNumber.isInteger(1);         // trueNumber.isInteger(-100000);   // trueNumber.isInteger(0.8);       // falseNumber.isInteger(Math.PI);   // falseNumber.isInteger(Infinity);  // falseNumber.isInteger(-Infinity); // falseNumber.isInteger("100");     // falseNumber.isInteger(true);      // falseNumber.isInteger(false);     // falseNumber.isInteger([1]);       // false

上面的代码基本涵盖了 JavaScript 中的值的判断,在一些不支持 ES6 语法的浏览器中可以使用上面的两种方式进行 Polyfill 处理。

Number.isSafeInteger()


Number.isSafeInteger() 是 ES6 新增的函数,用来判断传入的参数值是否是一个 “安全整数”(safe integer)在数值扩展的 小节 我们介绍了最大安全整数和最小安全整数,不记得的同学可以跳过去看看。

一个安全整数是一个符合下面条件的整数:

  • 可以准确地表示为一个 IEEE-754 双精度数字;

  • 其 IEEE-754 表示不能是舍入任何其他整数以适应 IEEE-754 表示的结果。

比如,2e53 - 1 是一个安全整数,它能被精确表示,在任何 IEEE-754 舍入模式(rounding mode)下,没有其他整数舍入结果为该整数。作为对比,2e53 就不是一个安全整数,它能够使用 IEEE-754 表示,但是 2e53 + 1 不能使用 IEEE-754 直接表示,在就近舍入(round-to-nearest)和向零舍入中,会被舍入为 2e53。

安全整数范围为 -(2e53 - 1)到 2e53 - 1 之间的整数,包含 -(2e53 - 1)和 2e53 - 1。

Number.isSafeInteger(3);                    // trueNumber.isSafeInteger(Math.pow(2, 53))       // falseNumber.isSafeInteger(Math.pow(2, 53) - 1)   // trueNumber.isSafeInteger(NaN);                  // falseNumber.isSafeInteger(Infinity);             // falseNumber.isSafeInteger("3");                  // falseNumber.isSafeInteger(3.1);                  // falseNumber.isSafeInteger(3.0);                  // true

读到这里,这篇“es6 number对象的新增方法怎么用”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注编程网精选频道。

--结束END--

本文标题: es6 number对象的新增方法怎么用

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

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

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

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

下载Word文档
猜你喜欢
  • es6 number对象的新增方法怎么用
    本文小编为大家详细介绍“es6 number对象的新增方法怎么用”,内容详细,步骤清晰,细节处理妥当,希望这篇“es6 number对象的新增方法怎么用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。es6 num...
    99+
    2023-07-04
  • es6 number对象的新增方法有哪些
    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。在 ES5 中,全局下的 isFinite () 和 isNaN () 两种方法存在类型转换,对最终的判断结果存在歧义。ES6 在 Number 对象上,...
    99+
    2022-11-22
    javascript ES6
  • es6新增对象的实用方法总结
    目录一、属性的简写二、属性名表达式三、super关键字四、扩展运算符的应用五、属性的遍历六、对象新增的方法Object.is()Object.assign()Object.getOw...
    99+
    2022-11-13
  • es6对象增加新的属性怎么使用
    今天小编给大家分享一下es6对象增加新的属性怎么使用的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。es6对象增加新的属性是“...
    99+
    2023-07-04
  • ES6新增的数组方法和对象有哪些
    这篇文章主要为大家展示了“ES6新增的数组方法和对象有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“ES6新增的数组方法和对象有哪些”这篇文章吧。es6新增...
    99+
    2022-10-19
  • es6新增的声明方法怎么用
    本文小编为大家详细介绍“es6新增的声明方法怎么用”,内容详细,步骤清晰,细节处理妥当,希望这篇“es6新增的声明方法怎么用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。新增声明方法:1、let,用于声明变量,语...
    99+
    2023-06-29
  • es6对象增加新的属性是什么
    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。JavaScript 中对象是非常重要的数据结构,ES6 对对象进行了极大的扩展,使用上也更加简洁。其中es6对象增加新的属性是“name”。对象方法的 ...
    99+
    2022-11-22
    ES6 javascript
  • es6中新增的数组方法怎么使用
    本文小编为大家详细介绍“es6中新增的数组方法怎么使用”,内容详细,步骤清晰,细节处理妥当,希望这篇“es6中新增的数组方法怎么使用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。es6数组方法有:1、Array....
    99+
    2023-07-05
  • ES6新特性中promise对象的用法
    这篇文章主要介绍了ES6新特性中promise对象的用法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。1. promise 介绍它是一个对象...
    99+
    2022-10-19
  • ES6的内置对象扩展方法怎么用
    本篇内容主要讲解“ES6的内置对象扩展方法怎么用”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“ES6的内置对象扩展方法怎么用”吧!Array的扩展方法1.扩展运算符(展开语法)扩展运算符可以将数...
    99+
    2023-07-02
  • es6新增的遍历方法是什么
    这篇文章主要介绍es6新增的遍历方法是什么,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完! 新增的遍历方法有:1、findIndex(),可遍历数组,查找匹...
    99+
    2022-10-19
  • ES6对象新功能与解构赋值的方法
    这篇“ES6对象新功能与解构赋值的方法”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“ES6对象新功能与解构赋值的方法”文章吧...
    99+
    2023-06-17
  • JavaScript 对象新增方法defineProperty与keys的使用说明
    目录一:Object.defineProperty() 1.1 参数说明1.2 第三个参数 descriptor 的说明1.3 实际使用1.3.1 wr...
    99+
    2022-11-13
  • es6新增的运算符怎么使用
    这篇文章主要讲解了“es6新增的运算符怎么使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“es6新增的运算符怎么使用”吧!es6新增运算符有:1、可选链运算符“.”,可以判断操作符之前属性...
    99+
    2023-07-05
  • ES6新增的箭头函数怎么用
    今天小编给大家分享一下ES6新增的箭头函数怎么用的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下...
    99+
    2022-10-19
  • es6中数组新增常用的方法有哪些
    这篇文章主要介绍“es6中数组新增常用的方法有哪些”,在日常操作中,相信很多人在es6中数组新增常用的方法有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”es6中数组新增...
    99+
    2022-10-19
  • es6中map对象的遍历方法是什么
    这篇“es6中map对象的遍历方法是什么”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“es...
    99+
    2022-10-19
  • es6对象解构赋值的方法是什么
    ES6对象解构赋值的方法是通过使用花括号({})来提取对象中的属性,并将其赋值给变量。具体方法为:```javascriptcons...
    99+
    2023-10-09
    es6
  • ES6中字符串string常用的新增方法有哪些
    这篇文章主要为大家展示了“ES6中字符串string常用的新增方法有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“ES6中字符串string常用的新增方法有...
    99+
    2022-10-19
  • ES6新增的特性有哪些及怎么用
    这篇文章主要讲解了“ES6新增的特性有哪些及怎么用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“ES6新增的特性有哪些及怎么用”吧!理解ES6ECMAScr...
    99+
    2022-10-19
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作