ES6 数据拓展Number,对象方法,三种模块化应用,npm包导入和转换
Posted IT_Holmes
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ES6 数据拓展Number,对象方法,三种模块化应用,npm包导入和转换相关的知识,希望对你有一定的参考价值。
1.ES6 数据拓展
1.1 Number.EPSILON
这个Number.EPSILON,是衡量数据的关键。
可以打印一下看看它的数值。
<script>
console.log(Number.EPSILON);
</script>
例如:
0.1 + 0.2 === 0.3,如果只是单纯的看等式,这个是正确的,但是计算机计算是有很微小的误差!如下:
<script>
console.log("0.1加0.2是否等于0.3");
console.log(0.1+0.2 === 0.3);//这里却出现了false
console.log(0.1+0.2);//可以看到这里是0.30000000000000004
</script>
因此可以用Number.EPSILON,来衡量。 Number.EPSILON 是javascript表示的最小精度。 如果0.3减去0.1加0.2的值小于Number.EPSILON,就算他们是相等的。
实例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
console.log("0.1加0.2是否等于0.3");
console.log(0.1+0.2 === 0.3);//这里却出现了false
console.log(0.1+0.2);//可以看到这里是0.30000000000000004
function equal(a,b){
if(Math.abs(a-b)<Number.EPSILON)
return true;
else
return false;
}
console.log(equal(0.1+0.2,0.3));
</script>
</body>
</html>
1.2 二进制,八进制,十进制,十六进制
用进制表示:二进制0b,八进制0o,十进制, 十六进制0x。
<script>
let b = 0b1010; //二进制0b
console.log(b);
let o = 0o777; //八进制0o
console.log(o);
let d = 100; //十进制
console.log(d)
let x = 0xff; //十六进制0x
console.log(x);
</script>
1.3 Number.isFinite
它的功能就是检测一个数值是否为有限数。
<script>
console.log(Number.isFinite(100));
console.log(Number.isFinite(100/0));
console.log(Number.isFinite(Infinity));
</script>
1.4 Number.isNaN
检测一个数值是否是NaN的。
<script>
console.log(Number.isNaN(123));
</script>
1.5 Number.parseInt 和 Number.parseFloat
将字符串转为整数。
<script>
console.log(Number.parseInt('123253aaakkbl'));
console.log(Number.parseFloat('3453.45sdfsc'));
</script>
1.6 Number.isInteger
判断一个数是否为整数。
<script>
console.log(Number.isInteger(555));
console.log(Number.isInteger(6.222));
</script>
1.7 Math.trunc
将数字的小数部分抹掉。
<script>
console.log(Math.trunc(2.55555));
</script>
1.8 Math.sign
判断一个数到底为整数,还是负数,还是零。如果为整数返回1,负数返回-1,零返回0。
<script>
console.log(Math.sign(100));
console.log(Math.sign(-100));
console.log(Math.sign(0));
</script>
2. 对象方法
2.1 Object.is(value1 ,value2)
判断两个值是否完全相等。
<script>
console.log(Object.is(120,120));
//object.is和===全等很像,但是又不完全像,如下面的NaN
console.log(Object.is(NaN,NaN)); //返回true
console.log(NaN === NaN); //返回false
</script>
2.2 Object.assign
它是对对象的合并。
注意事项:
这里是config2覆盖了config1,并且合并了config2中没有的键值对。
<script>
const config1 = {
host:'localhost',
port:3306,
name:'root',
password:'root',
content:'内容'
}
const config2 = {
host:'www.localhost.com',
port:8080,
name:'sherlock',
password:'holmes',
content2:'内容2'
}
//config2覆盖掉config1
let a = Object.assign(config1,config2);
console.log(a);
</script>
2.3 Object.setPrototypeOf 和 Object.getPrototypeOf
Object.setPrototypeOf设置原型对象,Object.getPrototypeOf获取对象。
<script>
const school = {
name:'清华'
}
const cities = {
city:['北京','亚洲','地球']
}
//设置原型对象cities
Object.setPrototypeOf(school,cities);
//通过getPrototypeOf来获取school对象数值。
console.log(Object.getPrototypeOf(school));
console.log(school);
</script>
3. ES6 模块化
3.1 模块化介绍
模块化是指将一个大的程序文件,拆分成许多小的文件,然后将小文件组合起来。
模块化好处:
1. 防止命名冲突。
2. 代码复用。
3. 高维护性。
3.2 ES6 模块化语法
3.2.1 第一种方式 暴露和引入
模块功能主要由两个命令构成:export(暴露) 和 import(引入)。
这里其实和我们遇到的java导入jar包相似。
export命令用于规定模块的对外接口。
import命令用于输入其他模块提供的功能。
这里的export(暴露)分为:
1.分别暴露
2. 统一暴露
3. 默认暴露。
同样,这里的import(引入)分为:
1. 通用导入方式。
2. 解析赋值形式,重名和默认暴露都要用as起别名。
3. 简便形式,它只能针对默认暴露。并且不用写default。
3.2.2 第二种方式 src属性和入口文件
使用src属性来,进行导入。
就像下面是的,直接使用src导入,但是type必须是module值。
就像下面的app.js类似一个入口文件。
4. ES6 babel的转换
babel是一个JavaScript的编译器,可以访问官方babel来了解一下它。
babel功能就是将ES6以上的版本语法,转换为浏览器能识别的语法(大部分是转换为ES5)。
过程:
1.npm init --yes //初始化
2.npm i babel-cli babel-preset-env browserify -D //-D就是依赖
3.npx babel //转化
4.npx browserify //打包
这里只是初步了解一下bebal,后续会补充关于bebal的详细内容。
5. npm 安装和导入
在使用npm包时,要先下载对应的包,然后导入对应的包,就像下面这样子。
基本格式就是 import $ from ‘包名’ ;
完
以上是关于ES6 数据拓展Number,对象方法,三种模块化应用,npm包导入和转换的主要内容,如果未能解决你的问题,请参考以下文章