本文翻译自:https://www.sitepoint.com/es6...

转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。


本文介绍了ES6中全新的数字方法(ECMAScript 6)。

本文将向您介绍添加Number数据类型的新方法和常量。当然,这里采用的方法并不完全是全新的,但它们已经可以在 and/or 直接移动(例如isNaN())。我们会通过一些例子进行实践。

Number.isInteger()

我要介绍的第一种方法是Number.isInteger()。它是JavaScript的新增功能,您之前可能已经定义和使用过这个方法。它确定传递给函数的值是否为整数。如果函数值是true,则返回此方法,false则跳出。这种方法的实现非常简单,并且是原生JavaScript语法。重写此功能的方法之一是:

    Number.isInteger = Number.isInteger || function (number) {
return typeof number === 'number' && number % 1 === 0;
};

仅仅为了好玩,我重新改写了这个功能,采用了完全不同的方法:

    Number.isInteger = Number.isInteger || function (number) {
return typeof number === 'number' && Math.floor(number) === number;
};

虽然以上两个方法均能判断传参是否为整数,但它们不符合ECMAScript 6规范。所以,如果你想要严格按照ES6的规范改写,就请从以下语法开始:

    Number.isInteger(number)

该参数number表示要测试的值。

使用此方法的示例如下所示:

    // prints 'true'
console.log(Number.isInteger(19)); // prints 'false'
console.log(Number.isInteger(3.5)); // prints 'false'
console.log(Number.isInteger([1, 2, 3]));

Node.js和所有现代浏览器都支持该方法,Internet Explorer除外。如果您需要支持旧版浏览器,则可以使用polyfill,例如火狐浏览器Mozilla Developer Network上提供的polyfill 。请看下面的代码:

    if (!Number.isInteger) {
Number.isInteger = function isInteger (nVal) {
return typeof nVal === 'number' &&
isFinite(nVal) &&
nVal > -9007199254740992 &&
nVal < 9007199254740992 &&
Math.floor(nVal) === nVal;
};
}

Number.isNaN()

如果您以前编写过JavaScript代码,则此方法对您来说并不陌生。JavaScript有一个叫做isNaN()的方法通过window对象公开。此方法用以判断测试值是否等于NaN,是返回true,否则返回false。不过直接调用window.isNaN()有一个问题,当测试值被强制转换为数字时,该方法会返回true值。为了让您对此问题有一个具体的了解,以下所有语句都会返回:true

    // prints 'true'
console.log(window.isNaN(0/0)); // prints 'true'
console.log(window.isNaN('test')); // prints 'true'
console.log(window.isNaN(undefined)); // prints 'true'
console.log(window.isNaN({prop: 'value'}));

您可能需要的是仅在传递值为NaN时返回true的方法。这就是ECMAScript 6引入Number.isNaN()的原因。它的语法如下:

    Number.isNaN(value)
这value是您要测试的值。此方法的一些示例用法如下所示: // prints 'true'
console.log(Number.isNaN(0/0)); // prints 'true'
console.log(Number.isNaN(NaN)); // prints 'false'
console.log(Number.isNaN(undefined)); // prints 'false'
console.log(Number.isNaN({prop: 'value'}));

如您所见,测试相同的值我们获得了不同的结果。

Node和所有现代浏览器都支持该方法,Internet Explorer除外。如果您想支持其他浏览器,则此方法的一个非常简单的polyfill如下:

    Number.isNaN = Number.isNaN || function (value) {
return value !== value;
};

NaN是JavaScript中唯一的非自身值,这意味着它是唯一不等于自身的值。

Number.isFinite()

此方法与前一个方法具有相同的背景。在JavaScript中,有这么一个方法window.isFinite(),用于测试传递的值是否为有限数。不幸的是,它也会返回被强制转换为数字的true值,示例如下所示:

    // prints 'true'
console.log(window.isFinite(10)); // prints 'true'
console.log(window.isFinite(Number.MAX_VALUE)); // prints 'true'
console.log(window.isFinite(null)); // prints 'true'
console.log(window.isFinite([]));

出于这个原因,在ECMAScript 6中有一个名为isFinite()的方法。其语法如下:

    Number.isFinite(value)

value是您要测试的值。如果您测试上一个代码段中的相同值,则可以看到结果不同:


// prints 'true'
console.log(Number.isFinite(10)); // prints 'true'
console.log(Number.isFinite(Number.MAX_VALUE)); // prints 'false'
console.log(Number.isFinite(null)); // prints 'false'
console.log(Number.isFinite([]));

Node和所有现代浏览器都支持该方法,Internet Explorer除外。您可以在MDN上的方法页面上找到它的polyfill。

Number.isSafeInteger()

Number.isSafeInteger()是ES6的全新补充。它测试传递的值是否是一个安全整数,在这种情况下它返回true。安全整数定义为满足以下两个条件的整数:

  • 该数字可以精确地表示为IEEE-754双精度数
  • 数字的IEEE-754表示不能是舍入任何其他整数以适合IEEE-754表示的结果。

根据这个定义,安全整数是从 - (2的53次方 - 1)包含到2的53次方 - 1包含的所有整数。

    

    Number.isSafeInteger(value)
这value是您要测试的值。此方法的一些示例用法如下所示: // prints 'true'
console.log(Number.isSafeInteger(5)); // prints 'false'
console.log(Number.isSafeInteger('19')); // prints 'false'
console.log(Number.isSafeInteger(Math.pow(2, 53))); // prints 'true'
console.log(Number.isSafeInteger(Math.pow(2, 53) - 1));

Number.isSafeInteger()在所有现代浏览器都支持,Internet Explorer除外。这种方法的polyfill是由Paul Miller从es6-shim中提取的,如:


Number.isSafeInteger = Number.isSafeInteger || function (value) {
return Number.isInteger(value) && Math.abs(value) <= Number.MAX_SAFE_INTEGER;
};

请注意,此polyfill依赖于Number.isInteger()之前讨论的方法,因此您需要对后者进行polyfill以使用此方法。

ECMAScript 6还引入了两个相关的常量值:Number.MAX_SAFE_INTEGERNumber.MIN_SAFE_INTEGER。前者表示JavaScript中的最大安全整数,即2的53次方 - 1,而后者表示最小安全整数,即 - (2的53次方 - 1)。

Number.parseInt()和Number.parseFloat()

Number.parseInt()和Number.parseFloat()方法都属于同一个部分,因为不像在这篇文章中提到的其他类似的方法,他们已经在以前版本的ECMAScript中存在。因此,您可以用与目前相同的方式使用它们,并获得相同的结果。语法如下:


// Signature of Number.parseInt
Number.parseInt(string, radix) // Signature of Number.parseFloat
Number.parseFloat(string)

这里的string表示要解析的值,radix是您要用于转换的基数string。

以下代码段显示了示例用法:

    // Prints '-3'
console.log(Number.parseInt('-3')); // Prints '4'
console.log(Number.parseInt('100', 2)); // Prints 'NaN'
console.log(Number.parseInt('test')); // Prints 'NaN'
console.log(Number.parseInt({})); // Prints '42.1'
console.log(Number.parseFloat('42.1')); // Prints 'NaN'
console.log(Number.parseFloat('test')); // Prints 'NaN'
console.log(Number.parseFloat({}));

Node和所有现代浏览器都支持这些方法,Internet Explorer除外。如果您想要使用它们,您可以简单地调用它们的全局方法,如下所示:

    // Polyfill Number.parseInt
Number.parseInt = Number.parseInt || function () {
return window.parseInt.apply(window, arguments);
}; // Polyfill Number.parseFloat
Number.parseFloat = Number.parseFloat || function () {
return window.parseFloat.apply(window, arguments);
};

结束

在本教程中,我们介绍了ECMAScript 6中添加的与Number数据类型一起使用的新方法和常量。值得注意的是,ES6还增加了另一个我目前尚未提及的常量,Number.EPSILON,表示最大公约数。


本文是由葡萄城技术开发团队发布,转载请注明出处:葡萄城官网

了解更多

点击这里,了解全面支持 Angular、React 和 Vue -- WijmoJS纯前端控件集

点击这里,了解可嵌入您系统的在线 Excel -- SpreadJS纯前端表格控件

ES6实战:新数字方法的更多相关文章

  1. 看es6 字符串新方法有感

    'x'.repeat(3) // "xxx" 'hello'.repeat(2) // "hellohello" 'na'.repeat(0) // " ...

  2. 漫谈数组去重复方法(亮点是ES6的新API)

    方法1: 利用遍历的思想来进行. <!DOCTYPE html><html lang="en"><head> <meta charset= ...

  3. JavaScript ES6 数组新方法 学习随笔

    JavaScript ES6 数组新方法 学习随笔 新建数组 var arr = [1, 2, 2, 3, 4] includes 方法 includes 查找数组有无该参数 有返回true var ...

  4. ES6的新方法实现数组去重

    ES6里新添加了两个很好用的东西,set和Array.from. set是一种新的数据结构,它可以接收一个数组或者是类数组对象,自动去重其中的重复项目. 在这我们可以看见,重复的项目已经被去掉了,包括 ...

  5. ES6 实战项目构建 ES6+glup+express

    ES6推出已经有几个年头了,平时也有学过一些基本语法,无奈实践经验太少.而且前端早已脱离了刀耕火种的时代,一些自动化构建工具像gulp.webpack等也需要熟练掌握.最近刚签了三方,闲暇之余就找了个 ...

  6. es6字符串新特性

    转: 字符串的扩展 修改教程 上一节 : 变量的解构赋值 下一节 : 正则的扩展 字符串的扩展 ES6 加强了对 Unicode 的支持,并且扩展了字符串对象. 字符的 Unicode 表示法 Jav ...

  7. ES6 javascript 实用开发方法技巧分享

    定义变量/常量 ES6 中新增加了 let 和 const 两个命令,let 用于定义变量,const 用于定义常量 两个命令与原有的 var 命令所不同的地方在于,let, const 都是块级作用 ...

  8. es6的新内容

    前端学习总结(十八)ES6--新一代的javascript 发表于2016/6/11 21:44:27  2733人阅读 分类: javascript 简介 ECMAScript 6(以下简称ES6) ...

  9. javascript插入before(),after()新DOM方法

    随着web的技术突飞猛进的发展.HTML5 ES6等新技术的发展,与此同时DOM等标准也在悄悄的进步,各大浏览器也在悄悄的发展适配新的属性和方法,今天我们来看看Javascript新的DOM的方法 二 ...

随机推荐

  1. 实战:Spring AOP实现多数据源动态切换

    需求背景 去年底,公司项目有一个需求中有个接口需要用到平台.算法.大数据等三个不同数据库的数据进行计算.组装以及最后的展示,当时这个需求是另一个老同事在做,我只是负责自己的部分. 直到今年回来了,这个 ...

  2. laravel 框架登录 实际操作

    //登录中间件 Route::group(['middleware'=>'checkage'],function (){ Route::get('/mou/list','MouControlle ...

  3. .Net Core(.NET6)中接入Log4net和NLog进行日志记录

    一.接入Log4net 1.按日期和大小混合分割日志 nuget包安装 log4net Microsoft.Extensions.Logging.Log4Net.AspNetCore 配置文件 配置文 ...

  4. CentOS8时间同步

    CentOS8中默认已经不再支持ntpd软件包,同时也无法通过官方软件仓库安装, CentOS8上使用Chrony配置NTP服务器,用于同步时间. 它有两个程序,chrony和chronyd, chr ...

  5. LGP6788题解

    太慢了!太慢了!我的替身 [The World] 是最强的替身! \(O(n^{\frac 2 3})\) 的解法!不清楚用 sbt 能不能更快一些,可能会吧.灵感来源于BZOJ4176,同时也可看到 ...

  6. hadoop-SSH免密登录配置

    一:配置基础环境 一.修改主机名 修改 master 机器主机名 [root@server ~]# hostnamectl set-hostname master-wzg [root@server ~ ...

  7. .NET MAUI 已在塔架就位 ,4月份RC

    最美人间三月天,春光不负赶路人.在充满无限希望的明媚春天里,一路风雨兼程的.NET 团队正奋力实现新的突破. 根据计划,新一代移动开发平台MAUI 将于4月份 发布RC. 目前,MAUI的测试工作和火 ...

  8. docker是干什么的,docker常用命令

    镜像下载.域名解析.时间同步请点击 阿里云开源镜像站 一.百度百科 Docker是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖到一个可移植的镜像中,然后发布到任何流行的Linux或Win ...

  9. 6月12日 python学习总结 框架

    1. 登录功能的实现 1. form表单提交数据的注意事项: 1. 是form不是from,必须要有method和action 2. 所有获取用户输入的表单标签要放在form表单里面,表单标签必须要有 ...

  10. Java单例模式示范

    package com.ricoh.rapp.ezcx.iwbservice.util; import java.util.ArrayList; import java.util.List; impo ...