扣丁学堂HTML5培训之es6数值的扩展方法

2019-03-11 15:02:52 1159浏览

今天扣丁学堂HTML5培训老师给大家分享一篇关于es6数值的扩展方法，文中通过示例代码介绍的非常详细，希望对大家的学习或者工作具有一定的参考学习价值，下面我们一起来看一下吧。

Number的方法扩展

Number.isFinite()方法检测有限的数值（有穷的数值）

console.log(Number.isFinite(1)) // true
console.log(Number.isFinite(3.1415926)) // true
console.log(Number.isFinite('1')) // false
console.log(Number.isFinite(NaN)) // false
console.log(Number.isFinite('1e')) // false
console.log(isFinite('1')) // true
console.log(isFinite('1e')) // false

上面前两个例子检测的都是数字，不管是浮点数还是正整数负数都是有穷的数值，而下面三个有两个则为字符串类型，这个方法是不会转换数字的所以为无穷的数值，当然NaN也是无穷的数值,咱们再看最后两个例子，是用的全局方法，字符串数字检测出来就是有穷的，而掺杂其他字符就是无穷的

console.log(Number.isNaN(1)) // false
console.log(Number.isNaN(3.1415926)) // false
console.log(Number.isNaN('1')) // false
console.log(Number.isNaN(NaN)) // true
console.log(Number.isNaN('1e')) // false

上面的例子咱们可以了解一下，这个方法就是检测值的NaN

Number.parseInt()隐士类型的转换

console.log(Number.parseInt(1)) // 1
console.log(Number.parseInt(3.1415926)) // 3
console.log(Number.parseInt(3.6415926)) // 3
console.log(Number.parseInt('1es5')) //1
console.log(Number.parseInt('asd123')) // NaN
console.log(Number.parseInt(NaN)) // NaN

上面的例子转换是可以将浮点数转换为正整数，不会有什么四舍五入，如果字符串中数字为开头，则直接转换提取出数字如果不是的话则为NaN

Number.parseFloat()类型的转换会保留浮点数

console.log(Number.parseFloat(1)) // 1
console.log(Number.parseFloat(3.1415926)) // 3.1415926
console.log(Number.parseFloat('1es5#')) // 1
console.log(Number.parseFloat('#asd123')) //NaN
console.log(Number.parseFloat(NaN)) // NaN

上面的写了几个简单的例子，parseFloat和parseInt的区别就是保留浮点数

Number.isInteger()检测一个值是否为整数

console.log(Number.isInteger(1)) // true
console.log(Number.isInteger(3.1415926)) // false
console.log(Number.isInteger('123')) // false
console.log(typeof (Math.trunc('1.23'))) // number
console.log(Number.isInteger('1.23')) // false
console.log(Number.isInteger(null)) // false
console.log(Number.isInteger(3.0000000000000002)) // true
console.log(Number.parseFloat(Array)) // NaN

上面的例子如果为整数则为true否则为false，它不会将字符串类型进行隐士转换，如果它检测的值小于JavaScript能够分辨最小的值会出现误判，对于二进制的位数也是有现在要求的不然也会出现误判

Math对象的扩展

Math.trunc()去除浮点数的小数部分，返回整数也就相当于转换把，但是没有四舍五入

console.log(Math.trunc(1.8)) // 1
console.log(Math.trunc(3.1415926)) // 3
console.log(Math.trunc('3.1415926')) // 3
console.log(Math.trunc('1.23')) // 1
console.log(Math.trunc('1.23#')) // NaN
console.log(Math.trunc('#1.23')) // NaN
console.log(Math.trunc()) // NaN
console.log(Math.trunc(-0.25)) // -0

上面举例了几个新增的Math对象的方法，我们可以看出，它是可以字符串数字转化出来数字，我们通过对它的类型检测也是得到了number类型，如果数字字符中包含其它字符或是空则表示为NaN

Math.sign()用来判断一个数到底是正数、负数、还是零。对于非数值，会先将其转换为数值

console.log(Math.sign(1.8))
console.log(Math.sign(3.1415926))
console.log(Math.sign('3.1415926'))
console.log(Math.sign('1.23#'))
console.log(Math.sign('#1.23'))
console.log(Math.sign(-0))
console.log(Math.sign(-2))

上面的例子你可能会疑惑，为什么检测整数和负数的时候都为1||-1，是因为正数除了0之外都是1，负数除了-0都是-1表示，它也会先执行number的转换字符串数字，如果带有其它符号无法转换的则为NaN

Math.cbrt()计算立方根

console.log(Math.cbrt(4)) // 1.5874010519681996
console.log(Math.cbrt('4')) // 1.5874010519681996
console.log(Math.cbrt('2q')) // NaN
console.log(Math.cbrt('q2')) // NaN
console.log(Math.cbrt('16')) // 2.5198420997897464

上面几个例子也体现除了math新增的方法，它也是先进行number的转换，然后再就进行计算，如果不是纯数字的字符串类型会转换失败得出NaN

Math.hypot()返回参数内平方的和，可以任意多个参数

console.log(Math.hypot(4, 4)) // 5.656854249492381
console.log(Math.hypot('4', 4, 3)) // 6.4031242374328485
console.log(Math.hypot('2q', 4)) // NaN
console.log(Math.hypot('q2', 4)) // NaN
console.log(Math.hypot('16', 4)) // 16.492422502470642

上面的方法也会先进行数值的转换，有一个参数无法转换就会返回NaN

对数方法

Math.log1p()返回1+参数的自然数，如果小于-1就返回NaN

console.log(Math.log1p(1)) // 0.6931471805599453    也相当于0
console.log(Math.log1p(-1)) //-Infinity
console.log(Math.log1p(-2)) // NaN
console.log(Math.log1p('-1')) // -Infinity
console.log(Math.log1p('-2q')) // NaN

Math.log10()返回以10为底x的对数，小于0返回NaN

console.log(Math.log10(10)) // 1
console.log(Math.log10(5)) // 0.6989700043360189
console.log(Math.log10(20)) // 1.3010299956639813
console.log(Math.log10(2000)) // 3.3010299956639813

Math.log2()返回以2为底x的对数，小于0返回NaN

console.log(Math.log10(10)) // 3.321928094887362
console.log(Math.log10(5)) // 2.321928094887362
console.log(Math.log10(20)) // 4.321928094887363
console.log(Math.log10(2000)) // 10.965784284662087
console.log(Math.log2('2000')) // 10.965784284662087

上面的这个方法也是先进行数值的转换，在进行计算

总结：基本上数值的扩展都是针对数字类型的一些新方法的使用，一般的是存在比较复杂的公式，所以我们可以按照方法得出的结果可以去查找规律从而可以使用它，可以多了解了解

以上就是关于扣丁学堂HTML5培训之es6数值的扩展方法的全部内容，希望对大家的学习有所帮助，想要了解更多关于HTML5开发方面内容的小伙伴，请关注扣丁学堂HTML5培训官网、微信等平台，扣丁学堂IT职业在线学习教育平台为您提供权威的HTML5视频教程供学员学习，HTML5培训后的前景无限，行业薪资和未来的发展会越来越好的，扣丁学堂老师精心推出的HTML5视频直播课定能让你快速掌握HTML5从入门到精通开发实战技能。扣丁学堂H5技术交流群：673883249。

【关注微信公众号获取更多学习资料】

查看更多关于“HTML5开发技术资讯”的相关文章>>