find, forEach, filter, map都可以遍历数组

arr.find((e, i) => {
	console.log(e, i)
})
arr.forEach((e, i) => {
	console.log(e, i)
})
arr.filter((e, i) => {
	console.log(e, i)
})
arr.map((e, i) => {
	console.log(e, i)
})

区别：
    1.只有find里达到条件时会中断循环，其它的不管满不满足条件，都不中       断。
   2.如果有return返回值：
    (1) find 会返回符合条件的第一个值，如果都没有符合条件，则返回undefined

let arr = [1,2,3]
let a = arr.find((e, i) => {
	return e < 3
})
let b = arr.find((e, i) => {
	return e > 3
})
console.log(a) // 1 
console.log(b) // undefined

// 中断测试
arr.find((e, i) => {
  console.log(e)
  return e > 1
})
// 控制台打印1，2，因为2 > 1 满足条件，中断循环

(2) forEach，不管有没有return, 返回值都是undefined，一般只做简单的遍历循环用（return 不能打断forEach循环）

let arr = [1,2,3]
let b = arr.forEach((e, i) => {
  return e
})
console.log(b) // undefined

let c = arr.forEach((e, i) => {
  console.log(e)
  return true
})
// 控制台打印 1， 2， 3

(3) filter, 返回值是一个新数组，数组里的元素是原数组的元素，如果条件都不满足，则返回空数组(不写return也会返回空数组)

let arr = [1,2,3]
let b = arr.filter((e, i) => {
  return e > 1
})
let c = arr.filter((e, i) => {
  return e > 4
})
let d = arr.filter((e, i) => {
  return true
})
let e = arr.filter((e, i) => {
  return false
})
let f = arr.filter((e, i) => {
  // 不写return
})
console.log(b) // [2, 3]
console.log(c) // []
console.log(d) // [1, 2, 3]
console.log(e) // []
console.log(f) // []

(4) map，返回新数组，新数组里的元素为return字段后面的值，就是你return 啥，值就是啥（不写return,则返回的数组里面的值都是undefined,如最后一个例子）

let arr = [1,2,3]
    let a = arr.map((e, i) => {
      return e
    })
    let b = arr.map((e, i) => {
      return e * 2
    })
    let c = arr.map((e, i) => {
      return e > 1
    })
    let d = arr.map((e, i) => {
      return e > 4
    })
    let e = arr.map((e, i) => {
      return true
    })
    let f = arr.map((e, i) => {
      return false
    })
    let g = arr.map((e, i) => {
      
    })
    console.log(a) // [1, 2, 3]
    console.log(b) // [2, 4, 6]
    console.log(c) // [false, true, true]
    console.log(d) // [false, false, false]
    console.log(e) // [true, true, true]
    console.log(f) // [false, false, false]
    console.log(g) // [undefined, undefined, undefined]

重点，那么它们会不会改变原数组：

var a = [1, 2, 3, 4]
    var b = [{x: 1}, {x: 2}, {x: 3}, {x: 4}]
    var m = [{x: 1}, {x: 2}, {x: 3}, {x: 4}]
    var n = [{x: 2}, {x: 2}, {x: 2}, {x: 2}]
// filter 会不会改变原数组------------------------------------- start
    // (1) filter遍历子元素为 基本类型 的数组
    var c = a.filter(e => {
      e = 6
      return e 
    })
    console.log(c) // [1, 2, 3, 4]
    console.log(a) // [1, 2, 3, 4]

    // (2) filter遍历子元素为 引用类型 的数组
    var d = b.filter(e => {
      e.x = 6
      return e
    })
    console.log(d) // [{x: 6}, {x: 6}, {x: 6}, {x: 6}]
    console.log(b) // [{x: 6}, {x: 6}, {x: 6}, {x: 6}]

  // 结果，fliter遍历的数组，如果操作子元素，子元素如果是基本类型，那么原数组并不改变,如果是引用类型，会改变

// filter 会不会改变原数组------------------------------------- end

// map 会不会改变原数组------------------------------------- start
    // (1) filter遍历子元素为 基本类型 的数组
    var j = a.map(e => {
      e = e +'hello'
      return e
    })
    console.log(j) // ["1hello", "2hello", "3hello", "4hello"]
    console.log(a) // [1, 2, 3, 4]

    var k = m.map(e => {
      e.x = 3
      return e
    })
    console.log(k) // [{x: 3}, {x: 3}, {x: 3}, {x: 3}]
    console.log(m) // [{x: 3}, {x: 3}, {x: 3}, {x: 3}]
    // 结果，map遍历的数组，如果操作子元素，子元素如果是基本类型，那么原数组并不改变,如果是引用类型，会改变
// map 会不会改变原数组------------------------------------- end

// forEach---------------------------------------------------start
  var o = a.forEach(e => {
    e = e* 8
  })
  var p = n.forEach(e => {
    e.x = e.x*8
  })
  console.log(a) // [1, 2, 3, 4]
  console.log(n) // [{x: 16}, {x: 16}, {x: 16}, {x: 16}]
/* 总结，
  (1) 如果在遍历过程中操作子元素，如果子元素是引用类型，那么不管是filter,map,forEach等等，原数组会改变；
  如果是基本类型，操作了元数据也不会发生变化； =》 这是js数据类型指向的知识
  （2）当然，如果在遍历过程中没有操作到子元素，那肯定是不会改变的
  */