JavaScript迭代器_javascript遍历方法

迭代器是JavaScript中通过next()方法访问集合元素的设计模式,返回包含value和done的对象;for循环适用于索引操作,for…of遍历可迭代对象的值,forEach执行回调但不可中断,map生成新数组,for…in用于对象属性遍历,Object.keys结合forEach可枚举自身属性;实现Symbol.iterator可使对象可迭代,内置可迭代类型包括Array、String、Map、Set等,支持for…of和扩展运算符。

javascript迭代器_javascript遍历方法

JavaScript 中的迭代器和遍历方法是处理数据集合的核心机制。理解它们能帮助你更高效地操作数组、对象和其他可迭代结构。

什么是迭代器(Iterator)

迭代器是一种设计模式,允许你访问集合中的元素而无需暴露其底层结构。在 JavaScript 中,一个迭代器是一个对象,它实现了 next() 方法,返回包含 valuedone 两个属性的对象。

当 done 为 true 时,表示遍历结束;否则继续通过 value 获取当前值。

你可以手动创建一个迭代器:

立即学习“Java免费学习笔记(深入)”;

const arr = [1, 2, 3];const iterator = arr[Symbol.iterator]();

iterator.next(); // { value: 1, done: false }iterator.next(); // { value: 2, done: false }iterator.next(); // { value: 3, done: false }iterator.next(); // { value: undefined, done: true }

常见的遍历方法

JavaScript 提供了多种方式来遍历数组或类数组结构,每种方法适用不同场景。

1. for 循环 — 最基础的方式,适合需要索引的操作。

for (let i = 0; i < arr.length; i++) {  console.log(arr[i]);}

2. for…of 循环 — 遍历可迭代对象(如数组、字符串、Map、Set),直接获取值。

for (const item of arr) {  console.log(item);}

3. forEach() — 数组方法,执行回调函数对每个元素进行操作,不能中断(return 不会跳出循环)。

arr.forEach(item => {  console.log(item);});

4. map() — 创建一个新数组,结果是原数组每个元素调用函数后的返回值。

const doubled = arr.map(x => x * 2);

5. for…in — 主要用于遍历对象的可枚举属性,不推荐用于数组(因为可能遍历到意外的属性)。

const obj = { a: 1, b: 2 };for (const key in obj) {  console.log(key, obj[key]);}

6. Object.keys() + forEach — 遍历对象的所有自身可枚举属性键。

Object.keys(obj).forEach(key => {  console.log(key, obj[key]);});

可迭代协议与自定义对象遍历

任何对象只要实现 [Symbol.iterator] 方法,就可以被 for…of 或扩展运算符使用。

例如,让一个普通对象支持遍历:

const myIterable = {  data: ['a', 'b', 'c'],  [Symbol.iterator]() {    let index = 0;    return {      next: () => {        if (index < this.data.length) {          return { value: this.data[index++], done: false };        }        return { done: true };      }    };  }};

for (const item of myIterable) {console.log(item); // 输出 a, b, c}

哪些类型默认可迭代?

以下内置类型实现了可迭代协议:

ArrayStringMapSetarguments 对象NodeList 等 DOM 集合(部分环境)

这意味着它们都能用 for…of 扩展、Array.from() 等方式处理。

基本上就这些。掌握迭代器原理和各种遍历方法的区别,能让你写出更清晰、高效的代码。

以上就是JavaScript迭代器_javascript遍历方法的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1540072.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月21日 12:09:11
下一篇 2025年12月21日 12:09:21

相关推荐

发表回复

登录后才能评论
关注微信