JavaScript - Symbol.asyncIterator 属性

Symbol.asyncIterator 属性用于定义对象上的异步迭代方法。它是在 ECMAScript 2018 规范中引入的，用于启用 JavaScript 异步迭代协议。JavaScript 通常允许使用 for...of 循环，它可以对各种可迭代对象进行操作，包括 set、array、strings、map 等。但是，在迭代需要异步操作（例如，从服务器检索数据或从流中读取）的情况下，同步迭代是不合适的。

为了克服这个问题，ECMAScript 引入了异步迭代器和 Symbol.asyncIterator 属性的概念。此内置元件使对象成为异步可迭代对象，从而启用异步迭代。

语法

以下是 JavaScript Symbol.asynciterator 属性的语法 -


 [Symbol.asyncIterator]()

参数

此属性不接受任何类型的参数。

返回值

此属性返回异步迭代器对象的值。

示例 1

让我们看看下面的例子，我们将使用 for await of 循环创建一个带有 symbol.asyncIterator 的异步可迭代对象。


<html>
	 	<body>
	 	 	 <script>
	 	 	 	 	const x = {
	 	 	 	 	 	 async *[Symbol.asyncIterator]() {
	 	 	 	 	 	 	 	yield 11 + " < br > ";
	 	 	 	 	 	 	 	yield 4 + " < br > ";
	 	 	 	 	 	 	 	yield 33 + " < br > ";
	 	 	 	 	 	 }
	 	 	 	 	};
	 	 	 	 	(async () => {
	 	 	 	 	 	 for await (const a of x) {
	 	 	 	 	 	 	 	document.write(a);
	 	 	 	 	 	 }
	 	 	 	 	})();
	 	 	 </script>
	 	</body>
</html>

如果我们执行上述程序，它将在网页上显示数字。

示例 2

考虑另一个场景，我们将定义一个异步生成器函数，它返回一个异步可迭代对象。


<html>
	 	<body>
	 	 	 <script>
	 	 	 	 	async function* x() {
	 	 	 	 	 	 yield 'Ram';
	 	 	 	 	 	 yield 'Rahul';
	 	 	 	 	 	 yield 'Ravi';
	 	 	 	 	}
	 	 	 	 	(async () => {
	 	 	 	 	 	 for await (const a of x()) {
	 	 	 	 	 	 	 	document.write(a + " < br > ");
	 	 	 	 	 	 }
	 	 	 	 	})();
	 	 	 </script>
	 	</body>
</html>

在执行上述脚本时，它将在网页上显示文本。

示例 3

在下面的示例中，我们将使用 Symbol.asyncIterator 创建一个生成值的自定义异步可迭代类。


<html>
	 	<body>
	 	 	 <script>
	 	 	 	 	class x {
	 	 	 	 	 	 constructor() {
	 	 	 	 	 	 	 	this.a = [1, 2, 3];
	 	 	 	 	 	 }
	 	 	 	 	 	 async *[Symbol.asyncIterator]() {
	 	 	 	 	 	 	 	for (const y of this.a) {
	 	 	 	 	 	 	 	 	 await new Promise(resolve => setTimeout(resolve, 100));
	 	 	 	 	 	 	 	 	 yield y;
	 	 	 	 	 	 	 	}
	 	 	 	 	 	 }
	 	 	 	 	}
	 	 	 	 	(async () => {
	 	 	 	 	 	 for await (const b of new x()) {
	 	 	 	 	 	 	 	document.write(b + " < br > ");
	 	 	 	 	 	 }
	 	 	 	 	})();
	 	 	 </script>
	 	</body>
</html>

当我们执行脚本时，它会在网页上显示一个文本。

打印本页