JavaScript》》JS》》ES6》》 foreach 、for in 、for of

在 C# 中,使用 foreach 循环时,不能直接修改值类型的实例。这是因为 foreach 循环的迭代变量是只读的,无法更改其成员。但JS中是可以更改的

foreach

forEach 是数组原型的方法,用于遍历数组元素,无法中断遍历(如使用 break 或 return)。

forEach 方法也是遍历数组的一种方式,它可以用来在每个数组元素上执行一些操作,例如,修改、删除、或执行其他操作等。forEach 方法的语法如下:

javascript 复制代码
//其中,currentValue 为当前遍历到的元素的值,index 为当前遍历到元素的下标,array 为操作的数组
array.forEach(function(currentValue, index, array) {
  // code
});
javascript 复制代码
let arr = [1, 2, 3, 4];

arr.forEach(function(item, index) {
  arr[index] = item * 2;
});

console.log(arr);
// [2, 4, 6, 8]

for of

for of 是 ES6 引入的遍历语法,支持可迭代对象(如数组、字符串、Map、Set),允许使用 break 或 continue 控制流程。

还可以使用解构语法来获取每个元素的完整内容

for...of 方法的语法如下:

javascript 复制代码
for (let [value] of array) {
  // code
}


// 
let arr = [1, 2, 3, 4];

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

//解构
let books = [
  {title: 'JavaScript1', author: 'A'},
  {title: 'JavaScript2', author: 'B'},
  {title: 'JavaScript3', author: 'C'}
];

for (let { title, author } of books) {
  console.log(title + '的作者是' + author);
}

注意:普通对象 {} 默认不是可迭代对象,不能直接使用 for...of。如果要用,可以使用 Object.keys(), Object.values() 或 Object.entries() 先将其转化为数组。

javascript 复制代码
// 对于对象,需要先获取其键、值或条目
const obj = { name: 'Alice', age: 30 };
for (const key of Object.keys(obj)) {
  console.log(key); // 输出:name, age
}
for (const value of Object.values(obj)) {
  console.log(value); // 输出:Alice, 30
}
javascript 复制代码
// 用于数组(不推荐的做法)
const arr = ['a', 'b', 'c'];
arr.customProperty = 'I am custom'; // 给数组添加一个自定义属性

for (const index in arr) {
  console.log(`Index: ${index}, Value: ${arr[index]}`);
}
// 输出:
// Index: 0, Value: a
// Index: 1, Value: b
// Index: 2, Value: c
// Index: customProperty, Value: I am custom (这就是问题所在!)

for in

遍历对象:for in

for in 用于遍历对象的可枚举属性(包括原型链上的属性),通常需要配合 hasOwnProperty 过滤。

javascript 复制代码
const obj = { a: 1, b: 2 };
for (const key in obj) {
  if (obj.hasOwnProperty(key)) {
    console.log(key, obj[key]); // 输出:a 1, b 2
  }
}

数组》》自定义属性

相关推荐
掘了3 分钟前
「2025 年终总结」在所有失去的人中,我最怀念我自己
前端·后端·年终总结
崔庆才丨静觅6 分钟前
实用免费的 Short URL 短链接 API 对接说明
前端
崔庆才丨静觅27 分钟前
5分钟快速搭建 AI 平台并用它赚钱!
前端
崔庆才丨静觅1 小时前
比官方便宜一半以上!Midjourney API 申请及使用
前端
Moment1 小时前
富文本编辑器在 AI 时代为什么这么受欢迎
前端·javascript·后端
崔庆才丨静觅1 小时前
刷屏全网的“nano-banana”API接入指南!0.1元/张量产高清创意图,开发者必藏
前端
剪刀石头布啊1 小时前
jwt介绍
前端
爱敲代码的小鱼1 小时前
AJAX(异步交互的技术来实现从服务端中获取数据):
前端·javascript·ajax
Cobyte2 小时前
AI全栈实战:使用 Python+LangChain+Vue3 构建一个 LLM 聊天应用
前端·后端·aigc
NEXT062 小时前
前端算法:从 O(n²) 到 O(n),列表转树的极致优化
前端·数据结构·算法