数组方法

2023-03-24 19:27:15

concat

用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。

const array1 = ['a', 'b', 'c']
const array2 = ['d', 'e', 'f']
const array3 = array1.concat(array2)

console.log(array3)
// Expected output: Array ["a", "b", "c", "d", "e", "f"]

entries

返回一个新的数组迭代器对象，该对象包含数组中每个索引的键/值对。

const array1 = ['a', 'b', 'c']

const iterator1 = array1.entries()

console.log(iterator1.next().value)
// Expected output: Array [0, "a"]

console.log(iterator1.next().value)
// Expected output: Array [1, "b"]

filter

将通过所提供函数实现的测试的所有元素的浅拷贝返回

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present']

const result = words.filter(word => word.length > 6)

console.log(result)
// Expected output: Array ["exuberant", "destruction", "present"]

flat

按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回

const arr1 = [0, 1, 2, [3, 4]]

console.log(arr1.flat())
// Expected output: Array [0, 1, 2, 3, 4]

const arr2 = [0, 1, 2, [[[3, 4]]]]

console.log(arr2.flat(2))
// Expected output: Array [0, 1, 2, Array [3, 4]]

join

将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串，用逗号或指定的分隔符字符串分隔。如果数组只有一个元素，那么将返回该元素而不使用分隔符

const elements = ['Fire', 'Air', 'Water']

console.log(elements.join())
// Expected output: "Fire,Air,Water"

console.log(elements.join(''))
// Expected output: "FireAirWater"

console.log(elements.join('-'))
// Expected output: "Fire-Air-Water"

reduce

对数组中的每个元素按序执行一个由您提供的 reducer 函数，每一次运行 reducer 会将先前元素的计算结果作为参数传入，最后将其结果汇总为单个返回值

第一次执行回调函数时，不存在“上一次的计算结果”。如果需要回调函数从数组索引为 0 的元素开始执行，则需要传递初始值。否则，数组索引为 0 的元素将被作为初始值 initialValue，迭代器将从第二个元素开始执行（索引为 1 而不是 0）

const arr = [1, 2, 3, 4]

// 0 + 1 + 2 + 3 + 4
const init = 0
const result = arr.reduce((accumulator, current) => accumulator + current, init)

console.log(result)
// Expected output: 10

slice

返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝（包括 begin，不包括end）。原始数组不会被改变

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// Expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// Expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// Expected output: Array ["bison", "camel", "duck", "elephant"]

console.log(animals.slice(-2));
// Expected output: Array ["duck", "elephant"]

console.log(animals.slice(2, -1));
// Expected output: Array ["camel", "duck"]

console.log(animals.slice());
// Expected output: Array ["ant", "bison", "camel", "duck", "elephant"]

对数组本身改变的一些方法

shift()

从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度

unshift()

将一个或多个元素添加到数组的开头，并返回该数组的新长度

fill()

sort()

reverse()

splice

通过删除或替换现有元素或者原地添加新的元素来修改数组，并以数组形式返回被修改的内容。此方法会改变原数组

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// Inserts at index 1
console.log(months);
// Expected output: Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
// Replaces 1 element at index 4
console.log(months);
// Expected output: Array ["Jan", "Feb", "March", "April", "May"]

最后看一下一张非常生动形象的图