ES9 是 ECMAScript 的最新版本，引入了一些重要的新特性，其中最常用的新特性之一是 async/await。在本文中，我们将介绍如何使用 async/await 和其他相关技术来实现轮询异步数据。
什么是异步数据轮询？
异步数据轮询是指定期查询服务器以更新应用程序状态。应用程序可以定期向服务器发送查询请求以获取最新信息，并根据此信息更新用户界面。
异步数据轮询通常用于监视实时事件，如在股票市场中跟踪价格变化或在社交媒体网站上跟踪新消息。
使用 async/await 实现轮询异步数据
ES9 中引入的 async/await 语法允许我们使用类似同步代码的方式来处理异步操作。使用 async/await，可以轻松地实现轮询异步数据。下面是一个简单的例子，演示如何通过调用 fetch 函数获取 API 响应，然后使用 async/await 实现轮询：
-- -------------------- ---- -------
----- -------- ---------- -
----- -------- - ----- --------------------------------------
----- ---- - ----- ----------------
-- - -- -----
---------------
-- - -- -----
-------------------- -------
-
-----------在上面的代码中，我们首先调用 fetch 函数来获取 API 响应，然后使用 await 关键字等待异步操作完成。接下来，我们从响应对象中提取数据并将其传递给 updateUI 函数（此处未显示）。最后，我们使用 setTimeout 函数定时调用 pollData 函数，以便在 10 秒钟之后查询服务器以获取更新的数据。
使用 Promise 和 setTimeout 实现轮询异步数据
虽然 async/await 是一种很方便的方法，但我们也可以使用 Promise 和 setTimeout 函数来实现异步数据轮询。下面是使用 Promise 和 setTimeout 函数实现轮询的例子：
-- -------------------- ---- -------
-------- ---------- -
-------------------------------------
-------------- -- ----------------
---------- -- -
-- - -- -----
---------------
-- - -- -----
-------------------- -------
--
------------ -- -
---------------------
-- - -- -----
-------------------- -------
---
-
-----------在上面的代码中，我们首先调用 fetch 函数获取 API 响应，然后使用 Promise 来处理异步响应。接下来，我们从响应对象中提取数据并将其传递给 updateUI 函数。最后，我们使用 setTimeout 函数定时调用 pollData 函数，以便在 10 秒钟之后重新查询服务器以获取更新的数据。如果出现错误，我们将在控制台上打印错误并继续轮询。
结论
ES9 中引入的 async/await 语法允许我们在处理异步操作时编写更加简单、易读的代码。通过结合 setTimeout 函数等其他技术和方法，我们可以轻松地实现异步数据轮询。这使得应用程序可以更容易地获取实时数据，并基于这些数据更新用户界面。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/670bc82e66ef9cf37fac2571