ES11(ECMAScript 2020)是 Javascript 的一个大版本更新,它包括了一些新的特性,这些特性将会在前端开发中有很重要的作用。本文将总结一下 ES11 中的几个重要特性,并且给出相应的代码示例,希望能够对读者有所帮助。
1. Promise.allSettled()
Promise.allSettled()
是 Promise.all()
的一个强化版。在使用 Promise.all()
的时候,只要其中一个 Promise 出现了 reject
,整个 Promise 的状态就会变为 reject
。而 Promise.allSettled()
不论 Promise 的状态是 resolved
还是 rejected
,它都会返回一个数组,其中每一项都是一个对象,对象中包含的是 Promise
的完成状态和返回值。
示例代码:
-- -------------------- ---- ------- -- -- ------------- ---- ----- ------------- -------------------- ------- ------ ------------------ ---------- ------- ------- ----------- -- - ------------------------ ------ ----- ---------- -- - ------------------------ ------- --- --- -- -- -------------------- ----- ------------------ ------- ---- -------------------- -------------------- ------- ------ ------------------ ---------- ------- ------- ----------- -- - ------------------------------- ------ ----- ---
2. 可选链操作符
可选链操作符是一个非常方便的特性。当使用对象的属性、方法或数组的元素时,通常需要使用 if
判断是否存在,否则会出现 undefined
的错误,如下所示:
-- -------------------- ---- ------- ----- ------ - - ----- ----- ---- --- ---- - ------ ---------- -------- ------- -- -- -- -- -------------------- ---- -- ------- -- ---------- -- ------------------- - ----------------------- -------------------- - ---- - ---------------- --------------------- -
使用可选链操作符,代码变得简洁了很多:
console.log('Company:', person?.job?.company ?? '找不到 person.job.company');
其中,?.
表示,如果 person.job
存在,则继续使用 person.job.company
,否则直接返回 undefined
。
3. BigInt
在 JS 中,数值的整数范围是有限制的,JavaScript 只支持 2 的 53 次方的数字。当需要处理非常大的整数时,就需要使用 BigInt
。BigInt
是一个全新的基本数据类型,它的参照范围越过了数字在 JavaScript
里面的最大范围。它可以保存一个任意精度的整数值。
示例代码:
const bigNum1 = BigInt(Number.MAX_SAFE_INTEGER) + 1n; // '9007199254740992n' const bigNum2 = BigInt(Number.MAX_SAFE_INTEGER) + 2n; // '9007199254740993n' console.log(bigNum1 + bigNum2); // '18014398509481985n'
4. 字符串新增方法
在 ES11 中,字符串有了一些实用的新方法。
String.prototype.replaceAll()
:用于替换全部匹配项。它是String.prototype.replace()
的全局匹配版。String.prototype.matchAll()
:返回一个迭代器,通过它可以遍历一个字符串中所有的匹配项。
示例代码:
const str = '欢迎上课!你可以在我们的学习中心或 Slack 频道 #链接学习,寻找帮助。' console.log(str.replaceAll(' ', '-')); // '欢迎上课!你可以在我们的学习中心或-Slack-频道-#链接学习,寻找帮助。' const regexp = /([^\u4e00-\u9fa5]+)/g; const matchAll = str.matchAll(regexp); for (const matched of matchAll) { console.log(matched[1]); }
总结
ES11 引入了一些非常实用的新特性,包括 Promise.allSettled()
、可选链操作符?.
、BigInt
数据类型以及字符串新增方法 replaceAll()
和 matchAll()
。这些新特性可以在前端开发中帮助我们提高代码的可读性和更加高效的开发。如果你还没有使用这些特性,建议现在就开始学习并使用起来。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64691c8a968c7c53b09295aa