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_INTEGER和Number.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实战:新数字方法的更多相关文章
- 看es6 字符串新方法有感
'x'.repeat(3) // "xxx" 'hello'.repeat(2) // "hellohello" 'na'.repeat(0) // " ...
- 漫谈数组去重复方法(亮点是ES6的新API)
方法1: 利用遍历的思想来进行. <!DOCTYPE html><html lang="en"><head> <meta charset= ...
- JavaScript ES6 数组新方法 学习随笔
JavaScript ES6 数组新方法 学习随笔 新建数组 var arr = [1, 2, 2, 3, 4] includes 方法 includes 查找数组有无该参数 有返回true var ...
- ES6的新方法实现数组去重
ES6里新添加了两个很好用的东西,set和Array.from. set是一种新的数据结构,它可以接收一个数组或者是类数组对象,自动去重其中的重复项目. 在这我们可以看见,重复的项目已经被去掉了,包括 ...
- ES6 实战项目构建 ES6+glup+express
ES6推出已经有几个年头了,平时也有学过一些基本语法,无奈实践经验太少.而且前端早已脱离了刀耕火种的时代,一些自动化构建工具像gulp.webpack等也需要熟练掌握.最近刚签了三方,闲暇之余就找了个 ...
- es6字符串新特性
转: 字符串的扩展 修改教程 上一节 : 变量的解构赋值 下一节 : 正则的扩展 字符串的扩展 ES6 加强了对 Unicode 的支持,并且扩展了字符串对象. 字符的 Unicode 表示法 Jav ...
- ES6 javascript 实用开发方法技巧分享
定义变量/常量 ES6 中新增加了 let 和 const 两个命令,let 用于定义变量,const 用于定义常量 两个命令与原有的 var 命令所不同的地方在于,let, const 都是块级作用 ...
- es6的新内容
前端学习总结(十八)ES6--新一代的javascript 发表于2016/6/11 21:44:27 2733人阅读 分类: javascript 简介 ECMAScript 6(以下简称ES6) ...
- javascript插入before(),after()新DOM方法
随着web的技术突飞猛进的发展.HTML5 ES6等新技术的发展,与此同时DOM等标准也在悄悄的进步,各大浏览器也在悄悄的发展适配新的属性和方法,今天我们来看看Javascript新的DOM的方法 二 ...
随机推荐
- think php 多条件检索+自带分页+多条件搜索标红分页
//视图<form action="/homework/homework/index" method="get"> <input type=& ...
- 4.功能三:实现URL地址栏控制(15分) (1)获取到当前访问的控制器和方法(5分) (2)对当前访问的控制器和方法进行判断,有权限继续访问(5分) (3)无权限给出提示(5分)
<?php namespace app\admin\controller; use think\Controller; use think\Request; class Base extends ...
- Java学习笔记:04面向对象-内部类_访问修饰符_final
04面向对象-内部类/访问修饰符/final 1.static的介绍 static:关键字,静态的 static的作用是用来修饰类中的成员 2.访问一个类中的某一个成员变量 方法一: _1.创建对象 ...
- Docker——镜像讲解
镜像是什么 镜像是一种轻量级,可执行的独立软件包,用来打包软件运行环境和基于运行环境开发的软件,它包含运行某个软件所需的所有内容,包括代码.运行时.库.环境变量和配置文件. 所有的应用,直接打包doc ...
- Fiddler——抓取https接口配置(web,安卓,ios)
作为一名合格的测试怎么能不会抓包呢. 抓包适用场景: 测试某个功能时,出现了bug,这时我们便需要抓包看一下这个bug到底是前端的还是服务端的: bug的精准指向,能加速bug得以解决. ...
- 后门及持久化访问4----Com组件劫持
代码及原理介绍 COM是Component Object Model(组件对象模型)的缩写,COM组件由DLL和EXE形式发布的可执行代码所组成.每个COM组件都有一个CLSID,这个CLSID是注册 ...
- tensorflow2.4与目标检测API在3060显卡上的配置安装
目前,由于3060显卡驱动版本默认>11.0,因此,其不能使用tensorflow1版本的任何接口,所以学习在tf2版本下的目标检测驱动是很有必要的,此配置过程同样适用于任何30系显卡配置tf2 ...
- EVM
靶机设置 将靶机导入VirtualBox中,有时候导入VM会出错,扫描不到ip地址. kali:192.168.1.100 kali扫描获得ip地址:192.168.1.107 渗透测试 接着扫描端口 ...
- 程序流程控制2 for循环
for循环是python中的一个通用的序列迭代器,可以遍历序列对象中的所有对象. 1.for循环基本格式 for循环基本格式如下. for var in object: 循环体语句块 else: 语句 ...
- Rust极简教程
目录 简介 特性 特征 用途 安装 核心组件 常用命令 基础语法 数据类型 标量类型 复合类型 示例 条件语句 循环 输出&输入 输出 输出花括号 输出非基础类型 输入 所有权 切片 结构体 ...