Js数组对象循环遍历总结

let treeList = [];
      //treeList = res.data.map(item => item.id);  //map返回item.id
      treeList = res.data.forEach(item => item.id); //forEach不返回item.id,只打印
      treeList = res.data.forEach(item => {
        console.log(item.id);
      });
      console.log(treeList);

一、对象的遍历
对象属性的遍历，方法有以下几种
1.for…in
2.Object.keys()
3.Object.getOwnPropertyNames()
小结
1.for…in 遍历的是对象的可枚举属性，包括原型
2.Object.keys 遍历的是对象可枚举属性，不包括原型
3.Object.getOwnPropertNames 遍历的是对象的所有属性，不包括原型
二、数组的遍历
（一）数组项的全部遍历，方法有以下几种
1.for 循环

var array = [1,4,7,9]
for (let i = 0, len = array.length; i < len; i++) {
    console.log(array[i]) // 输出 1 4 7 9

2.forEach() 方法 (ES5)

var array = ['a', 'b', 'c']
array.forEach(function(item, index, array) { // 处理函数作为参数
    console.log(index + ' is ' + item)
})
//输出
0 is a
1 is b
2 is c

3.map() 方法 (ES5)

var array = ['a', 'b', 'c']
var result = array.map(function(item, index, array) { // 处理函数作为参数
    console.log(index + ' is ' + item) // 过程处理
    return item + index // 返回结果
})
console.log(result) // 输出["a0", "b1", "c2"]

4.for…of (ES6)

var array = ['a', 'b', 'c']
for (let item of array) {
    console.log(item) // 输出 a b c
}

5.for…in (特殊方式)

var array = ['a', 'b', 'c']
// for...in遍历的是对象属性，数组中的索引就相当于对象的属性，因此枚举出来的是索引
for (let index in array) {
    console.log(index + ':' + array[index])
}

（二）数组项的有操作的遍历，方法有以下几种
1.filter() 方法 (ES5)

function getEven(item, index, array) {
    return item % 2 === 0
}
var array = [1, 2, 3, 5, 8]
var evenArray = array.filter(getEven)
console.log(evenArray) // 输出 [2, 8]

2.every() 方法 (ES5)

var array = [1, 2, 3, 5, 8]
// 判断是否每个元素都小于3
var result = array.every(function(item, index, array) {
    console.log('processing: ' + item)
    return item < 3
})
console.log('result: ' + result)

3.some() 方法 (ES5)

var array = [1, 2, 3, 5, 8]
// 判断是否存在小于3的元素
var result = array.some(function(item, index, array) {
    console.log('processing: ' + item)
    return item < 3
})
console.log('result: ' + result)

4.reduce() 方法 (ES5)

function add(prev, cur, index, array) {
    return prev + cur
}
var array = [1, 2, 3, 5, 8]
var sum = array.reduce(add)
var sumWithBase = array.reduce(add, 100) // 提供初始值
console.log(sum, sumWithBase) // 输出 19 119

5.reduceRight() 方法 (ES5)

function sub(prev, cur, index, array) {
    return prev - cur
}
var array = [1, 2, 3, 5, 8]
var leftSub = array.reduce(sub) // 1-2-3-5-8 = -17
var rightSub = array.reduceRight(sub) // 8-5-3-2-1 = -3
console.log(leftSub, rightSub) // 输出 -17 -3

小结

1. 除了reduce, reduceRight之外，各高阶遍历函数(forEach, map, filter, every, some)的处理函数的参数顺序都是item, index, array。reduce, reduceRight因为聚合的原因，前两个参数是数组的项。
   这好理解，我们最需要的首先是数组的项，其次是它的索引，最后是数组自身引用
2. 2个聚合函数reduce, reduceRight；2个检测函数every, some；3个全遍历函数forEach, map, filter。

三、循环
1.find(ES6) 循环 (返回第一个找到的元素) include \find\findIndex
2.while 循环
3.do while 循环