ECMAScript 2021 是 JavaScript 的最新版本之一，引入了许多新的语言特性和功能，其中包括 for-of 循环。for-of 循环是一种遍历数组和类数组对象的方式，使得代码可以更加简洁和易读。然而，在实践中，使用 for-of 循环时可能会出现一些报错。本文将介绍为什么会出现这些报错，以及如何解决它们。
for-of 循环的语法
for-of 循环的语法非常简单。下面是一个简单的例子：
----- --- - --- -- --- --- ------ ---- -- ---- - ------------------ -
这个例子中，我们使用 for-of 循环遍历了一个数组，并打印了每个元素的值。for-of 循环的语法是这样的：
--- ------ ---- -- --------- - -- -- --------- ---- ---- -
其中，iterable 是一个可迭代的对象，例如数组、类数组对象或生成器对象。elem 是 iterable 中的每个元素的值。
报错分析
使用 for-of 循环时，可能会出现以下两种报错：
TypeError: undefined is not a function
当遍历的对象不是一个可迭代的对象时，会出现 "TypeError: undefined is not a function" 的报错。例如：
--- ------ ---- -- -- - ------------------ -
这段代码会抛出 "TypeError: undefined is not a function" 的错误。
TypeError: iterable[Symbol.iterator] is not a function
当遍历的对象是一个可迭代的对象，但是这个对象不包含 Symbol.iterator 的属性时，会出现 "TypeError: iterable[Symbol.iterator] is not a function" 的报错。例如：
----- --- - - -- -- -- -- -- - -- --- ------ ---- -- ---- - ------------------ -
这段代码会抛出 "TypeError: obj[Symbol.iterator] is not a function" 的错误。
解决方案
为了解决以上报错，我们需要确保遍历的对象是一个可迭代的对象，并且这个对象包含 Symbol.iterator 的属性。
使用数组解决第一个报错
如果我们想遍历一个数字范围，我们可以使用数组来替代它。例如：
--- ------ ---- -- --- -- -- -- --- - ------------------ -
这样可以避免 "TypeError: undefined is not a function" 的错误。
实现可迭代的对象
对于自定义的对象，我们需要手动实现 Symbol.iterator 方法，以便使对象成为一个可迭代的对象。下面是一个简单的例子：
----- --- - -
----- --- -- ---
------------------ ---------- -
--- ----- - --
----- ---- - ----------
----- ------ - ------------
------ -
----- ---------- -
----- ---- - ----- -- -------
----- ----- - ---- - --------- - --------------
------ - ------ ---- --
-
--
-
--
--- ------ ---- -- ---- -
------------------
-这段代码中，我们手动为 obj 对象实现了 Symbol.iterator 方法，使它成为了一个可迭代的对象。这样就可以避免 "TypeError: iterable[Symbol.iterator] is not a function" 的错误。
结论
for-of 循环是 ECMAScript 2021 中引入的一个新特性，它使代码更加简洁易读。然而，在使用 for-of 循环时可能会出现两种报错。为了避免这些报错，我们需要确保遍历的对象是一个可迭代的对象，并且这个对象包含 Symbol.iterator 的属性。如果遍历的对象不是一个可迭代的对象，我们可以使用数组来替代它。如果遍历的对象是一个自定义的对象，我们需要手动实现 Symbol.iterator 方法，以便使对象成为一个可迭代的对象。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/670dc8be5f551281025e63f3