ES8，全称 ECMAScript 2017，是一个 JavaScript 版本，它在很多方面提供了更好的开发体验和更好的语言表达能力。本文将介绍 ES8 的新特性，并提供实际的 JavaScript 代码示例，让开发者能够更好地应用 ES8 的新特性。
Async/Await
在 ES6 中，我们通过 Promise 来解决 JavaScript 回调深度嵌套的问题，但 Promise 的回调函数还是使用了 then，导致代码难以阅读、调试。ES8 中引入了 Async/Await 语法，它可以让我们写出更清晰、可读性更高的异步代码，同时也避免了 Promise 链式回调所带来的问题。
async function fetchData() { const result = await fetch('https://api.example.com/data'); const data = await result.json(); return data; }
在上面的代码中，fetchData 函数的返回值是一个 Promise，在函数内部使用了 await 关键字来等待 Promise 结果，这样代码就变得十分清晰明了。
Object.values/Object.entries
ES8 引入了两个新的 Object API：Object.values 和 Object.entries。Object.values 可以将对象的值存入一个数组中，而 Object.entries 则可以将对象的键和值存入一个二维数组中。
const obj = {a: 1, b: 2, c: 3}; const arrValues = Object.values(obj); console.log(arrValues); // [1, 2, 3] const arrEntries = Object.entries(obj); console.log(arrEntries); // [["a", 1], ["b", 2], ["c", 3]]
这两个新 API 可以帮助我们更方便地操作对象的属性，避免了写一大堆的 for-in 循环。
String padding
在 ES8 中，String 类型又新增了两个方法：padStart 和 padEnd，可以用来对字符串进行填充。
const str = 'hello'; const padStartStr = str.padStart(10, '.'); console.log(padStartStr); // .......hello const padEndStr = str.padEnd(10, '.'); console.log(padEndStr); // hello.....
padStart 和 padEnd 都可以接受两个参数，第一个是填充后字符串的总长度，第二个是填充的字符。如果原字符串长度已经超过了总长度，则不会进行填充。
JavaScript 实战
我们可以使用 ES8 的新特性来写出更清晰、更简洁的 JavaScript 代码。以下是一个实际使用 Async/Await 和 Object.entries 新特性的例子。
-- -------------------- ---- ------- ----- ------- - ------------------------------- ----- -------- ----------- - ----- ------ - ----- --------------- ----- ---- - ----- -------------- ----- -- ----------- - -------------------------------------- -- --- --- --------------- ----- -------------- - ------------------- -- -- -------- ----------- ---- ------ --------------- -展开代码
在 fetchData 函数中，我们使用 Async/Await 简化异步代码，并且使用 Object.entries 找到 data 中的 last_update 属性值，将其赋值给 dataForDisplay 数组中的每一个元素。
指导意义
ES8 的新特性可以使得我们在编写 JavaScript 代码时变得更加简洁、注意力更加集中在业务逻辑上，而不是去关注底层的操作。同时，提供了许多方便的 API，使得我们可以更轻松地操作 JavaScript 对象。最终，ES8 为 JavaScript 带来了更加优秀的开发体验和更高效的代码实现。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67b84f70306f20b3a65fc6ee
