zoukankan      html  css  js  c++  java
  • ES6实战:新数字方法

    本文翻译自: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纯前端表格控件

  • 相关阅读:
    如何实现一个串行promise
    单机,分布式和集群的区别
    ERP & CRM
    CDN working principle diagram
    公众平台服务号、订阅号、企业号的相关说明
    DMZ的原理与应用
    ICP备案接入商
    DMZ主机
    浅析localstorage、sessionstorage
    Repeater+AspNetPager+Ajax留言板
  • 原文地址:https://www.cnblogs.com/10manongit/p/12769865.html
Copyright © 2011-2022 走看看