for of循环获取index索引值,并且修改自身元素

for of多数使用场景是这样子的:

let arr = [1, 2, 3, 4]
for(let item of arr) {
  console.log(item)
}

这样就能拿到里面每一项的值了,但是是拿不到每一项的索引值的,并且也不能对自身元素进行修改,看下例子:

let arr = [1, 2, 3, 4]
for(let item of arr) {
  item = item * 10
}
console.log(arr) // [ 1, 2, 3, 4 ]

发现并没能修改,如果是对象数组的话,是可以对对象里面的属性进行修改的

如果我们想使用for of获取index值、或者修改原数组,就可以使用entries方法了


entries()方法 返回一个给定对象自身可枚举属性的键值对数组,其排列与使用for...in 循环遍历该对象时返回的顺序一致(区别在于for...in循环也枚举原型链中的属性)

简单说就是Object.entries()可以把一个对象的键值以数组的形式遍历出来,结果和for...in一致,但不会遍历原型属性

下面这样子就可以获取到index索引,并且通过索引修改原数组喽

let arr = [1, 2, 3, 4]
for(let [index, value] of arr.entries()) {
  arr[index] = value * 10
}
console.log(arr) // [ 10, 20, 30, 40 ]
### 回答1: 在 JavaScript 中,`for-of` 循环用于遍历可迭代对象(包括 Array、Map、Set、String 等)的。与 `for-in` 循环相比,`for-of` 循环有以下优点: 1. `for-of` 循环遍历的是对象的,而 `for-in` 循环遍历的是对象的键,所以 `for-of` 循环更适合遍历数组或其他可迭代对象。 2. `for-of` 循环不会遍历对象原型链上的属性,只会遍历实例自身的属性,这使得它更加安全。 3. `for-of` 循环提供了一种简单、简洁的方法来遍历可迭代对象的,使用起来更加方便。 举个例子,以下是使用 `for-of` 循环遍历数组的例子: ``` const arr = [1, 2, 3, 4, 5]; for (const value of arr) { console.log(value); } ``` 输出结果为: ``` 1 2 3 4 5 ``` 另外,如果你希望同时获取数组的索引,可以使用 `for-in` 循环,例如: ``` const arr = [1, 2, 3, 4, 5]; for (const index in arr) { console.log(index, arr[index]); } ``` 输出结果为: ``` 0 1 1 2 2 3 3 4 4 5 ``` 但是需要注意的是,`for-in` 循环同时会遍历数组的所有可枚举属性,包括原型链上的属性 ### 回答2: JavaScript中的for...of循环是ES6中引入的一种遍历数组、类数组对象和迭代器对象的新方法。与传统的for循环或forEach方法相比,for...of循环有以下好处: 1. 语法简洁:for...of循环不需要像传统的for循环一样手动维护循环变量和循环条件,使用起来更加简洁明了。 2. 直接遍历:for...of循环迭代的是数组或类数组对象的每一个元素,而不是下标或键。这样可以省去使用下标或键获取元素的步骤,提高了代码的可读性。 3. 支持迭代器对象:for...of循环可以遍历任何实现了迭代器协议(Iterator Protocol)的对象。这样就可以遍历使用生成器函数生成的迭代器对象,或者自定义实现迭代器协议的对象。 4. 避免循环过程中修改引起的问题:传统的for循环循环过程中可能会修改循环变量,导致循环出错或陷入死循环。而for...of循环循环过程中无法修改迭代的对象和循环变量,可以避免此类问题的发生。 5. 适用性广泛:for...of循环适用于遍历任何可迭代的对象,包括数组、类数组对象(如DOM集合)和字符串等。它更加灵活,可以应用于各种情况下的遍历需求。 总之,for...of循环JavaScript中的好处是语法简洁、直接遍历、支持迭代器对象、避免循环过程中修改引起的问题,并且适用性广泛。它是一种更加方便、可读性更强的遍历方式,为开发者提供了更好的编程体验。 ### 回答3: 在JavaScript中,for of循环是一种遍历数组或者可迭代对象的循环方式,其主要好处如下: 1. 语法简洁明了:相比于传统的for循环或者forEach方法,for of循环的语法非常简洁明了,可以更加轻松地对数组或者可迭代对象进行遍历。 2. 支持迭代所有可迭代对象:与for循环只能遍历数组的特点不同,for of循环支持遍历各种可迭代对象,包括字符串、数组、Map、Set等。 3. 可以使用break和continue:与forEach方法不同,for of循环可以使用break和continue关键字来中断或继续循环。这在需要根据某些条件跳出循环或者跳过当前迭代时非常有用。 4. 可以获取而不是索引:在for循环中,我们需要使用索引获取数组中的,而在for of循环中,直接通过变量即可获取当前迭代的,提高了代码的可读性和可维护性。 5. 支持自定义迭代器:通过使用Symbol.iterator方法,我们可以为自定义对象实现迭代器,然后就可以在for of循环中使用该对象进行迭代。 总之,for of循环JavaScript中一种简洁、灵活且功能强大的循环方式,可以更加方便地遍历各种可迭代对象,提高代码的可读性和可维护性。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

会说法语的猪

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值