前言

Number和Math都属于JavaScript中的内置对象,Number数字类型作为基础数据类型,我们在开发过程中会经常用到,包括数字精度的格式化,还有字符串转换成数字等操作。

Number数字

自带属性值


Number.EPSILON 两个可表示(representable)数之间的最小间隔。 Number.MAX_SAFE_INTEGER JavaScript 中最大的安全整数 (2^53 - 1)。 Number.MAX_VALUE 能表示的最大正数。最小的负数是 -MAX_VALUE。 Number.MIN_SAFE_INTEGER JavaScript 中最小的安全整数 (-(2^53 - 1)). Number.MIN_VALUE 能表示的最小正数即最接近 0 的正数 (实际上不会变成 0)。最大的负数是 -MIN_VALUE。 Number.NaN 特殊的“非数字”值。 Number.NEGATIVE_INFINITY 特殊的负无穷大值,在溢出时返回该值。 Number.POSITIVE_INFINITY 特殊的正无穷大值,在溢出时返回该值。

基础使用

new Number实例化数字对象和Number强转数字字符串,两个值的并不相等

var value1 = new Number("123");
this.value1 = value1;
console.log(`value1 === 123 is ${value1 === 123}`); // value1 === 123 is false var value2 = Number("123");
this.value2 = value2;
console.log(`value2 === 123 is ${value2 === 123}`); // value2 === 123 is true // 判断Number类型
console.log(value1 instanceof Number);
console.log(value2 instanceof Number);
Number将转换字符串为数字

Number("123"); // 123
Number("12.3"); // 12.3
Number("12.00"); // 12
Number("123e-1"); // 12.3
Number(""); // 0
Number(null); // 0
Number("0x11"); // 17
Number("0b11"); // 3
Number("0o11"); // 9
Number("foo"); // NaN
Number("100a"); // NaN
Number("-Infinity"); //-Infinity
Number判断数字是否是NAN

let number1 = new Number("123");
let number2 = 123;
let number3 = "string";
let number4 = null;
console.log(Number.isNaN(number1)); // false
console.log(Number.isNaN(number2)); // false
console.log(Number.isNaN(number3)); // false
console.log(Number.isNaN(number4)); // false
console.log(Number.isNaN(NaN)); // true
Number.isFinite 是否是一个有穷数
console.log(Number.isFinite(1 / 0));
// false
console.log(Number.isFinite(10 / 5));
// true
console.log(Number.isFinite(0 / 0));
// false
Number.isInteger 判断给定的参数是否为整数

function checkInteger(x, y) {
if (Number.isInteger(y / x)) {
return "整数";
}
return "非整数";
}
console.log(checkInteger(5, 10));
// "整数"
console.log(checkInteger(5, 11));
// "非整数"
Number.isSafeInteger 判断传入的参数值是否是一个“安全整数”(safe integer)

备注:

Number.isSafeInteger() 方法用来判断传入的参数值是否是一个“安全整数”(safe integer)。

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

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

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

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

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

Number.isSafeInteger(3); // true
Number.isSafeInteger(Math.pow(2, 53)); // false
Number.isSafeInteger(Math.pow(2, 53) - 1); // true
Number.isSafeInteger(NaN); // false
Number.isSafeInteger(Infinity); // false
Number.isSafeInteger("3"); // false
Number.isSafeInteger(3.1); // false
Number.isSafeInteger(3.0); // true
Number.parseFloat 将字符串数字转成数字类型

备注:

  • 方法可以把一个字符串解析成浮点数。该方法与全局的 parseFloat() 函数相同,并且处于 ECMAScript 6 规范中(用于全局变量的模块化)。
  • 给定值被解析成浮点数,如果无法被解析成浮点数,则返回NaN

function checkFloat(r) {
return parseFloat(r);
}
console.log(checkFloat(4.567));
// 4.567
console.log(checkFloat("4.567abcdefgh"));
// 4.567
console.log(checkFloat("abcdefgh"));
// NaN
Number.parseInt 将数字字符串转成整数
/**
*
* Number.parseInt()
* 方法依据指定基数 [ 参数 radix 的值],把字符串 [ 参数 string 的值] 解析成整数。
* @params string:要解析的值。 如果此参数不是字符串,则使用ToString抽象操作将其转换为字符串。忽略此参数中的前导空格。
* @params radix:一个介于2到36之间的整数,代表字符串的基数(数学数字系统中的基)。小心-这并不是默认为10。
* 从给定字符串中解析的整数。如果基数小于11,且第一个非空白字符不能转换为数字,则返回NaN。
*
* */ function checkInt(x, base) {
const parsed = parseInt(x, base);
if (isNaN(parsed)) {
return 0;
}
return parsed * 100;
}
console.log(checkInt(" 0xF", 16));
// 1500
console.log(checkInt("321", 2));
// 0
Number.prototype.toFixed() 把数字转换为字符串,返回小数点后有指定位数的数字

var numObj = 5.123456;
var n = numObj.toFixed(2); // 5.12
Number.prototype.toPrecision() 以指定的精度返回该数值对象的字符串表示

var numObj = 5.123456;
console.log("numObj.toPrecision() is " + numObj.toPrecision()); // 输出 5.123456
console.log("numObj.toPrecision(5) is " + numObj.toPrecision(5)); // 输出 5.1235
console.log("numObj.toPrecision(2) is " + numObj.toPrecision(2)); // 输出 5.1
console.log("numObj.toPrecision(1) is " + numObj.toPrecision(1)); // 输出 5
// 注意:在某些情况下会以指数表示法返回
console.log((1234.5).toPrecision(2)); // "1.2e+3"
Number 转换 Date 对象

var d = new Date("December 17, 1995 03:24:00");
console.log(Number(d));

结尾

在Number数字类型中,使用最多的应该是:

  • isNaN判断数字是否是非数字NAN
  • parseFloat将数字字符串转成数字类型
  • parseInt 解析字符串转成整数
  • toPrecision作为数字的方法,返回该数值的指定精度,包含小数位
  • toFixed 返回指定小数点精度的数字,需要注意和toPrecision区分开来

源码地址

文章个人博客地址:javaScript中Number数字类型基本方法入门

欢迎关注公众号:程序猿布欧,不定期更新一些前端入门文章

创作不易,转载请注明出处和作者。

javaScript中Number数字类型方法入门的更多相关文章

  1. JavaScript中判断对象类型方法大全1

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...

  2. javascript类型系统——Number数字类型

    × 目录 [1]定义 [2]整数 [3]浮点数[4]科学记数[5]数值精度[6]数值范围[7]特殊数值[8]转成数值[9]实例方法 前面的话 javascript只有一个数字类型,它在内部被表示为64 ...

  3. JavaScript中判断对象类型方法大全2

    在JavaScript中,有5种基本数据类型和1种复杂数据类型,基本数据类型有:Undefined, Null, Boolean, Number和String:复杂数据类型是Object,Object ...

  4. JavaScript中Number数字数值浮点运算有误差

    JavaScript浮点运算的一个bug. 比如:7*0.8 JavaScript算出来就是:5.6000000000000005 //调用:numberExcept(arg1,arg2) //返回值 ...

  5. JavaScript中判断变量类型最简洁的实现方法以及自动类型转换(#################################)

    这篇文章主要介绍了JavaScript中判断整字类型最简洁的实现方法,本文给出多个判断整数的方法,最后总结出一个最短.最简洁的实现方法,需要的朋友可以参考下 我们知道JavaScript提供了type ...

  6. JavaScript中判断对象类型的种种方法

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...

  7. 转 JavaScript中判断对象类型的种种方法

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...

  8. JavaScript中Number常用属性和方法

    title: JavaScript中Number常用属性和方法 toc: false date: 2018-10-13 12:31:42 Number.MAX_VALUE--1.79769313486 ...

  9. JavaScript中两种类型的全局对象/函数【转】

    Snandy Stop, thinking is the essence of progress. JavaScript中两种类型的全局对象/函数 这里所说的JavaScript指浏览器环境中的包括宿 ...

随机推荐

  1. 请写出你最常见到的5个runtime exception?

    对于一个有1-2年左右编程经验的人来说,总会经常遇到一些常见的异常,其中有些就是Runtime Exception.比如: NullPointerException - 当调用一个未初始化的引用变量( ...

  2. jQuery--表单的过滤

    1.表单过滤器的介绍 :input 所有表单元素(<input>/<select>/<textarea>/<button>) :text 文本框< ...

  3. Ls 命令执行什么功能? 可以带哪些参数,有什么区别?

    ls 执行的功能: 列出指定目录中的目录,以及文件哪些参数以及区别: a 所有文件 l 详细信息,包括大小字节数,可读可写可执行的权限等

  4. 线程的 sleep()方法和 yield()方法有什么区别?

    ① sleep()方法给其他线程运行机会时不考虑线程的优先级,因此会给低优先级的线程以运行的机会:yield()方法只会给相同优先级或更高优先级的线程以运行的机会: ② 线程执行 sleep()方法后 ...

  5. ThreadLocal是什么?使用场景有哪些?

    什么是ThreadLocal? ThreadLocal为每个使用该变量的线程提供独立的变量副本,所以每一个线程都可以独立地改变自己的副本,而不会影响其它线程所对应的副本. 测试代码: package ...

  6. 《手把手教你》系列基础篇(八十四)-java+ selenium自动化测试-框架设计基础-TestNG日志-上篇(详解教程)

    1.简介 TestNG还为我们提供了测试的记录功能-日志.例如,在运行测试用例期间,用户希望在控制台中记录一些信息.信息可以是任何细节取决于目的.牢记我们正在使用Selenium进行测试,我们需要有助 ...

  7. Markdown语法2

    二 . 低频使用的语法 下面是相对用得少的markdown语法,但也值得学习学习. 10.区块(块引用) 要创建块引用,请在段落前添加一个 >  符号: 块引用支持多段落: 块引用支持嵌套,即引 ...

  8. Python的数据基础库Numpy怎样对数组进行排序

    Numpy怎样对数组排序 Numpy给数组排序的三个方法: numpy.sort:返回排序后数组的拷贝 array.sort:原地排序数组而不是返回拷贝 numpy.argsort:间接排序,返回的是 ...

  9. 什么是jsp?jsp的内置对象有哪些?

    这里是修真院前端小课堂,每篇分享文从 [背景介绍][知识剖析][常见问题][解决方案][编码实战][扩展思考][更多讨论][参考文献] 八个方面深度解析前端知识/技能,本篇分享的是: [什么是jsp? ...

  10. canvas 1px 出现模糊解决方法及原理

    关于canvas绘制1像素出现模糊的原因及解决方法 canvas是html5中非常强大的功能,但是在绘制的时候如果出现1像素,例如画一条1像素的线可能出现模糊情况. 一.解决方法 网上比较常见的解决方 ...