数组的常用方法基本上可以归纳为：增、删、改、查，需要注意的是哪些方法会对原数组会产生影响，哪些不会

增

• push()
• unshift()
• splice()
• concat()

push()

push() 方法接收任意的参数，并将它们添加到数组的末尾，返回数组的最新长度

const arr = []
const ret = arr.push('item1', 'item2')
console.log(ret) // 2
console.log(arr) // ['item1', 'item2']

unshfit()

unshift()方法接收任意的参数，并将它们添加的数组的首位，返回数组的最新长度

const arr = ['item1', 'item2']
const ret = arr.unshift('itemA', 'itemB')
console.log(ret) // 4
console.log(arr) // ['itemA', 'itemB','item1', 'item2']

splice()

传入三个参数，分别是开始位置(startIndex)，要删除的元素数量（deleteNum）、插入的元素。返回值为空数组

const colors = ['red', 'blue', 'yellow']
const ret = colors.splice(1, 0, 'green', 'origin')
console.log(ret) // []
console.log(colors) // [ 'red', 'green', 'origin', 'blue', 'yellow' ]

concat()

首先它会先创建一个当前数组的副本， 然后把它的参数添加到副本的末尾，最后返回这个新构建的数组，不会影响原数据

const colors = ['red', 'yellow', 'blue']
const colorsNew = colors.concat('black', ['origin', 'green', ['greenyellow']])
console.log(colors) // [ 'red', 'yellow', 'blue' ]
console.log(colorsNew) // [ 'red', 'yellow', 'blue', 'black', 'origin', 'green', ['greenyellow']]

删

• pop()
• shift()
• splice()
• slice()

pop()

pop()方法用于删除数组的最后一个元素，同时减少数组的length值，返回被删除的元素

const colors = ['red', 'blue', 'yellow']
const color = color.pop()
console.log(colors)  // [ 'red', 'blue' ]
console.log(color)  // yellow

shift()

shift()方法用于删除数组的第一个元素，同时减少数组的length值，返回被删除的元素

const colors = ['red', 'blue', 'yellow']
const color = color.pop()
console.log(colors)  // [ 'blue', 'yellow' ]
console.log(color)  // red

splice()

splice传入两个参数，分别是开始位置，删除元素的数量，返回被删除元素的数组

const colors = ['red', 'blue', 'yellow']
const color = colors.splice(0,2)
console.log(colors); // [ 'yellow' ]
console.log(color); // [ 'red', 'blue' ]

slice()

slice() 创建一个包含原有数据的新数组，接收两个参数，分别是开始位置和结束位置，不会影响原有数组

const colors = ['red', 'blue', 'yellow', 'green', 'black', 'white']
const colors1 = colors.slice(1);
const colors2 = colors.slice(1, 4);
console.log(colors); // [ 'red', 'blue', 'yellow', 'green', 'black', 'white' ]
console.log(colors1); // [ 'blue', 'yellow', 'green', 'black', 'white' ]
console.log(colors2); // [ 'blue', 'yellow', 'green' ]

改

• splice()

splice()

传入三个参数，分别是开始位置(startIndex)，要删除的元素数量（deleteNum）、插入的元素。返回值为空数组

const colors = ['red', 'blue', 'yellow']
const ret = colors.splice(1, 0, 'green', 'origin')
console.log(ret) // []
console.log(colors) // [ 'red', 'green', 'origin', 'blue', 'yellow' ]

查

• indexOf()
• includes()
• find()

indexOf()

indexOf() 返回查找元素在数组中的位置，不在返回-1

const nums = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
const index = nums.indexOf(3)
const notFind = nums.indexOf(9)
console.log(index) // 3
console.log(notFind) // -1

includes()

返回查找的元素是否存在数组中，存在返回Boolean

const nums = [0, 1, 2, 3, 4, 5, 6, 7, 8]
const index = nums.includes(3)
const notFind = nums.includes(9)
console.log(index) // true
console.log(notFind) // false

find 返回第一个匹配的元素

const peopels = [
  {
    age: 22,
    name: 'Nick',
  },
  {
    age: 23,
    name: 'Bob'
  },
  {
    age:21,
    name: 'Tom'
  }
]
const ret = peopels.find((element, index, array) => element.age < 25)
console.log(ret);  // { age: 22, name: 'Nick' }

排序方法

数组有两种方法对数组重新排序：

• reverse()
• sort()
  reverse()顾名思义，将数组元素反向排列

const val = [1, 3, 2, 4, 9, 6]
val.reverse()
console.log(val) // [ 6, 9, 4, 2, 3, 1 ]

sort()接收一个比较函数，用于判断哪个元素应该排在前面

function compare(v1, v2) {
  if(v1 < v2) {
    return -1
  } else if(v1 > v2) {
    return 1
  } else {
    return 0
  }
}
const values = [1, 3, 2, 4, 9, 6]
values.sort(compare);
console.log(values); // [ 1, 2, 3, 4, 6, 9 ]

转换方法

常见的转换方法有：

• join()
  join 方法接收一个参数，即字符串分隔符，返回包含所有项的字符串

const values = ['one', 'tow', 'three']
const ret = values.join(',')
console.log(ret) // one,tow,three