Vue前端js循环遍历数组八种方法总结最新

前五种常用，第三种个人觉得常用最多，自己复制代码打印试试

var arr = [1, 2, 3, 4, 5, 6];

    // 第一种   for循环遍历
    var newArr = [];
    for(var i = 0; i < arr.length; i++){
      newArr.push(arr[i])
      console.log(newArr)
    }

    // 第二种 es6语法  arr.forEach()遍历
    var newArr = [];
    arr.forEach((item) => {
      newArr.push(arr[item])
      console.log(newArr)
    })

    // 第三种   Object.keys()遍历
    // (个人推荐比较好用：枚举方法)   (返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性).)
    var newArr = [];
    Object.keys(arr).forEach((item) => {
      newArr.push(arr[item])
      console.log(newArr)
    })


     // 第四种   arr.map(function callback(currentValue[, index[, array]]) 或者这样 array.map(item,index,arr) 
    // currentValue: callback一系列中正在处理的当前元素 index: callback一系列中正在处理的当前元素的索引。array:  map 调用方法的目录
    var newArr = []
    arr.map((item) => {
      newArr.push(arr[item])
      console.log(newArr)
    })

    // 第五种   for...in...遍历
    //  循环遍历对象自身的和继承的可枚举属性(循环遍历对象自身的和继承的可枚举属性(不含Symbol属性).).
    var newArr = []
    for(var i in arr ) {
      newArr.push(arr[i])
      console.log(newArr,'1111111')
    }

    // 第六种   for-of遍历
    //不仅支持数组,还支持大多数类数组对象,例如DOM NodeList对象.
    //也支持字符串遍历,它将字符串视为一系列的Unicode字符来进行遍历.
    var newArr = []
    for(var i of arr){
      newArr.push(arr[i])
      console.log(newArr)
    }

    // 第七种   Object.getOwnPropertyNames(obj) 遍历
    //  返回一个数组,包含对象自身的所有属性(不含Symbol属性,但是包括不可枚举属性).
    var newArr = [];
    Object.getOwnPropertyNames(arr).forEach((item) => {
      newArr.push(arr[item])
      console.log(newArr,'!!!!')
    })

    // 第八种   Reflect.ownKeys(obj)遍历  
    // 返回一个数组,包含对象自身的所有属性,不管属性名是Symbol或字符串,也不管是否可枚举.
    var newArr = [];
    Reflect.ownKeys(arr).forEach((item) => {
      newArr.push(arr[item])
      console.log(newArr) 
      //  数组可以全部打印出来特别！！！！
    })