js数组方法及应用，超详细

背景：开发中用到的数组方法，记录使用

不改变数组的方法

map，filter，forEach，reduce这几个遍历方法也不会改变原数组。参考链接
some，every详解，也不会改变原数组。参考链接

concat

连接两个或更多的数组，并返回一个新数组

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combined = arr1.concat(arr2); // [1, 2, 3, 4, 5, 6]

find

返回第一个符合条件的元素

const numbers = [1, 2, 3, 4, 5];
const found = numbers.find(num => num > 3);
console.log(
  numbers,  // [1, 2, 3, 4, 5]
  found // 4
)

findIndex

返回第一个符合条件的元素下标

const numbers = [1, 2, 3, 4, 5];
const found = numbers.findIndex(num => num > 3);
console.log(
  numbers,  // [1, 2, 3, 4, 5]
  found // 3
)

join

数组转字符串

var arr = [10, 20, 30, 40, 50, 60]
res = arr.join(",")
console.log(arr)

slice

截取数组，返回数组的一个浅拷贝。

const arr = [1, 2, 3, 4, 5];
const subArray = arr.slice(1, 4); // [2, 3, 4]
console.log(
  arr,  // [1, 2, 3, 4, 5]
  subArray // [2, 3, 4]
)

indexOf

搜索数组中的元素，并返回首次出现所在的位置

var arr = [10, 20, 10, 30, 20, 50, 60]
res = arr.indexOf(20)
console.log(res); // 1

includes（es7）

查找数组中是否包含某个元素，有，返回true，没有，返回false

var arr = [1, 2, 3, 4, 5, NaN];
const optArr = arr.includes(NaN);
console.log(
  arr, // [1, 2, 3, 4, 5, NaN]
  optArr // true
);

lastIndexOf

从后开始检查数组中有没有出现这个数值

var arr = [10, 20, 10, 30, 40, 50, 60, 10]
// res = arr.lastIndexOf(10) // 7
res = arr.lastIndexOf(10 ,5) // 2

改变原数组

push

数组末尾添加新元素

var arr = [10, 20, 30, 40]
res= arr.push(20)
console.log(arr);//[10,20,30,40,20]

unshift

数组开头添加新元素

var arr = [10, 20, 30, 40]
res= arr.unshift(20)
console.log(arr);//[20,10,20,30,40]

pop

移除数组末尾元素

var arr = [10, 20, 30, 40]
res= arr.pop()
console.log(arr);//[10,20,30]

shift

移除数组开头元素

var arr = [10, 20, 30, 40]
res= arr.shift()
console.log(arr);// [20, 30, 40]

reverse

翻转数组中的元素

var arr = [10, 20, 30, 40]
res = arr.reverse()
console.log(arr); // [40, 30, 20, 10]

sort

数组进行排序

let arr =  [6, 10, 7, 12, 23]
arr.sort((a, b) => a - b);
console.log(arr); // [6, 7, 10, 12, 23]

splice

很强大的数组方法，用于插入、删除或替换数组的元素

• 插入

let arr =  [1, 3, 5, 7, 9, 11, 13]
let handleArr = arr.splice(1, 0, 66);
console.log(arr);  // [1, 66, 3, 5, 7, 9, 11, 13]
console.log(handleArr); // []

• 删除

let arr =  [1, 3, 5, 7, 9, 11, 13]
let handleArr = arr.splice(0, 2); 
console.log(arr);  // [5, 7, 9, 11, 13]
console.log(handleArr); // [1, 3]

• 替换

let arr =  [1, 3, 5, 7, 9, 11, 13]
let handleArr = arr.splice(1, 3, 66);
console.log(arr); // [1, 66, 9, 11, 13]
console.log(handleArr);  // [3, 5, 7]

copyWithin

在数组内部，将一段元素序列移动到另一个位置，覆盖原有元素。

• target 必需。到目标索引位置。
• start 可选。源的开始索引，默认为 0。
• end 可选。源的结束索引，默认为数组的长度。

var arr = [1, 2, 3, 4, 5, 6, 7];
const optArr = arr.copyWithin(2,1,5);
console.log(
  arr,  // [1, 2, 2, 3, 4, 5, 7]
  optArr // [1, 2, 2, 3, 4, 5, 7]
);

fill

特定值填充数组中的一个或多个元素

let arr = [1, 2, 3, 4, 5];
// 0:要替换元素 1：起始位置（包含）2：结束位置（不包含）
let aa = arr.fill(0,1,3);
console.log(arr);// [1, 0, 0, 4, 5];
console.log(aa);// [1, 0, 0, 4, 5];

有问题欢迎指正交流
如果对你有帮助，也赏个三连呗🙇‍🙇‍，不胜感激Thanks♪(･ω･)ﾉ