js中for和forEach的区别

js中for和forEach的区别

• for 循环中可以使用 break、continue，使用 return 报错；forEach 中无法使用 break、continue，可以使用 return 跳出本次循环

    const arr = [1, 2, 3]
    for(let i = 0; i < arr.length; i++) {
      if(i === 0) {
        // return // 报错（return是用来结束函数的）
        // break // 结束for循环
        // continue // 结束本次for循环
      }
      console.log(i)
    }
  
    arr.forEach((item, i) => {
      if(i === 0) {
        // return // 跳出本次循环，不打印 0
        // break、continue 直接代码报红，语法不支持
      }
      console.log(i)
    })
  

• for 循环过程中可以修改索引，forEach不能（此外，forEach也无法通过 item 直接对元素进行修改）

    // ----------- 对索引修改的验证 ----------
    const arr = [1, 2, 3]
    for(let i = 0; i < arr.length; i++) {
      console.log(i) // 跳过对索引1的打印，打印结果 0,2
      i = i + 1
    }
  
    arr.forEach((item, i) => {
      console.log(i) // 打印结果 0,1,2
      i = i + 1
    })
  

    // --------- 对item修改的验证 ---------
    const arr1 = [1, 2, 3]
    for(let i = 0; i < arr1.length; i++) {
      if(i === 1) {
        arr1[i] = 4
      }
    }
    console.log(arr1) // 打印 1,4,3
  
    const arr2 = [1, 2, 3]
    arr2.forEach((item, i) => {
      if(i === 1) {
        item = 4
        // arr2[i] = 4 // 可以使用这种方法改变item，该方法打印 1,4,3
      }
    })
    console.log(arr2) // 打印 1,2,3
  

• for 循环可以控制循环起点，forEach 只能默认从索引 0 开始

• 语法差异

至于 for 循环性能优于 forEach 的说法，因为只是看其他博客这样说，未曾测验或者比较权威的出处，就不写在这里了。