JS 2020
JavaScript 版本号
旧的 JS 版本以数字命名:ES5 (2009) 和 ES6 (2015)。
从 2016 年开始,版本按年份命名:ECMAScript 2016、2017、2018、2019、...
ES2020 中的新特性:
- BigInt
- 字符串方法 matchAll()
- 空值合并运算符 (??)
- 可选链运算符 (?.)
- 逻辑 AND 赋值运算符 (&&=)
- 逻辑 OR 赋值运算符 (||=)
- 空值合并赋值运算符 (??=)
- Promise.allSettled()
- 动态导入
警告
这些特性相对较新。
较旧的浏览器可能需要替代代码(Polyfill)。
JavaScript BigInt
JavaScript BigInt 变量用于存储太大而无法用普通 JavaScript 数字表示的大整数值。
JavaScript 整数最多只能精确到 15 位数字。
Integer 实例
let x = 999999999999999; let y = 9999999999999999; // 太大运行实例 »
点击 "运行实例" 按钮查看在线实例
BigInt 实例
let x = 9999999999999999; let y = 9999999999999999n;运行实例 »
点击 "运行实例" 按钮查看在线实例
如需创建 BigInt,请将 n 附加到整数末尾或调用 BigInt():
实例
let x = 1234567890123456789012345n; let y = BigInt(1234567890123456789012345)运行实例 »
点击 "运行实例" 按钮查看在线实例
BigInt 的 JavaScript 类型是 "bigint":
实例
let x = BigInt(999999999999999); let type = typeof x;运行实例 »
点击 "运行实例" 按钮查看在线实例
自 2020 年 9 月以来,所有现代浏览器都支持 BigInt:
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 67 | Edge 79 | Firefox 68 | Safari 14 | Opera 54 |
| 2018 年 5 月 | 2020 年 1 月 | 2019 年 7 月 | 2020 年 9 月 | 2018 年 6 月 |
JavaScript 字符串方法 matchAll()
在 ES2020 之前,没有字符串方法方法可用于搜索字符串中所有出现的字符串。
实例
const iterator = text.matchAll("Cats");
运行实例 »点击 "运行实例" 按钮查看在线实例
如果参数是正则表达式,则必须设置全局标志 (g),否则会抛出 TypeError。
实例
const iterator = text.matchAll(/Cats/g);运行实例 »
点击 "运行实例" 按钮查看在线实例
如果要进行不区分大小写的搜索,则必须设置不区分大小写标志 (i):
实例
const iterator = text.matchAll(/Cats/gi);运行实例 »
点击 "运行实例" 按钮查看在线实例
提示:ES2021 引入了字符串方法 replaceAll()。
空值合并运算符(Nullish Coalescing Operator)(?? 运算符)
如果第一个参数不是空值(null 或 undefined),则 ?? 运算符返回第一个参数。
否则返回第二个。
实例
let name = null; let text = "missing"; let result = name ?? text;运行实例 »
点击 "运行实例" 按钮查看在线实例
自 2020 年 3 月以来,所有现代浏览器都支持 nullish 运算符:
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 80 | Edge 80 | Firefox 72 | Safari 13.1 | Opera 67 |
| 2020 年 2 月 | 2020 年 2 月 | 2020 年 1 月 | 2020 年 3 月 | 2020 年 3 月 |
可选链运算符(Optional Chaining Operator)(?. 运算符)
如果对象为 undefined 或 null,则可选链运算符返回 undefined(而不是抛出错误)。
实例
const car = {type:"Fiat", model:"500", color:"white"};
let name = car?.name;
运行实例 »点击 "运行实例" 按钮查看在线实例
自 2020 年 3 月以来,所有现代浏览器都支持 ?.= 运算符:
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 80 | Edge 80 | Firefox 74 | Safari 13.1 | Opera 67 |
| 2020 年 2 月 | 2020 年 2 月 | 2020 年 3 月 | 2020 年 3 月 | 2020 年 3 月 |
逻辑 AND 赋值运算符(&&= 运算符)
逻辑 AND 赋值运算符用于两个值之间。
如果第一个值为 true,则分配第二个值。
逻辑 AND 赋值实例
let x = 100; x &&= 5;运行实例 »
点击 "运行实例" 按钮查看在线实例
自 2020 年 9 月以来,所有现代浏览器都支持 &&= 运算符:
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 85 | Edge 85 | Firefox 79 | Safari 14 | Opera 71 |
| 2020 年 8 月 | 2020 年 8 月 | 2020 年 3 月 | 2020 年 9 月 | 2020 年 9 月 |
逻辑 OR 赋值运算符(||= 运算符)
逻辑 OR 赋值运算符用于两个值之间。
如果第一个值为 false,则分配第二个值。
逻辑 OR 赋值实例
let x = 10; x ||= 5;运行实例 »
点击 "运行实例" 按钮查看在线实例
自 2020 年 9 月以来,所有现代浏览器都支持 ||= 运算符:
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 85 | Edge 85 | Firefox 79 | Safari 14 | Opera 71 |
| 2020 年 8 月 | 2020 年 8 月 | 2020 年 3 月 | 2020 年 9 月 | 2020 年 9 月 |
空值合并赋值运算符(??= 运算符)
空值合并赋值运算符(Nullish Coalescing Assignment Operator)用于两个值之间。
如果第一个值 undefined 或为 null,则分配第二个值。
空值合并赋值实例
let x = 10; x ??= 5;运行实例 »
点击 "运行实例" 按钮查看在线实例
自 2020 年 9 月以来,所有现代浏览器都支持 ??= 运算符:
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 85 | Edge 85 | Firefox 79 | Safari 14 | Opera 71 |
| 2020 年 8 月 | 2020 年 8 月 | 2020 年 3 月 | 2020 年 9 月 | 2020 年 9 月 |