JavaScript数组常见的方法

数组中常见的方法可分为操作方法，排序方法，转换方法，迭代方法

1.操作方法

增

最后一个不会影响到原数组

• push()

• unshift()

• splice()

• concat()

push()接受任意数量的参数，将其加入到数组末尾，并且返回数组的最新长度

let students=['li'] //创建一个数组
let result=students.push('wang','liu') //加入两项数据
console.log(student,result) //['li', 'wang', 'liu'] 3

unshift()接受任意数量参数，将其加入到数组开头(作为整体)，如下面例子里面并非一个一个加入到开头，而是作为整体加入到开头，并且返回数组最新长度

let students=['li'] //创建一个数组
let result=students.unshift('wang','liu') //加入两项数据
console.log(student,result) //['wang', 'liu', 'li'] 3

splice() 传入三个参数，分别是开始的位置，要删除的元素数量，插入的元素，返回删除的部分，若删除0，则返回空数组

let students=['li','wang','liu','wu'] //创建一个数组
​
 let result=students.splice(1,2,'zhou','huang') //从1开始，删除1，2位置的元素，添加zhou，huang
​
 console.log(students,result) //['li', 'zhou', 'huang', 'wu']  ['wang', 'liu']

concat()接受任意数量参数，会创建一个当前数组的副本，然后将接收的参数添加到副本末尾，不会影响到原数组

 let students=['li','wang','liu','wu'] //创建一个数组
​
 let result=students.concat('zhou','huang') //删除1，2位置的元素，添加zhou，huang
​
 console.log(students,result) //(4) ['li', 'wang', 'liu', 'wu'] (6) ['li', 'wang', 'liu', 'wu', 'zhou', 'huang']

删

最后一项不影响原数组：

• pop()

• shift()

• splice()

• slice()

pop()用于删除数组最后一项，同时减少数组的length值，返回被删除的项

let colors = ["red", "green"]
let item = colors.pop(); // 取得最后一项
console.log(item) // green
console.log(colors.length) // 1

shift()用于删除数组开头第一项，增加数组的length值，返回被删除的项

let colors = ["red", "green"]
let item = colors.shift(); // 取得第一项
console.log(item) // red
console.log(colors.length) // 1

splice()只写两个参数即可完成删除操作，返回删除的部分，具体见上述

slice()即数组切割，接受两个参数，左闭右开，不会影响原始数组

let colors = ["red", "green", "blue", "yellow", "purple"];
let colors3 = colors.slice(1, 4);
concole.log(colors3); // green,blue,yellow

改

splice()具体使用参考上述

查

即查找元素，返回元素坐标或者元素值

• indexOf()

• includes()

• find()

indexOf()返回要查找元素在数组中的位置，如果没找到则返回-1

includes()判断数组中是否包含要查找元素，是返回true，否则返回false

find()返回第一个匹配的元素，格式：Array.find((element, index, array) => {}) （我一般都写成箭头函数的格式）

其中element为正在处理的元素，index（可选）当前处理元素在数组中的下标，array（可选）调用find的数组

，{}内即为回调函数的内容，在每个元素上执行，直到找到满足条件的元素位置

2.排序方法

reverse():将数组元素反方向排序

let values = [1, 2, 3, 4, 5];
values.reverse();
alert(values); // 5,4,3,2,1

sort()接受一个比较函数用于判断哪个值应该排在前面

function compare(value1, value2) {
    if (value1 < value2) {
        return -1;
    } else if (value1 > value2) {
        return 1;
    } else {
        return 0;
    }
}
let values = [0, 1, 5, 10, 15];
values.sort(compare);
alert(values); // 0,1,5,10,15

不传入函数则默认从小打大

3.转换方法

join()接受一个参数，即字符串分隔符，返回包含所有项的字符串，python中也有一个一模一样的方法，且做算法题时应用很多

let colors = ["red", "green", "blue"];
alert(colors.join(",")); // red,green,blue
alert(colors.join("||")); // red||green||blue

4.迭代方法

• some()

• every()

• forEach()

• filter()

• map()

some()对数组每一项都运行传入的函数，如果有一项满足函数要求则返回true，

every()对数组每一项都运行传入的函数，只有每一项都满足函数要求才返回true

  let students=[5,4,3,2] //创建一个数组
  const result1 = students.some((item,index) =>{
    if(item>4){
      return true
    }
  })
  const result2 = students.every((item,index) =>{
    if(item>4){
      return true
    }
  })
  console.log(result1) //true
  console.log(result2) //false

forEach()对每一项都运行传入的函数，没有返回值

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
numbers.forEach((item, index, array) => {
    // 执行某些操作
    //直接item+3不会改变number
    //若要改变原数组值
    array[index]+=3
});

filter()对于每一项都会运行传入的函数，函数返回true的会组成新的数组并返回（index和array参数一般省略）

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let filterResult = numbers.filter((item, index, array) => item > 2);
console.log(filterResult); // 3,4,5,4,3

map()堆数组每一项都运行传入的函数，返回每次函数调用的结果构成的数组

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let mapResult = numbers.map((item, index, array) => item * 2);
console.log(mapResult) // 2,4,6,8,10,8,6,4,2

补充reduce()

简单应用：求和，乘积

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((sum,item) => sum + item,0);//设置sum初值为0
const mul = numbers.reduce((x,y) => x*y,1)//设置x初值为1

数组扁平化

const nestedArray = [[1, 2], [3, 4], [5, 6]]; 
const flattenedArray = nestedArray.reduce((accumulator, currentValue) => {  return accumulator.concat(currentValue); }, []);
console.log(flattenedArray); // 输出: [1, 2, 3, 4, 5, 6]

计算数组中最大最小值

const numbers = [10, 5, 20, 15, 30]; 
const max = numbers.reduce((accumulator, currentValue) => {  return Math.max(accumulator, currentValue); }); 
console.log(max); // 输出: 30