什么是 ES7
ES7 是 ECMAScript 的第七个版本，也被称为 ES2016。它是 JavaScript 语言的最新标准之一，是一种高级编程语言，用于 Web 应用程序的开发。它引入了一些新的特性，如 async 和 await，可用于处理异步问题。
为什么需要解决延迟 promise 回来的问题
在前端开发中，我们经常需要处理异步数据的情况。JavaScript 中的 Promise 是处理异步操作的一种常见方式。当我们使用 Promise 时，我们通常等待一个异步操作完成并返回一个结果。但如果这个异步操作需要延迟，那么我们可能会遇到一些问题，例如可能会导致代码变得混乱和难以维护。
因此，我们需要一种方式来解决这个问题。ES7 提供了一种简单有效的解决方案，使用 async 和 await 关键字来优化异步处理的代码。
使用 async 和 await 解决问题
async 和 await 是 ES7 中的新关键字，可以让 JavaScript 代码更简洁、更可读、更易于维护。使用 async 和 await 关键字，我们可以轻松地解决延迟 Promise 回来的问题。
让我们举一个实际的例子来说明这个问题。假设我们要从服务器获取一些数据，但这个操作需要一些时间。我们可以使用 Promise 来处理这个异步请求，并使用 then 方法来处理返回结果：
function getData() {
return fetch('http://example.com/data')
.then(response => response.json())
.then(data => {
console.log(data);
return data;
});
}但是，在上面的代码中，在等待 Promise 返回数据期间，我们不能做其他任何事情。重要的是，我们需要在 our getData() 函数的 body 中编写 Promise 的逻辑 —— 这可能会使代码变得混乱和难以阅读。
使用 async 和 await，我们可以轻松地重构代码，使其更直观和简洁。接下来我们给出 async/await 的修改版：
async function getData() {
const response = await fetch('http://example.com/data');
const data = await response.json();
console.log(data);
return data;
}使用 async 和 await 关键字，我们可以通过 await 关键字将异步操作的结果存储在我们的变量中。这样我们就可以在代码中调用 getData() 函数并使用返回值。在上面的代码中，我们使用 const 创建一个名为response 的变量，并使用 await 等待异步操作完成。接着我们再次使用 await 关键字，将 JSON 数据存储在名为 data 的另一个变量中。最后我们输出 data 并返回它以供其他代码使用。
使用 async 和 await 关键字，我们可以通过自己编写代码体面的方式解决 promise 延迟回来的问题，这样我们的代码会更可读并更容易维护。
总结
ES7 提供了最新的异步操作处理工具，如 async 和 await 关键字，使我们能够解决一些常见的异步问题。使用它们，我们可以轻松地优化代码并减少混乱和滞后的代码。
使用 async 和 await，我们可以重构传统的 Promise 逻辑，在代码中直接引用异步操作的结果。这使我们的代码更可读、更可维护，同时也更容易理解和修改。
最后，当你碰到类似的问题时，不要忘记使用 async 和 await 关键字！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/648936a248841e9894784f61