在 ECMAScript 2016 中，Array 类型新增了一个 @@iterator 方法，该方法可以使数组变得可迭代。这个方法返回一个迭代器对象，可以用于遍历数组中的每一个元素。在本文中，我们将深入探讨这个方法的使用及例子，并提供一些指导意义。
使用 Array.prototype @@iterator 方法
在使用 @@iterator 方法之前，我们需要了解迭代器对象的概念。迭代器对象是一个具有 next() 方法的对象，该方法返回一个包含两个属性的对象：value 和 done。其中，value 表示当前迭代器指向的值，done 表示该迭代器是否已经完成。
为了使用 @@iterator 方法，我们可以通过以下方式获取迭代器对象：
var arr = [1, 2, 3]; var iterator = arr[Symbol.iterator]();
通过调用数组的 Symbol.iterator 方法，我们可以获取到一个迭代器对象。接下来，我们可以使用 while 循环来遍历数组中的每一个元素：
var arr = [1, 2, 3]; var iterator = arr[Symbol.iterator](); var next = iterator.next(); while (!next.done) { console.log(next.value); next = iterator.next(); }
在上面的代码中，我们使用 while 循环来遍历数组中的每一个元素。在每一次循环中，我们都调用了 next() 方法来获取当前迭代器指向的值，并将其输出到控制台。当迭代器已经完成遍历数组时，done 属性将会变成 true，循环将会结束。
不过，我们可以使用 for...of 循环来更加简化代码：
var arr = [1, 2, 3]; for (var value of arr) { console.log(value); }
在上面的代码中，我们使用 for...of 循环来遍历数组中的每一个元素。这种方式更加直观和简洁，也更容易理解。
Array.prototype @@iterator 方法的例子
下面，我们来看一下 @@iterator 方法的一些例子。假设我们有一个数组 arr，它包含了一些数字：
var arr = [1, 2, 3];
我们可以使用 @@iterator 方法来遍历这个数组：
var iterator = arr[Symbol.iterator](); var next = iterator.next(); while (!next.done) { console.log(next.value); next = iterator.next(); }
这将会输出以下内容：
1 2 3
除此之外，我们还可以使用 for...of 循环来遍历这个数组：
for (var value of arr) { console.log(value); }
这将会输出以下内容：
1 2 3
如果我们想要获取数组中的每一个元素的平方，我们可以使用 map() 方法和 @@iterator 方法：
-- -------------------- ---- ------- --- --- - --- -- --- --- -------- - ----------------------- --- ------ - --- --- ---- - ---------------- ----- ------------ - ---------------------- - ------------ ---- - ---------------- - --------------------展开代码
这将会输出以下内容：
[1, 4, 9]
除此之外，我们还可以使用 for...of 循环和 map() 方法来实现同样的功能：
var arr = [1, 2, 3]; var result = []; for (var value of arr) { result.push(value * value); } console.log(result);
这将会输出以下内容：
[1, 4, 9]
指导意义
通过学习 @@iterator 方法，我们可以更加方便地遍历数组中的每一个元素，而不需要使用传统的 for 循环。使用 for...of 循环可以让代码更加简洁和直观，也更容易理解。同时，我们也可以使用 @@iterator 方法和其他方法（如 map()、filter()、reduce() 等）来实现复杂的操作。
除此之外，我们还需要注意以下几点：
- @@iterator 方法返回的迭代器对象只能用于遍历一次数组。如果需要重新遍历数组，需要重新获取迭代器对象。
- @@iterator 方法返回的迭代器对象并不是一个数组，而是一个具有 next() 方法的对象。因此，我们不能使用数组的方法和属性来操作迭代器对象。
- @@iterator 方法是 ES6 新增的方法，因此在一些较老的浏览器中可能不支持。如果需要兼容性，可以使用其他方法来遍历数组。
总之，学习 @@iterator 方法可以让我们更加方便地遍历数组，并提高代码的可读性和可维护性。在实际开发中，我们应该根据具体需求来选择合适的方法来遍历数组。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67c58ac6cf1e9924e1d3a69a
