for in与for of的区别

简介: for in与for of的区别

在JavaScript中,for…in和for…of都是用来遍历集合的循环控制结构,但它们之间存在一些重要的区别:


用途不同:

for…in循环用于遍历对象的属性。

for…of循环用于遍历可迭代对象(如数组,字符串,Set,Map等)的值。

遍历的内容不同:

for…in会遍历对象所有的可枚举属性,包括原型链上的属性。

for…of遍历的是可迭代对象的实际值,不包括原型链上的值。

循环控制不同:

for…in循环使用对象的属性名作为循环变量的值。

for…of循环使用迭代器的值作为循环变量的值。

语法结构不同:

for…in语法:

for (let 变量 in 对象) {
  // 使用变量来引用属性名
}
 
 

for…of语法

for (let 变量 of 可迭代对象) {
  // 使用变量来引用迭代器的值
}

迭代的可选性不同:

for…in循环中,即使属性是undefined或原型链上的属性,只要可枚举,也会被遍历到。

for…of循环中,只有可迭代对象中实际存在的值才会被遍历到。

与数组的索引关系:

for…in不直接与数组的索引相关联,所以不能直接获取索引。

for…of可以与数组的索引相关联,通过数组的entries()方法,可以同时获取索引和值。

// 对象
const obj = { a: 1, b: 2, c: 3 };
 
// 使用 for...in 遍历
for (let key in obj) {
  console.log(key, obj[key]); // 输出 a=1, b=2, c=3
}
 
// 数组
const arr = [10, 20, 30];
 
// 使用 for...of 遍历
for (let value of arr) {
  console.log(value); // 输出 10, 20, 30
}
 
// 使用 for...of 遍历数组索引和值
for (let [index, value] of arr.entries()) {
  console.log(index, value); // 输出 0=10, 1=20, 2=30
}
相关文章
|
1月前
|
存储 缓存 移动开发
uinapp的setStorageSync和setStorage的区别
uinapp的setStorageSync和setStorage的区别
|
2月前
|
安全 数据安全/隐私保护 网络架构
CAPWAP 和 LWAPP 的区别
【8月更文挑战第24天】
57 0
|
4月前
|
索引
for each和for of的区别
for each和for of的区别
||、&&、!的使用与区别
||、&&、!的使用与区别
123 0
|
C语言
%C和%S区别
%C和%S区别
255 0
写出 && 和 & 的区别。
写出 && 和 & 的区别。
95 0
|
存储 前端开发 Java
@SessionAttributes 和 @SessionAttribute的区别
@SessionAttributes 和 @SessionAttribute的区别
|
新零售 网络协议 网络安全
常用的高防有哪几类?主要的区别是什么?
有一些用户受到DDOS攻击的时候,不知道自己该选择什么样的高防来防御攻击,墨者安全今天主要讲下常用的高防有哪几类?以及主要的区别?高防主要分为HTTPS高防、TCP高防、CDN高防、香港高防、海外高防。