iterator 和 数组 有什么关系
2025-02-17
786 字约 3 分钟
...关键词:iterator 对象、iterator 和 数组关系
在 JavaScript 中,Iterator(迭代器)和数组有着密切的关系:
一、数组作为可迭代对象
-
可在迭代场景中使用:
- 数组是一种内置的可迭代对象,这意味着它可以在需要可迭代对象的地方使用,比如在
for...of循环、扩展运算符(...)和Array.from()等方法中。 - 例如:
const arr = [1, 2, 3]; for (const item of arr) { console.log(item); } - 数组是一种内置的可迭代对象,这意味着它可以在需要可迭代对象的地方使用,比如在
-
实现了迭代协议:
- 数组实现了可迭代对象的协议,即拥有一个
Symbol.iterator方法。这个方法返回一个 Iterator 对象,用于遍历数组的元素。
- 数组实现了可迭代对象的协议,即拥有一个
二、Iterator 用于遍历数组
-
提供遍历机制:
- Iterator 对象为数组的遍历提供了一种标准化的方式。通过调用数组的
Symbol.iterator方法获取 Iterator 对象,然后可以使用next()方法逐个访问数组的元素。 - 例如:
const arr = [4, 5, 6]; const iterator = arr[Symbol.iterator](); let result = iterator.next(); while (!result.done) { console.log(result.value); result = iterator.next(); } - Iterator 对象为数组的遍历提供了一种标准化的方式。通过调用数组的
-
灵活的迭代控制:
- 使用 Iterator 对象可以更灵活地控制数组的遍历过程。可以在遍历过程中暂停、恢复或根据特定条件进行遍历。
- 例如,可以实现一个自定义的迭代器,只遍历数组中的偶数元素:
function evenNumberIterator(arr) { let index = 0; return { next() { while (index < arr.length) { const value = arr[index]; index++; if (value % 2 === 0) { return { value, done: false }; } } return { done: true }; }, }; } const arr = [1, 2, 3, 4, 5, 6]; const iterator = evenNumberIterator(arr); let result = iterator.next(); while (!result.done) { console.log(result.value); result = iterator.next(); }
三、数组方法与 Iterator 的关系
-
某些数组方法利用 Iterator:
- 一些数组方法,如
forEach()、map()、filter()等,内部实际上是使用 Iterator 来遍历数组的元素。 - 例如,
map()方法创建一个新数组,其中每个元素都是对原始数组中对应元素调用提供的函数的结果:
const arr = [7, 8, 9]; const newArr = arr.map((item) => item * 2); console.log(newArr); - 一些数组方法,如
-
可迭代性的扩展:
- 通过利用 Iterator,可以为数组定义自定义的迭代行为。例如,可以创建一个自定义的类,该类的实例是可迭代的,并且可以像数组一样进行遍历。
- 例如:
class CustomArray { constructor() { this.data = []; } add(item) { this.data.push(item); } *[Symbol.iterator]() { for (const item of this.data) { yield item; } } } const customArr = new CustomArray(); customArr.add(10); customArr.add(11); customArr.add(12); for (const item of customArr) { console.log(item); }
总之,Iterator 和数组在 JavaScript 中紧密相关。数组作为可迭代对象,可以通过 Iterator 进行遍历,而 Iterator 为数组的遍历提供了灵活的控制和扩展机制。这种关系使得在处理数组和其他可迭代对象时,可以使用统一的迭代模式和方法。
如果您觉得这篇文章有帮助,请点个赞吧~
相关文章
更多文章 →八股文2026-08-20
Embedding 向量模型:从语义表示到相似度计算
前言 大模型「读懂」文字靠的是 token,但 token 之间只有离散的编号关系,模型并不知道「苹果」和「李子」在语义上很近。要让程序能「理解」两段文字的相似程度,必须先把文本映射成一个 高维向量 ,再用几何方法比较。这一步就是 Embedding。 本篇基于我本地 今天的真实代码,从语义表示讲到余弦相似度,并复盘几个踩过的真实坑。 一、为什么需要 Embedding 传统关键词检索是「字面匹配」: Embedding 做的是「语义匹...
面试
八股文2026-08-19
前端面试100题
前端面试 100 题 适用方向:中高级前端 / React / Vue / Next.js / Nuxt / TypeScript / 工程化 / 实时通信 / Electron / Node.js / AI 应用前端 使用方式:优先掌握“标准回答”,再练“面试官追问”,最后把“结合你的简历怎么答”组织成自己的项目故事。 说明 “结合你的简历怎么答”只使用你简历中已经出现的项目与技术事实。 “标准回答 / 追问”属于通用前端知识总结,用...
面试
八股文2026-08-19
深入理解 JavaScript 原型与原型链:从关系图到核心逻辑 - heshanwan - 博客园
在 JavaScript 世界里, 原型(Prototype)和原型链(Prototype Chain) 是理解对象继承、属性查找机制的基石。很多开发者初学时对它们 “又爱又恨”,这篇文章将结合经典关系图,用通俗易懂的方式拆解原型与原型链的核心逻辑,帮你彻底掌握这套机制! 一、先搞懂几个核心概念 在分析关系图前,先明确 JavaScript 中与原型相关的关键概念,避免后续混淆: 1\. 函数对象与普通对象 函数对象 :由...
面试
八股文2026-08-17
JavaScript 闭包
摘要 :闭包(Closure)是 函数与其词法环境(Lexical Environment)的组合 ——一个函数可以"记住"并访问它被创建时所处的外部作用域中的变量,即使它在该作用域之外被执行。一句话记忆: 函数打包了出生地的变量,走到哪都能用 。核心要点:① 内部函数引用外部变量即形成闭包;② 闭包实现变量私有化/数据封装/柯里化;③ 潜在风险是内存泄漏和循环引用;④ 避免泄漏需手动解除引用和及时移除监听器。 一、什么是闭包 1.1...
面试
八股文2026-08-17
this 指向与 call / apply / bind
第 1 段(10min)回顾与预习:为什么必须搞懂 this 1.1 先接昨日(闭包)的线 昨天你学了 闭包 。闭包解决的是"函数记住它定义时所在作用域里的变量"。 闭包回答的问题是: “这个函数能访问到哪些变量?” → 看定义位置(词法作用域)。 而今天的主角 回答的是一个完全不同的问题: “这个函数执行时,站在谁的角度说话?” → 看 调用位置 (谁调用的、怎么调用的)。 一句话概括两者的分工: 变量看 定义处 , 看 调用处 。这...
面试
八股文2026-08-17
事件循环与宏任务 / 微任务
第 1 段(10min)回顾与预习:接住昨天的线 1.1 先接昨日(原型链)的线 昨天你学了 对象怎么找属性 (沿原型链上溯)。今天换一个维度: 代码怎么排队执行 。 把前三天的知识串成一句话,你已经有了 JS 的三张地图: 1.2 先凭直觉回答 4 个小问题(不用对,先写下答案) 学完第 2、3、4 段再回来对照。第 1 段只做一件事:记住画面—— JS 单线程,但靠"排队 + 轮转"假装多线程 。 第 2 段(15min)知识块①:...
面试
评论
请登录后发表评论
去登录