JavaScript循环

JavaScript提供了许多遍历循环的方法。本教程介绍了现代JavaScript中的所有各种循环可能性

介绍

JavaScript提供了许多遍历循环的方法。本教程通过一个小示例和主要属性说明了每个示例。

for

const list = ['a', 'b', 'c']
for (let i = 0; i < list.length; i++) {
  console.log(list[i]) //value
  console.log(i) //index
}
  • 您可以打断for循环使用break
  • 您可以快进至下一个迭代for循环使用continue

每次

在ES5中引入。给定一个数组,您可以使用以下方法遍历其属性list.forEach()

const list = ['a', 'b', 'c']
list.forEach((item, index) => {
  console.log(item) //value
  console.log(index) //index
})

//index is optional list.forEach(item => console.log(item))

不幸的是,您无法摆脱这种循环。

do...while

const list = ['a', 'b', 'c']
let i = 0
do {
  console.log(list[i]) //value
  console.log(i) //index
  i = i + 1
} while (i < list.length)

您可以打断while循环使用break

do {
  if (something) break
} while (true)

您可以使用跳转到下一个迭代continue

do {
  if (something) continue

//do something else } while (true)

while

const list = ['a', 'b', 'c']
let i = 0
while (i < list.length) {
  console.log(list[i]) //value
  console.log(i) //index
  i = i + 1
}

您可以打断while循环使用break

while (true) {
  if (something) break
}

您可以使用跳转到下一个迭代continue

while (true) {
  if (something) continue

//do something else }

与...的区别do...while就是它do...while始终至少执行一次其循环。

for...in

迭代对象的所有可枚举属性,并提供属性名称。

for (let property in object) {
  console.log(property) //property name
  console.log(object[property]) //property value
}

for...of

ES6介绍了for...of循环,结合了forEach的简洁性和打破能力:

//iterate over the value
for (const value of ['a', 'b', 'c']) {
  console.log(value) //value
}

//get the index as well, using entries() for (const [index, value] of [‘a’, ‘b’, ‘c’].entries()) { console.log(index) //index console.log(value) //value }

注意使用const。该循环在每次迭代中都会创建一个新的作用域,因此我们可以放心地使用它来代替let

for...infor...of

与...的区别for...in是:

  • for...of 遍历属性值
  • for...in 迭代属性名称

免费下载我的JavaScript初学者手册


更多js教程: