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