导航
×
   ❮   
HTML CSS JavaScript PHP Go Sass W3C Colors ECMS

JS 教程

JS 简介 JS 如何使用 JS 输出 JS 语法 JS 语句 JS 注释 JS 变量 JS 运算符 JS 条件语句 JS 循环 JS 字符串 JS 数字 JS 函数 JS 对象 JS 日期 JS 数组 JS 类型化数组 JS 集合 JS Map 映射 JS Math JS 正则表达式 JS 数据类型 JS 错误 JS 事件 JS 编程 JS 关键字参考 JS 保留关键字参考 JS 运算符参考 JS 运算符优先级 JS UTF-8 字符 JS UTF-8 符号 JS UTF-8 表情符号 JS 版本

JS 高级教程

JS 对象 JS 函数 JS 类 JS 迭代 JS Promises JS 模块

JavaScript Iterators 迭代器


Iterator 迭代器对象

Iterator 迭代器是一个对象,它提供了一种按顺序访问元素的标准方法。

迭代器必须遵循迭代器协议:它必须有一个 `next()` 方法。


next() 方法

next() 方法返回一个包含两个属性的对象:

  • value 属性保存迭代序列中的下一个值。
  • done 属性在还有更多元素需要迭代时返回 false,否则返回 true。

for...of 循环

JavaScript 的 for...of 语句用于遍历可迭代对象的元素。

语法

for (variable of iterable) {
  // 待执行的代码块
}

注意

严格来说,可迭代对象必须实现 Symbol.iterator 方法。

在 JavaScript 中,以下是可迭代对象:

  • Strings
  • Arrays
  • Typed Arrays
  • Sets
  • Maps

因为它们的原型对象有一个 Symbol.iterator 方法:

迭代器提供了一种可控的方式来处理数据序列,从而能够为各种数据结构实现自定义迭代逻辑。

它们尤其适用于处理数据流、惰性计算值以及构建具有已定义迭代行为的自定义数据结构。


辅助函数

JavaScript 2025 (ECMAScript 2025) 正式批准了一组新的迭代器辅助方法,显著增强了 JavaScript 中迭代器的功能。

这些方法提供了一种更高效、更实用的方式来处理可迭代对象(包括生成器),允许直接操作和转换,而无需先将其转换为数组。

函数 描述
drop() 返回一个迭代器,该迭代器会跳过指定数量的元素,然后返回剩余的元素
every() 如果所有元素都满足某个测试函数,则返回 true
filter() 返回一个迭代器,其中包含满足筛选函数的元素
find() 返回满足测试函数的第一个元素
flatMap() 通过映射每个元素并将结果扁平化来返回一个迭代器
forEach() 对迭代器中的每个元素执行一次函数。
from() 从可迭代对象创建迭代器对象。
map() 返回一个迭代器,其中包含所有经过 map 函数转换的元素
reduce() 对每个元素应用 reducer 函数,将其简化为单个值
some() 如果至少有一个元素满足测试函数,则返回 true
take() 返回一个迭代器,其中包含指定数量的元素

Iterator.from() 方法

Iterator.from() 从现有的可迭代对象或迭代器对象创建一个迭代器对象。

示例

// 创建一个迭代器
const myIterator = Iterator.from([1, 2, 3]);

// 遍历元素
let text = "";
for (const x of myIterator) {
  text += x;
}
亲自试一试 »

filter() 方法

filter() 方法返回一个包含满足筛选函数的元素的新迭代器。

示例

// 创建一个迭代器
const myIterator = Iterator.from([32, 33, 16, 40]);

// 过滤迭代器
const filteredIterator = myIterator.filter(x => x > 18);
亲自试一试 »

map() 方法

map() 方法返回一个新的迭代器,其中包含所有经过 map 函数转换的元素。

示例

// 创建一个迭代器
const myIterator = Iterator.from("123456789");

// 现在你可以使用 map 方法了
const mappedIterator = myIterator.map(x => x * 2);
亲自试一试 »

flatMap() 方法

flatMap() 方法通过映射每个元素并将结果扁平化为一个单一迭代器来返回一个新的迭代器。

示例

// 创建一个迭代器
const myIterator = Iterator.from([1, 2, 3, 4, 5, 6]);

// 映射迭代器
const mappedIterator = myIterator.flatMap(x => [x, x * 10]);
亲自试一试 »

take() 方法

take() 方法返回一个新的迭代器,该迭代器最多返回指定数量的元素。

示例

const myIterator = Iterator.from([1, 2, 3, 4, 5, 6]);

// 取前五个元素
const firstFive = myIterator.take(5);
亲自试一试 »

drop() 方法

drop() 方法返回一个新的迭代器,它会跳过指定数量的元素,然后再返回剩余的元素。

示例

// 创建一个迭代器
const myIterator = Iterator.from([1, 2, 3, 4, 5, 6]);

// 删除前五个
const firstFive = myIterator.drop(5);
亲自试一试 »

find() 方法

find(fn) 方法返回第一个满足测试函数的元素。

示例

// 创建一个迭代器
const myIterator = Iterator.from([3, 10, 18, 30, 20]);

// 查找第一个大于 18 的项
let result = myIterator.find(x => x > 18);
亲自试一试 »

reduce() 方法

reduce() 方法将 reducer 函数应用于累加器中的每个元素,将其简化为单个值。

示例

// 创建一个迭代器
const myIterator = Iterator.from([175, 50, 25]);

// 减少迭代器
let result = myIterator.reduce(myFunc);
亲自试一试 »

every() 方法

every(fn) 方法会在迭代器中的所有元素都满足所提供的测试函数时返回 true

示例

// 创建一个迭代器
const myIterator = Iterator.from("123456789");

// 所有元素都大于 7 吗?
let result = myIterator.every(x => x > 7);
亲自试一试 »

some() 方法

some() 方法返回 true,如果迭代器中至少有一个元素满足提供的测试函数。

示例

// 创建一个迭代器
const myIterator = Iterator.from("123456789");

// 是否存在大于 7 的元素?
let result = myIterator.some(x => x > 7);
亲自试一试 »

forEach() 方法

forEach() 方法会对迭代器中的每个元素执行一次提供的函数。

示例

// 创建一个迭代器
const myIterator = Iterator.from("123456789");

// 遍历所有元素
let text = "";
myIterator.forEach (x => text += x);
亲自试一试 »

注意

迭代器将迭代概念直接引入到 JavaScript 核心语言中,并提供了一种自定义 for...of 循环行为的机制。


Copyright ©2020-2026 freew3c.com All Rights Reserved 提供的内容仅用于学习和测试,不保证内容的正确性。