JS中数组的方法总结

首先我们定义一个数组,里面的内容是1,2,3,4。以这个数组为例

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

push()

作用： 在数组的末尾添加一个或多个元素
返回值：添加数据后数组的新长度
注意： 改变原数组
示例代码:

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

unshift()

作用： 在数组的开头添加一个或多个元素
返回值：添加数据后数组的新长度
注意： 改变原数组
示例代码:

let newArr = arr.unshift(-1, 0)
console.log(newArr) //6
console.log(arr) //[-1,0,1,2,3,4]

pop()

作用：删除数组末尾的一个元素
返回值：被删除的元素
注意：改变原数组
示例代码:

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

shift()

作用：删除数组开头的一个元素
返回值：被删除的元素
注意：改变原数组
示例代码:

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

reverse()

作用：倒置数组元素
返回值：倒置以后的数组
注意：改变原数组
示例代码:

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

slice()

作用：选取数组的一部分，并返回一个新数组
参数:1从哪个角标开始截取,2到哪个角标结束(不包含这个角标的元素)
返回值:开始截取的元素和结束截取的元素的前一个元素
注意点:第二个参数可选,如果不写,默认截取到元素最后
注意：不改变原数组
示例代码:

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

splice()

作用：从数组中删除元素,并返回被删除的结果
参数：1开始删除元素的角标,2要删除几个元素,3把元素删除之后要替换的元素
返回值:含有被删除的元素数组
注意：改变原数组
示例代码:

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

concat()

作用： 连接两个或更多的数组，并返回结果
返回值:拼接之后的数组
注意：不改变原数组
示例代码:

let arr1 = ['张三','李四']
let newArr = arr.concat(arr1)
console.log(newArr) //[1, 2, 3, 4, "张三", "李四"]
console.log(arr) //[1, 2, 3, 4]

join()

作用： 把所有元素放入字符串,并用指定分隔符进行分隔,如果不指定,默认是逗号(,)
返回值: 分隔后的字符串
注意：不改变原数组
示例代码:

let newArr = arr.join('%')
console.log(newArr) //1%2%3%4
console.log(arr) //[1,2,3,4]

sort()

作用：用于对数组的元素进行排序
返回值: 经过排序后的数组
注意：改变原数组
示例代码:

let arr = [3,4,2,1]
let newArr = arr.sort((n1, n2) => {
 return n1 - n2
})
console.log(newArr) //[1,2,3,4]
console.log(arr) //[1,2,3,4]

Array.from()

作用：将一个类数组对象或者可遍历对象转换成一个真正的数组
返回值: 转换之后的真数组
示例代码:

let arr = {
 '0': 'a',
 '1': 'b',
 '2': 'c',
 length: 3
};
let newArr= Array.from(arr)
console.log(newArr) // ['a', 'b', 'c']
console.log(arr) //{0: "a", 1: "b", 2: "c", length: 3}

Array.of()

作用：将一组值，转换为数组
示例代码:

Array.of(1, 2, 3)
 console.log(Array.of(1, 2, 3)) //[1,2,3]

find()

作用：查找数组内元素，找到第一个符合条件的数组成员，返回该成员的值，如果没有找到，返回undefined
参数：回调函数
示例代码:

let arr = [1,2,3,4]
let newArr = arr.find((item,index,arr)=>{
  return item>2
})
console.log(newArr) //3
console.log(arr) //[1,2,3,4]

findIndex()

作用：返回第一个符合条件的数组成员的位置(下标)，如果所有成员都不符合条件，则返回-1
参数：回调函数
示例代码:

let arr = [1,2,3,4]
let newArr = arr.findIndex((item,index,arr)=>{
  return item>2
})
console.log(newArr) //2
console.log(arr) //[1,2,3,4]

fill()

作用：给数组填充内容
参数：
1.value 必需。填充的内容
2.start 可选。开始填充位置
3.end 可选。停止填充位置 (默认为 Array.length)
示例代码:

let arr = [1, 2, 3, 4]
let newArr = arr.fill('张三',2,4)
console.log(newArr) //[1, 2, "张三", "张三"]
console.log(arr) //[1, 2, "张三", "张三"]

注意:如果只传一个值，那么默认就是把原有的值替换成你所传的值

let newArr = arr.fill('张三')
console.log(newArr) //["张三", "张三", "张三", "张三"]