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
}
相关文章
|
7月前
|
索引
for each和for of的区别
for each和for of的区别
|
7月前
a++与++a的区别
a++与++a的区别。
43 4
|
7月前
|
数据可视化 数据挖掘
jupternotebook和jupterLab有什么区别?
jupternotebook和jupterLab有什么区别?
907 0
|
存储
逻辑移位与算术移位的区别
用一句简单的话来说就是:逻辑移位不需要考虑符号位,算术移位需要考虑符号位,我们都知道。数在计算机中都是以补码的形式来存储的,这才造成了逻辑移位和算术移位的的差别。
346 0
|
Java
While 与 do while 的区别
While 与 do while 的区别
80 0
|
算法 编译器 Linux
C与C++的区别
C与C++的区别
127 0
|
JavaScript 前端开发 索引
for...in和for...of的区别
前言 在JavaScript中遍历数组通常是使用for...i循环,在ES5具有遍历数组功能的还有forEach、map、filter、some、every、reduce、reduceRight等。 for...in和for...of是两种增强型循环,for...in是ES5标准,在ES6中新增了for...of的循环方式。
119 0
for...in和for...of的区别
|
关系型数据库
Where and Having区别
Where和Having的异同 (1)where是查询返回结果之前进行过滤的 (2)having是查询返回结果之后,对结果进行过滤的 (3)在SQL中增加 HAVING 子句原因是,where关键字无法与聚合函数一起使用,having子句常跟group by一同使用,过滤分组...
1506 0

热门文章

最新文章