JavaScript数组方法汇总

数组的方法经常在项目中用到，但有的方法及注意事项可能会有所遗忘，所以，在这里简单的汇总记录下

arr.push() 从后面添加元素，返回值为添加完后的数组的长度

  let arr = [1, 2, 3, 4]
  console.log(arr.push(5)) // 5
  console.log(arr) // [1, 2, 3, 4, 5]

arr.pop() 从后面删除元素，只能是一个，返回值是删除的元素

  let arr = [1, 2, 3, 4]
  console.log(arr.pop()) // 4
  console.log(arr) // [1, 2, 3]

arr.unshift() 从前面添加元素, 返回值是添加完后的数组的长度

  let arr = [1, 2, 3, 4]
  console.log(arr.unshift(5)) // 5
  console.log(arr) // [5, 1, 2, 3, 4]

arr.shift() 从前面删除元素，只能删除一个返回值是删除的元素

  let arr = [1, 2, 3, 4]
  console.log(arr.shift()) // 1
  console.log(arr) // [2, 3, 4]

arr.splice(i,n) 删除从i(索引值)开始之后的n个元素。返回值是删除的元素

  let arr = [1, 2, 3, 4, 5]
  console.log(arr.splice(2,2)) // [3, 4] 
  console.log(arr) // [1, 2, 5]

arr.concat() 连接两个数组返回值为连接后的新数组，并且不会改变原数组

  let arr = [1, 2, 3, 4, 5]
  console.log(arr.concat([6, 7])) // [1, 2, 3, 4, 5, 6, 7]
  console.log(arr) // [1, 2, 3, 4, 5]

arr.sort() 将数组进行排序,返回值是排好的数组，默认是将元素转换为字符串，然后比较它们的UTF-16代码单元值序列时构建的，不是按照数字大小排序的

  let arr = [2, 10, 6, 1, 4, 22, 3]
  console.log(arr.sort()); // [1, 10, 2, 22, 3, 4, 6]
  console.log(arr.sort((a, b) => a - b)); // [1, 2, 3, 4, 6, 10, 22]
  console.log(arr.sort((a, b) => b - a)); // [22, 10, 6, 4, 3, 2, 1]

arr.reverse() 将数组反转,返回值是反转后的数组

  let arr = [1, 2, 3, 4, 5]
  console.log(arr.reverse())
  console.log(arr)

arr.slice(start,end) 切去索引值start到索引值end的数组，不包含end索引的值，返回值是切出来的数组
```
  let arr = [1, 2, 3, 4, 5]
  console.log(arr.slice(1, 3)) // [2, 3]
  console.log(arr) // [1, 2, 3, 4, 5]
```

arr.forEach((value, index, array) => {}) 遍历数组,无return 即使有return，也不会返回任何值，并且会影响原来的数组

  let arr = [1, 2, 3, 4, 5]
  arr.forEach((value, index, array) => {
    console.log(`value：${value}, index：${index}, array：${array}`)
  })
  /*
    value：1, index：0, array：1,2,3,4,5
    value：2, index：1, array：1,2,3,4,5
    value：3, index：2, array：1,2,3,4,5
    value：4, index：3, array：1,2,3,4,5
    value：5, index：4, array：1,2,3,4,5
  */

  let arr = [1, 2, 3, 4, 5]
  arr.forEach((value, index, array) => {
    value = value * 2
    console.log(`value：${value}, index：${index}, array：${array}`)
  })
  console.log(arr)
  /*
    value：2, index：0, array：1,2,3,4,5
    value：4 index：1, array：1,2,3,4,5
    value：6, index：2, array：1,2,3,4,5
    value：8, index：3, array：1,2,3,4,5
    value：10, index：4, array：1,2,3,4,5

    [1, 2, 3, 4, 5]
  */

  let arr = [1, 2, 3, 4, 5]
  let res = arr.forEach((value, index, array) => {
    arr[index] = value * 2
    return arr
  })
  console.log(arr) // [2, 4, 6, 8, 10]
  console.log(res) // undefined

arr.map((value, index, array) => {}) 映射数组(遍历数组),有 return 返回一个新数组。

  let arr = [1, 2, 3, 4, 5]
  let res = arr.map((value, index, array) => {
    value = value * 2
    console.log(`value：${value} index：${index} array：${array}`)
    return value
  })
  console.log(arr);
  console.log(res);
  /*
    value：2, index：0, array：1,2,3,4,5
    value：4 index：1, array：1,2,3,4,5
    value：6, index：2, array：1,2,3,4,5
    value：8, index：3, array：1,2,3,4,5
    value：10, index：4, array：1,2,3,4,5

    [1, 2, 3, 4, 5]
    [2, 4, 6, 8, 10]
  */

arr.filter((value, index) => {}) 过滤数组，返回一个满足要求的数组

  let arr = [1, 2, 3, 4, 5]
  console.log(arr.filter((value, index) => value < 4 )) // [1, 2, 3]

arr.every((value, index) => {}) 依据判断条件，数组的元素是否全满足，若满足则返回 ture

  let arr = [1, 2, 3, 4, 5]
  console.log(arr.every((value, index) => value < 3)) // false
  console.log(arr.every((value, index) => value < 6)) // true

arr.some((value, index) => {}) 依据判断条件，数组的元素是否有一个满足，若有一个满足则返回 ture

  let arr = [1, 2, 3, 4, 5]
  console.log(arr.some((value, index) => value < 3))
  console.log(arr.some((value, index) => value > 6))

arr.reduce((previousValue, currentValue, index, array) => {} , initialValue) 迭代数组的所有项，累加器，数组中的每个值（从左到右）合并，最终计算为一个值
```
  let arr = [1, 2, 3, 4, 5]
  let res = arr.reduce((preValue, curValue) => preValue += curValue)
  console.log(res) // 15
```
reduce的高级用法
arr.reduceRight((previousValue, currentValue, index, array) => {}, initialValue) 与arr.reduce()功能一样，不同的是，reduceRight()从数组的末尾向前将数组中的数组项做累加。
```
  let arr = [1, 2, 3, 4, 5]
  let res = arr.reduceRight((preValue, curValue) => preValue += curValue)
  console.log(res) // 15
```
参考： reduceRight和reduce

arr.indexOf() 查找某个元素的索引值，若有重复的，则返回第一个查到的索引值若不存在，则返回 -1

  let arr = [1, 2, 3, 4, 5, 6, 6]
  console.log(arr.indexOf(2)) // 1
  console.log(arr.indexOf(6)) // 5
  console.log(arr.indexOf(7)) // -1

arr.lastIndexOf() 和arr.indexOf()的功能一样，不同的是从后往前查找

  let arr = [1, 2, 3, 4, 5, 6, 6]
  console.log(arr.lastIndexOf(2)) // 1
  console.log(arr.lastIndexOf(6)) // 6
  console.log(arr.lastIndexOf(7)) // -1

Array.from() 将伪数组变成数组，就是只要有length的就可以转成数组。 ---es6

  let str = '123456'
  console.log(Array.from(str)) // ['1', '2', '3', '4', '5', '6']
  let obj = {0:'a', 1:'b', length:2}
  console.log(Array.from(obj)) // ['a', 'b']
  let obj = {0:'a', 1:'b'}
  console.log(Array.from(obj)) // []

Array.of() 将一组值转换成数组，类似于声明数组 ---es6
```
  let str = '123456'
  console.log(Array.of(str)) // ['123456']
```

arr.find(((value, index, array) => {})) 找到第一个符合条件的数组成员

  let arr = [1, 2, 3, 4, 5, 6, 6]
  console.log(arr.find((value, index) => value === 3)) // 3

arr.findIndex((value, index, array) => {}) 找到第一个符合条件的数组成员的索引值

  let arr = [1, 2, 3, 4, 5, 6, 6]
  console.log(arr.findIndex((value, index) => value === 6)) // 5

arr.fill(target, start, end) 使用给定的值，填充一个数组, 填充完后会改变原数组
参数： target -- 待填充的元素
　　　 start -- 开始填充的位置-索引
　　　 end -- 终止填充的位置-索引（不包括该位置)
```
  let arr = [1, 2, 3, 4, 5]
  console.log(arr.fil(5, 1, 3)) // [1, 5, 5, 4, 5]
  console.log(arr.fill(5, 2)) // [1, 2, 5, 5, 5]
  console.log(arr.fill(5)) // [5, 5, 5, 5, 5]
  console.log(arr) // [5, 5, 5, 5, 5]
```

arr.includes() 判断数中是否包含给定的值 该方法校验类型

  const arr = ['1', '2', '3', 4, 5, '6', 6]
  console.log(arr.includes('1')) // true
  console.log(arr.includes('2')) // true
  console.log(arr.includes('4')) // false
  console.log(arr.includes(5))   // true
  console.log(arr.includes('6')) // true
  console.log(arr.includes(6))   // true

indexOf()的区别：
1. indexOf()返回的是数值，而includes()返回的是布尔值
2. indexOf() 不能判断NaN，返回为-1 ，includes()则可以判断

arr.keys() 遍历数组的键名

  let arr = [1, 2, 3, 4, 5]
  let arr1 = arr.keys();
  for (const iterator of arr1) {
    console.log(iterator)
  }
  // 0 1 2 3 4

arr.values() 遍历数组键值

  let arr = [1, 2, 3, 4, 5]
  let arr1 = arr.values();
  for (const iterator of arr1) {
    console.log(iterator)
  }
  // 1 2 3 4 5

arr.entries() 遍历数组的键名和键值, 返回迭代数组, 迭代数组中每个值前一个是索引值作为 key，数组后一个值作为 value。
```
  let arr = [1, 2, 3, 4, 5]
  let arr1 = arr.entries();
  for (const iterator of arr1) {
    console.log(iterator)
  }
  // [0,1] [1,2] [2,3] [3,4]
```

arr.copyWithin() 在当前数组内部，将指定位置的数组复制到其他位置，会覆盖原数组项，返回当前数组
参数: target --必选索引从该位置开始替换数组项
　　 start --可选索引从该位置开始读取数组项，默认为0.如果为负值，则从右往左读。
　　 end --可选索引到该位置停止读取的数组项，默认是Array.length,如果是负值，表示倒数

  let arr = [1, 2, 3, 4, 5]
  console.log(arr.copyWithin(1)) // [1, 1, 2, 3, 4]
  console.log(arr.copyWithin(1, 2)) // [1, 3, 4, 5, 5]
  console.log(arr.copyWithin(1, -2)) // [1, 4, 5, 4, 5]
  console.log(arr.copyWithin(1, 2, 3)) // [1, 3, 3, 4, 5]
  console.log(arr.copyWithin(1, 2, -3)) // [1, 3, 3, 4, 5]
  console.log(arr.copyWithin(1, 2, -3)) // [1, 2, 3, 4, 5]
  console.log(arr.copyWithin(1, 2, -2)) // [1, 3, 3, 4, 5]