JS 2019
JavaScript 版本号
旧的 JS 版本以数字命名:ES5 (2009) 和 ES6 (2015)。
从 2016 年开始,版本按年份命名:ECMAScript 2016、2017、2018、2019、...
ES2019 中的新特性:
- String.trimStart()
- String.trimEnd()
- Object.fromEntries
- 可选的 catch 绑定
- Array.flat()
- Array.flatMap()
- 重新修订的 Array.Sort()
- 重新修订的 JSON.stringify()
- 字符串文字中允许的分隔符
- 重新修订的 Function.toString()
警告
这些特性相对较新。
较旧的浏览器可能需要替代代码(Polyfill)
JavaScript 字符串方法 trimStart()
ES2019 为 JavaScript 添加了 String 方法 trimStart()。
trimStart() 方法的工作方式与 trim() 类似,但仅从字符串的开头删除空格。
实例
let text1 = " Hello World! "; let text2 = text1.trimStart();运行实例 »
点击 "运行实例" 按钮查看在线实例
自 2020 年 1 月以来,所有现代浏览器都支持 JavaScript String trimStart():
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 66 | Edge 79 | Firefox 61 | Safari 12 | Opera 50 |
| 2018 年 4 月 | 2020 年 1 月 | 2018 年 6 月 | 2018 年 9 月 | 2018 年 5 月 |
JavaScript 字符串方法 trimEnd()
ES2019 为 JavaScript 添加了 trimEnd() 字符串方法。
trimEnd() 方法的工作方式与 trim() 类似,但仅从字符串末尾删除空格。
实例
let text1 = " Hello World! "; let text2 = text1.trimEnd();运行实例 »
点击 "运行实例" 按钮查看在线实例
自 2020 年 1 月以来,所有现代浏览器都支持 JavaScript String trimEnd():
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 66 | Edge 79 | Firefox 61 | Safari 12 | Opera 50 |
| 2018 年 4 月 | 2020 年 1 月 | 2018 年 6 月 | 2018 年 9 月 | 2018 年 5 月 |
JavaScript 对象方法 fromEntries()
ES2019 为 JavaScript 添加了 fromEntries() 对象方法。
fromEntries() 方法从可迭代的键/值对创建对象。
实例
const fruits = [ ["apples", 300], ["pears", 900], ["bananas", 500] ]; const myObj = Object.fromEntries(fruits);运行实例 »
点击 "运行实例" 按钮查看在线实例
自 2020 年 1 月以来,所有现代浏览器都支持 JavaScript Object fromEntries():
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 73 | Edge 79 | Firefox 63 | Safari 12.1 | Opera 60 |
| 2019 年 3 月 | 2020 年 1 月 | 2018 年 10 月 | 2019 年 3 月 | 2019 年 4 月 |
可选的 catch 绑定
从 ES2019 开始,如果不需要,可以省略 catch 参数:
实例
2019 年之前:
try {
// code
} catch (err) {
// code
}
2019 年后:
try {
// code
} catch {
// code
}
自 2020 年 1 月以来,所有现代浏览器都支持可选的 catch 绑定:
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 66 | Edge 79 | Firefox 58 | Safari 11.1 | Opera 53 |
| 2018 年 4 月 | 2020 年 1 月 | 2018 年 1 月 | 2018 年 3 月 | 2018 年 5 月 |
JavaScript 数组方法 flat()
ES2019 为 JavaScript 添加了 flat() 数组方法。
flat() 方法通过展平嵌套数组来创建新数组。
实例
const myArr = [[1,2],[3,4],[5,6]]; const newArr = myArr.flat();运行实例 »
点击 "运行实例" 按钮查看在线实例
自 2020 年 1 月以来,所有现代浏览器都支持 JavaScript Array flat():
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome 69 | Edge 79 | Firefox 62 | Safari 12 | Opera 56 |
| 2018 年 9 月 | 2020 年 1 月 | 2018 年 9 月 | 2018 年 9 月 | 2018 年 9 月 |
JavaScript 数组方法 flatMap()
ES2019 为 JavaScript 添加了 flatMap() 数组方法。
flatMap() 方法首先映射数组的所有元素,然后通过展平数组来创建新数组。
实例
const myArr = [1, 2, 3, 4, 5, 6]; const newArr = myArr.flatMap((x) => x * 2);运行实例 »
点击 "运行实例" 按钮查看在线实例
稳定的数组方法 sort()
ES2019 修订了 Array sort() 方法。
在 2019 年之前,规范允许不稳定的排序算法,例如 QuickSort。
在 ES2019 之后,浏览器必须使用稳定的排序算法:
当根据一个值对元素进行排序时,这些元素必须保持它们与具有相同值的其他元素的相对位置。
实例
const myArr = [
{name:"X00",price:100 },
{name:"X01",price:100 },
{name:"X02",price:100 },
{name:"X03",price:100 },
{name:"X04",price:110 },
{name:"X05",price:110 },
{name:"X06",price:110 },
{name:"X07",price:110 }
];
运行实例 »点击 "运行实例" 按钮查看在线实例
在上面的例子中,当按价格排序时,结果不允许出现在其他相对位置的名称,如下所示:
X01 100 X03 100 X00 100 X03 100 X05 110 X04 110 X06 110 X07 110
重新修订的 JSON.stringify()
ES2019 修订了 JSON 的 stringify() 方法。
在 2019 年之前,JSON 无法对使用 \ 编码的字符进行字符串化。
实例
let text = JSON.stringify("\u26D4");
运行实例 »点击 "运行实例" 按钮查看在线实例
在 ES2019 之前,在 UTF-8 代码点(U+D800 到 U+DFFF)上使用 JSON.stringify() 会返回损坏的 Unicode 字符,例如 ���。
此次修订后,具有 UTF-8 代码点的字符串可以使用 JSON.stringify() 安全地转换,并使用 JSON.parse() 恢复为原始字符串。
分隔符号
字符串文字中现在允许使用行分隔符和段落分隔符(\u2028 和 \u2029)。
在 2019 年之前,这些被视为行终止符并导致错误异常:
实例
// 这在 ES2019 中是有效的: let text = "\u2028";运行实例 »
点击 "运行实例" 按钮查看在线实例
注意
现在,JavaScript 和 JSON 拥有相同的规则。
在 ES2019 之前:
text = JSON.parse('"\u2028"') 会解析为 ''。
text = '"\u2028"' 会给出语法错误。
重新修订的 Function toString()
ES2019 修订了 Function toString() 方法。
toString() 方法返回表示函数源代码的字符串。
从 2019 年开始,toString() 必须返回函数的源代码,包括注释、空格和语法细节。
在 2019 年之前,不同的浏览器返回了不同的函数变体(比如没有注释和空格)。从 2019 年开始,该函数应该完全按照编写的方式返回。
实例
function myFunction(p1, p2) {
return p1 * p2;
}
运行实例 »点击 "运行实例" 按钮查看在线实例