上一节和大家学习了字符串的扩展,这一节轮到了数值,我们一起来学习数值的扩展。

这几天公众号都收到了很多同学问,什么时候出下一节,大家的期待和学习热情如此高涨,前端君也不会怠慢,继续更新。剧透一下,这一节并不会很烧脑,都是介绍类的知识讲解,理解性的东西不多,初学者们也可以愉快地看完。

传统的写法

在介绍数值的扩展之前我们来看看旧的规范和使用方式,有对比才能看出不同之处。

在ES5中,我们存在几个全局函数 isNaN函数,isFinite函数,parseInt函数,parseFloat函数等,对于这些全局函数的使用很简单,就拿isNaN函数来举例。

ES5中的写法是:

        isNaN(2.5);  //结果:false    window.isNaN(2.5);//结果:false

以上两种写法均可,isNaN是全局函数,本身就是属于window对象下的一个方法,所以大部分人会使用第一种写法。

但是在ES6的标准中,isNaN方法被移植到了Number对象上,也就是原本属于全局对象window下的函数,现在属于Number对象上了,同样被处理的函数还有isFinite函数,parseInt函数,parseFloat函数。

被移植后的函数使用方式是这样的:

        Number.isNaN(2.5); //结果:false

在使用之前必须指明它是Number对象下的函数,否则会被默认为window下的函数。

说了这么多,差点忘记了介绍isNaN函数本身的作用,以及它在ES6的规范下有什么不一样的地方。

新特性:Number.isNaN函数

Number.isNaN函数:用于判断传入的是否是非数值,注意:是判断非数值,而不是判断数值,IsNaN的全称是: is not a number。

使用方式上面已经演示过,但为了加深印象,再展示多一次:

        Number.isNaN(2.5); //结果:false

由于2.5是一个number类型的数值,所以返回false(再次注意:判断是非数值,所以是false,表示2.5是一个数值类型的值)。

那么,移植到Number对象isNaN函数和原本是全局函数的isNaN函数,有不一样的地方吗,还是仅仅简单地移植过来就完事了?

答案:有区别。

传统的isNaN函数会把非数值的参数转化成数值再进行判断,而Number. isNaN只对数值类型有效,非数值类型的参数一律返回false。看文字解释不过瘾,咱们看案例。

        isNaN('abc');//结果:true    //'abc'无法转为一个数值,返回true

    Number.isNaN('abc'); //结果:false    //'abc'是字符串,Number.isNaN不做类型转换,直接返回false

正如上面我写的注释一样,Number下面的isNaN都懒得给字符串’abc’做类型转换,直接返回false。而ES5中的isNaN函数会对字符串’abc’进行类型转换后,发现它是一个NaN(非数值),才返回true。

所以我们在使用这个函数到时候还要小心,当返回false的时候,不一定就是一个数值,有可能是一个非数值类型的参数。

新特性:Number.isFinite函数

Number.isFinite函数:用来检查一个数值是否非无穷。注意是判断非无穷,不是判断无穷,这里跟isNaN函数一样,有点绕。

        Number.isFinite(1);    //结果:true,数值1是有穷,即非无穷

    Number.isFinite(Infinity);    //结果:false,Infinity表示无穷大的特殊值

注意第二行代码的参数:Infinity,Infinity是window对象下的一个常量,表示一个无穷数。所以第二行代码会返回false。此外,isFinite函数跟isNaN函数一样,也只是对数值类型有效,对非数值类型的参数一律返回false。

        Number.isFinite('abc'); //结果:false

所以同样要注意,当Number.isFinite函数返回false的时候,参数不一定就是一个有穷的数值类型,也有可能是一个非数值类型的参数。如:字符串’abc’。

新特性:Number.parseInt函数

parseInt函数:解析一个字符串,返回一个整数。parseInt函数同样是从window对象下移植到Number对象下,但是它的作用没有任何变化。

        //传统用法:    parseInt('12.3abc');      //结果:返回数值12

    //ES6用法:    Number.parseInt('12.3abc');    //结果:返回数值12

新特性:Number.parseFloat函数

parseFloat函数:解析一个字符串,并返回一个浮点数。跟parseInt一样,被移植到Number对象下,作用保持不变。

        //传统用法:    parseInt('12.3abc');    //结果:返回数值12

    //ES6用法:    Number.parseInt('12.3abc');    //结果:返回数值12

以上4个函数都是在window对象下,移植到了Number对象下,你可以能会跟我一样好奇:好端端地为什么好移植到其他地方去,这样做的目的是什么?

其实这么做的目的是慢慢地减少全局性的函数,把全局函数合理地规划到其他对象下,渐渐实现语言的模块化。

讲完了被移植的函数,咱们来学点新增的玩意。

新特性:Number.isInteger函数

Number.isInteger函数:用来判断是否是整数。

        Number.isInteger(3.2);    //结果:false

    Number.isInteger(3);    //结果:true

上面的运行结果也如我们所料,数值3.2不是整数,返回false。不过有一点要注意:在javascript内部对整数和浮点数采用一样的存储方式,因此小数点后如果都是0的浮点数,都会被认为是整数。看个例子就知道了:

    Number.isInteger(3.0);    //结果:true

    Number.isInteger(3.00);    //结果:true

数值3.0和3.00都会被认为是整数。

极小常量

Number.EPSILON常量:定义一个极小的数值。

我们把这个数值打印出来看一下:

    console.log(Number.EPSILON);    //结果:2.220446049250313e-16

2.220446049250313e-16是一个极小的数值,约等于0.00000000000000022204。干嘛要定义一个这样的数值,在什么情况下会用它呢?

Number.EPSILON的出现是用来判断浮点数的计算误差,如果浮点数计算得到的误差不超过Number.EPSILON的值,就表示可以接受这样的误差。

安全整数

ES6为我们引入了安全整数的概念。什么?整数还有安全和不安全的说法?原来JavaScript能够准确表示的整数范围在-2^53到2^53之间,超过这个范围,无法精确表示这个值。故称之为不安全。

为此,ES6定义了两个常量来表示这个范围的最大值和最小值:Number.MAX_SAFE_INTEGER和Number.MIN_SAFE_INTEGER。此外,如果给你一个数值,你不知道它是否超出了这个安全范围,你可以使用ES6给我们新增的一个函数Number.isSafeInteger来进行判断。看例子:

    Number.isSafeInteger(Number.MAX_SAFE_INTEGER);    //结果:true

    Number.isSafeInteger(Number.MAX_SAFE_INTEGER+1);    //结果:false

我们用最大安全整数Number.MAX_SAFE_INTEGER来做试验,第一行代码的结果返回的值是true,也就表示Number.MAX_SAFE_INTEGER属于安全范围,第二行代码,我们对Number.MAX_SAFE_INTEGER进行了+1,相加后的数值超过安全范围,isSafeInteger函数就返回了false,表示不在安全范围内。

ES6给数值带来的扩展,除了对Number对象进行了扩展,还对Math对象进行了扩展。对于Math对象大家应该不会感到陌生,我们平时用的求随机数的方法random就是属于Math对象下的方法。

有必要回顾一下:

        Math.random();    //结果:随机数0.8897368770341108

那么ES6给Math对象带来哪些扩展呢?

ES6给Math对象新增了17个函数,我们挑选几个常用的来讲解一下。

新特性:Math.trunc函数

Math.trunc函数:用于去除一个数的小数部分,返回整数部分。

    Math.trunc(3);    //结果:3

    Math.trunc(3.1);    //结果:3

运行结果也很好理解,如果传入的参数是整数,就直接返回整数,如果是小数,就去除了小数部分,返回整数部分:3。

新特性:Math.sign函数

Math.sign函数:用来判断一个数到底是正数、负数、还是零。

    Math.sign(3);    //结果:1

    Math.sign(-3);    //结果:-1

    Math.sign(0);    //结果:0

    Math.sign('abc');    //结果:NaN

返回的结果类型有点多,我们分别来讲解一下,参数如果是正数,结果返回1;如果是负数,结果返回-1;如果是0,结果返回0;如果是一个非数值类型的参数,结果返回:NaN。

新特性:Math.cbrt函数

Math.cbrt函数:用于计算一个数的立方根。

    Math.cbrt(8);    //结果:2

    Math.cbrt(27);    //结果:3

看以上代码,2的立方是8,那么8作为参数,开立方根得到的值就是2,3的立方是27,那么27求立方根就得到了3,这就是Math.cbrt函数的作用。

除了这三个函数以外,剩下的新增函数都是一些高中时期的数学方法,只不过是ES6将他们的运算封装成一个方法,方便大家使用,也算是开发者的福音。

它们分别是:

Math.acosh(x) 返回 x 的反双曲余弦。

Math.asinh(x) 返回 x 的反双曲正弦。

Math.atanh(x) 返回 x 的反双曲正切。

Math.clz32(x) 返回 x 的 32 位二进制整数表示形式的前导 0 的个数。

Math.sinh(x) 返回x的双曲正弦。

Math.cosh(x) 返回 x 的双曲余弦。

Math.expm1(x) 返回 eˆx - 1。

Math.fround(x) 返回 x 的单精度浮点数形式。

Math.hypot(...values) 返回所有参数的平方和的平方根。

Math.imul(x, y) 返回两个参数以 32 位整数形式相乘的结果。

Math.log1p(x) 返回 1 + x 的自然对数。

Math.log10(x) 返回以 10 为底的x的对数。

Math.log2(x) 返回以 2 为底的 x 的对数。

Math.tanh(x) 返回 x 的双曲正切。

这么多数学方法,估计很多人都会懵逼,根本记不住这么多,但是没关系,我们也不需要去死记硬背它们,我们只需要记住ES6为Math对象扩展了很多数学方法就可以了。等真正使用到的时候,我们再去查找资料就可以了。

本节总结

总结:ES6对Number对象新增了isInteger函数、极小常量Number.EPSILON、安全整数;还将window对象下的4个函数移植到了Number对象下;此外,对Math对象扩展了17个新函数。

第七节:ES6为数值做了哪些扩展?相关推荐

  1. 第八节:ES6为数组做了哪些扩展?

    广东的小伙伴大家还好吗,天气都热成狗了! 今天就不发预告了,直接推送图文. 前面讲了字符串和数值的扩展,今天要讲的是:数组的扩展.不知道大家能否跟得上这个节奏,你们在阅读中对讲解有存在疑惑,记得留言提 ...

  2. 第十节:ES6为函数做了哪些扩展?

    ES6一路扩展,字符串.数组.数值.对象无一"幸免",ES6说要雨露均沾,函数也不能落下,今天,就来讲解ES6对函数的扩展. 姿势准备好了吗?前方高能,第10节开讲...... 参 ...

  3. 第九节:ES6为对象做了哪些扩展?

    ES6不仅为字符串.数值和数组带来了扩展,也为对象带来了很多新特性.这一节,我们来一起学习一下对象的扩展. 对象的传统表示法 我们回顾一下,对象的传统表示法: let person = { " ...

  4. 【ES6】数值的拓展

    [ES6]数值的拓展 二.Number.isFinite(),Number.isNaN() 三.Number.parseInt(),Number.parseFloat() 四.Number.isInt ...

  5. 大白话5分钟带你走进人工智能-第七节梯度下降之梯度概念和梯度迭代过程(2)

    第七节梯度下降之梯度概念和梯度迭代过程(2) 上一节中针对一元函数,找到了一个看起来还不错的一种寻求数值上的最小值的这种方式.大致是这么一个流程,F(w)和F'(w),上来先瞎蒙出来一组w,然后带到这 ...

  6. 梯度下降的超参数大于等于2什么意思_大白话5分钟带你走进人工智能-第七节梯度概念和梯度迭代过程(2)...

    第七节梯度下降之梯度概念和梯度迭代过程(2) 上一节中针对一元函数,找到了一个看起来还不错的一种寻求数值上的最小值的这种方式.大致是这么一个流程,F(w)和F`(w),上来先瞎蒙出来一组w,然后带到这 ...

  7. 大白话5分钟带你走进人工智能-第七节梯度下降之梯度概念和梯度迭代过程(2)...

    第七节梯度下降之梯度概念和梯度迭代过程(2) 上一节中针对一元函数,找到了一个看起来还不错的一种寻求数值上的最小值的这种方式.大致是这么一个流程,F(w)和F`(w),上来先瞎蒙出来一组w,然后带到这 ...

  8. Vue.js实战之系统学习第七节

    想看上一节的请点击: Vue.js实战之系统学习第六节 接下来我们要学习第七节了,时间过的好快. 组件详解 组件是Vue.js的核心功能,也是整个框架设计最精彩的地方,当然也是最难掌握的.本章节将带你 ...

  9. Kotlin学习笔记 第二章 类与对象 第七节 数据类

    参考链接 Kotlin官方文档 https://kotlinlang.org/docs/home.html 中文网站 https://www.kotlincn.net/docs/reference/p ...

最新文章

  1. 关于excel导入到封装成工具类jar包和web版门店收银网络无法无法连接上的解决方法...
  2. spring(16)------spring的数据源配置
  3. 高端企业级存储IBM XIV访谈视频
  4. 数据结构整理中。。。
  5. python雪花算法生成id_理解分布式id生成算法SnowFlake
  6. 高端大气上档次的官网介绍导航页源码
  7. Effective Java (7) - 避免终止方法
  8. 002.操作系统的选择
  9. C++标准转换运算符:reinterpret_cast
  10. 【学习笔记】如何理解Raft中的ReadIndex?
  11. php apache mpm,Apache的三种MPM模式比较:prefork,worker,event
  12. usim卡如何换nano卡_5G超级SIM卡价格正式公布,iPhone用户彻底无缘
  13. autocad中的diesel语言详解
  14. 公有云上虚拟机故障恢复
  15. 原乐志老师语录及船长的习拳心得(二)
  16. 专业、简单、稳定,融云重新定义互联网通信云服务
  17. 两点确定一条直线,已知四个点确定的两条直线,求这两条直线的交点
  18. 软件测评|原来你与学霸的差距是它们?
  19. sys文件系统的创建和初始化过程
  20. 【电机/基础知识】电机介绍和数学模型

热门文章

  1. 产品经理需要向上思考
  2. 分别用函数和带参的宏,从三个数中找出最大的数。
  3. python连接mysql_Python 连接mysql与impala
  4. 【2015年第4期】大数据时代的数据挖掘 —— 从应用的角度看大数据挖掘(下)...
  5. rabbitmq rpc
  6. 高时空损耗的Scanner会卡爆程序(记洛谷P1567的Java性能优化,Java语言描述)
  7. 【Python】Python迭代求解开平方算法
  8. ctrl+shift+f被搜狗输入法占用的解决方法
  9. 【猜画小歌】辅助插件FunnyDraw江湖召集令
  10. CentOS6.x系统挂载NTFS分区的移动硬盘