![c8393344b45d83e8ff2070cd76873cb7.png](https://i-blog.csdnimg.cn/blog_migrate/6322d6b1d04e5c8ff1f7de3a48340ff5.jpeg)
大家好,我是刘俊余。
这篇文章主要给大家介绍一下ES2020。
首先大家先不要紧张说又要学一堆东西了。Es2020不会增加很多新特性。
先给大家普及一下。Es2020是什么呢。 明明我们写的是js怎么蹦出来个ES版本。
大家可以这么理解。JavaScript 是 ECMAScript 的方言。ECMAScript是一个标准化了脚本语言相当于汉语。发布一个新版本的 ECMAScript 时,并不意味着所有 JavaScript 引擎都会马上拥有新的特性。这取决于 JavaScript 引擎开发者是否支持最新特性。
换句话说,JavaScript 是 ECMAScript 的方言。
这下子大家了解了。Es对我们前端开发者有多重要了吧。 新特性谷歌浏览器已经支持了。 那我们先睹为快吧。
BigInt
BigInt是一种新的类型
直接上代码
const X = BigInt(Number.MAX_SAFE_INTEGER) + 1,
const Y = BigInt(Number.MAX_SAFE_INTEGER) + 2;
x==y //true
超过最大数值之后计算会出现错误。 这时候我们就可以使用BigInt.使用BigInt之后,我们就可以很准确的表示很大的数字。
const x = 9007199254740994n; //9007199254740994
typeof 9007199254740994n //bigint
const y = 9007199254740998n; //9007199254740998
const z = 10n+10 //VM1348:1 Uncaught TypeError: Cannot mix BigInt and other types, use explicit conversions
const z = 10n+10n = 20n
matchAll
let str = '我爱javascript,我在写javascript';
let res = str.match(/javascript);
// ["javascript", index: 2, input: "我爱javascript,我在写javascript", groups: undefined]
这段代码我们通过正则表达式匹配"javascript"这个单词相关的索引位置信息以及内容等等。
这段代码只返回了字符串中匹配的第一个实例。还不是匹配出来的所有实例
那如果我们改变一下正则
let str = '我爱javascript,我在写javascript';
let res = str.match(/javascript/g);
// ["javascript", "javascript"]
发现只能返回两个结果,数组中并没有结果的索引等其他信息。
let str = '我爱javascript,我在写javascript';
let res = str.matchAll(/javascript/g);
console.log(...res);
那现在我们可以使用matchAll来匹配所有符合正则的实例并且他会返回该实例的所有信息。
Promise.allSettled
Promise.all 让我们可以使用多个回调,等他们都有了返回结果之后再继续执行某事。
不过promise.all有个缺点就是如果有一个回调reject了。那我们promise就拿不到结果。
我们看一下代码
const promise1 = Promise.resolve('resolve1');
const promise2 = Promise.resolve('resolve2');
const promise3 = Promise.reject('resolve3');
const promiseA = [promise1,promise2,promise3];
Promise.all(promiseA).then((a)=> console.log(a))
//Promise {<rejected>: "resolve3"}
我们得到的仅仅告诉我们哪个请求呗reject掉了.
那现在我们使用Promise.allSettled看看我们能得到什么。
const promise1 = Promise.resolve('resolve1');
const promise2 = Promise.resolve('resolve2');
const promise3 = Promise.reject('resolve3');
const promiseA = [promise1,promise2,promise3];
Promise.allSettled(promiseA).then((a)=> console.log(a))
//(3) [{…}, {…}, {…}]
//0: {status: "fulfilled", value: "resolve1"}
//1: {status: "fulfilled", value: "resolve2"}
//2: {status: "rejected", reason: "resolve3"}
//length: 3
现在我们得到我们想到的数组了,并且可以看到每个promise的状态,以及返回的结果。
这时候我们不用担心某一个请求挂掉了之后影响其他的请求
optional chaining
这个特性真的特别好用.我觉得这个新特性是这个版本更新的最有用的特性。
还是先看一段代码
const obj = {
a:{
b:{
c:'你找到我了'
}
}
}
如果我们要找到c的话,必须要这么写
if(obj && obj.a && obj.a.b && obj.a.b.c){
console.log('这时候你才可以使用c')
}
我们必须要检查C是否在那里,让我们的代码特别难看。
现在我们可以使用optional chining新特性.
const name = obj.a?.b?.c?.name // 你找到我了
也就是在我们使用之前加一个问号
const name = obj.a?.b?.d.name // undefined
我们快速的浏览了es2020. 如果你们有任何疑问都可以在下面进行留言。大家相互讨论也可以让我知道你已经认真看过这篇文章了。这对我真的很重要。谢谢