js数组方法

• 将一个一维数组变成三个三个的二维数组
• 数组的slice（）方法：该方法可以从数组中截取一段新的数组，它接受两个参数，第一个参数是截取的起始位置，第二个参数是截取的结束位置（不包括该位置对应的参数）
• 如果不传递参数，该数组返回一个原数组的一个浅拷贝
• arr.slice(start,end)
• 参数说明：
• start：开始提取的元素的下标，如果是负数，则表示倒数第n个数，如果不指定，则默认从0开始提取
• end：提取元素的结束位置，不包括该位置对应的元素，如果是负数，则表示倒数第 n 个元素。如果不指定该参数，则提取到数组的末尾。
• 注意点：slice() 方法返回的是一个新的数组，它是原数组的一个浅拷贝，也就是说，它只复制了原数组中元素的引用，而不是复制元素本身。
• 如果原数组中的元素是对象或数组，那么新数组中的元素也会引用这些对象或数组，因此对新数组中的元素进行修改也会影响到原数组中的元素。
• 如果要避免这种情况，可以使用深拷贝的方法，例如使用 JSON.parse(JSON.stringify(array)) 进行拷贝。

    function arrTranslate(arr, size) {
    const result = [];
    for (let index = 0; index < arr.length; index = index + size) {
        result.push(arr.slice(index, index + size));
    }
    return result;
}
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
const out = arrTranslate(arr, 3);

• 处理一个数组对象，并且依据其中某一个值对其进行排序
• 一、Map
• Map:是一种新的数据结构，用于保存键值对，其中键和值可以是任意类型，在使用 new Map() 方法创建 Map 对象时，
• 需要传入一个二维数组，其中每个元素都是一个键值对，形式为 [key, value]
• Map对象的基本操作：
• const map = new Map();
  map.set('name', '张三');
• set(key, value)：向 Map 对象中添加一个新的键值对，如果键已经存在，则更新该键对应的值。
• get(key)：获取 Map 对象中指定键对应的值，如果键不存在，则返回 undefined。
• has(key)：判断 Map 对象中是否存在指定的键。
• delete(key)：从 Map 对象中删除指定键对应的键值对。
• 清空所有键值对
• map.clear();
• 获取 Map 的大小
• map.size;
• 二、map
• map方法创建一个新数组，这个新数组由原数组中的每个元素都调用一次提供后的函数后的返回值组成，不会改变原始数组
• 三、reduce

const arr1 = [
    { order: 1, name: "xiaoming", link: '123465ewq' },
    { order: 3, name: "lihua", link: 'wqdas485000' },
    { order: 2, name: "xiaohong", link: '54160sade' },
];
const out1 = arr1
    .reduce((pre, cur) => {
        const map = new Map(pre.map((obj) => [obj.order, obj]));
        map.set(cur.order, cur);
        return [...map.values()];
    }, [])
    .sort((a, b) => {
        return a.order - b.order;
    });

• js数组方法

• 一、map方法:创建一个新数组，这个新数组由原数组中每个元素都去调用一次提供给的函数后的返回值组成的新数组，该方法不会改变原数组

• 语法：map(callback, thisArg)

• callback: 数组中每个元素所需要执行的方法，，执行完该方法后的返回值被添加到一个新数组中，这个函数被调用后将传入以下参数：

•  element：数组中当前正在处理的元素
  

•  index：正在处理的元素的索引
  

• thisArg:

• 返回值：返回一个新数组，每个元素都属回调函数的返回值

• 示例：

// 1.求数组中的每个元素的平方根
const arr2 = [1, 4, 9]
const out2 = arr2.map((item) => Math.sqrt(item))
// 2.使用map重新格式化数组中的对象
const arr3 = [{key: 1, value: 10},{key: 2, value: 20},{key: 3, value: 30}]
const out3 = arr3.map(({key, value}) => ({[key]: value}))

• 二、at方法：该方法接受一个整数值，即索引，返回该索引对应的元素，允许正值和负值，如果是负数的话，从数组的最后一个元素开始倒数

• 语法： at(index)

• index: 需要返回的数组元素的索引

• 返回值：返回该索引对应的元素，如果索引值不在数组索引范围内，则返回undefined

• 注意事项：如果传递的是正数，则array[0] 等价于array.at(0)，均返回第一个元素；如果需要从数组末端开始arry[-1] 不等价于array.at(-1)

• 因为array[-1]会被视为array["-1"]

• 三、concat方法：该方法用于合并两个或者多个数组，这个方法不会改变原有数组，而是返回一个新的数组

• 语法：concat(value0，value1，......, valuen)

• valuen：数组和/或者值，将被合并到一个新的数组中，如果省略了所有参数，concat（）会返回调用这个方法的现存数组的一个浅拷贝

• 返回值：一个新的数组

• 描述：该方法创建一个新数组，调用该数组的对象会被首先放到创建的新数组中。然后，对于每个参数value，会被一次加入到创建的新数组中，

•  但是该方法不会递归到嵌套数组中
  

• 四、entries方法：该方法返回一个新的数组迭代器对象，该对象数组中包含每个索引的键/值对

//示例
//1.迭代索引和元素
const arr4 = ['a','b','c']
for (let [index, element] of arr4.entries()) {
    console.log(index, element)
}

• 四、every方法：测试一个数组内的所有元素是否通过指定函数的测试，最后的返回结果是一个布尔值

• 语法：every(callbackFn) ，every(callbackFn, thisArg)

• 参数：callbackfn：为数组中的每个元素执行的函数。它应该返回一个真值以指示元素通过测试，否则返回一个假值。

• element：数组中当前正在处理的元素

• index：正在处理的元素的索引

• 描述：它为数组中的每一个元素都调用一次指定的函数，知道callbackfn返回一个假值，如果找到这样的元素，会立马返回false并且

•  停止遍历数组，否则，如果每一个元素返回的都是一个真值，every()最后就会返回一个true值
  

• 注意：every()不会改变原数组的值，但是callbackfn可以

•  当开始调用 every() 时，callbackFn 将不会访问超出数组初始长度的任何元素。
  

•  对已访问索引的更改不会导致再次在这些元素上调用 callbackFn。
  

•  如果数组中一个现有的、尚未访问的元素被 callbackFn 更改，则它传递给 callbackFn 的值将是该元素被修改后的值。被删除的元素则不会被访问。
  

• 五、fill方法：方法用一个固定值填充一个数组中从起始索引（默认为 0）到终止索引（默认为 array.length）内的全部元素。它返回修改后的数组

• 语法：fill(value)；fill(value, start)；fill(value, start, end)

• 参数：

• value：用来填充数组元素的值。注意所有数组中的元素都将是这个确定的值：如果 value 是个对象，那么数组的每一项都会引用这个元素。

• start：基于零的索引，从此开始填充

• end：基于零的索引，在此结束填充。fill() 填充到但不包含 end 索引

• 返回值：经 value 填充修改后的数组

• 六、filter方法：建给定数组一部分的浅拷贝，其包含通过所提供函数实现的测试的所有元素

• 语法：filter(callbackFn)；filter(callbackFn, thisArg)

• 参数：

•  callbackfn：为数组中的每个元素执行的函数。它应该返回一个真值以将元素保留在结果数组中，否则返回一个假值。该函数被调用时将传入以下参数：
  

•      element：数组中当前正在处理的元素。
  

•      index：正在处理的元素在数组中的索引。
  

• 返回值：返回给定数组的一部分的浅拷贝，其中只包括通过提供的函数实现的测试的元素。如果没有元素通过测试，则返回一个空数组。

• 七、find方法：返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

• 语法：find(callbackFn)；find(callbackFn, thisArg)

• 参数：

•  callbackfn：为数组中的每个元素执行的函数。它应该返回一个真值来表示已经找到了匹配的元素。该函数被调用时将传入以下参数：
  

•      element：数组中当前正在处理的元素。
  

•      index：正在处理的元素在数组中的索引。
  

• 返回值：返回给定数组的一部分的浅拷贝，其中只包括通过提供的函数实现的测试的元素。如果没有元素通过测试，则返回一个空数组

• 注意：find() 不会改变被调用的数组，但是提供给 callbackFn 的函数可能会改变它

• 八、findIndex方法：方法返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回 -1。

• 语法：find(callbackFn)；find(callbackFn, thisArg)

• 参数：

•  callbackfn：为数组中的每个元素执行的函数。它应该返回一个真值来表示已经找到了匹配的元素。该函数被调用时将传入以下参数：
  

•      element：数组中当前正在处理的元素。
  

•      index：正在处理的元素在数组中的索引。
  

• 返回值：数组中第一个满足测试条件的元素的索引。否则返回 -1。

• 注意：find() 不会改变被调用的数组，但是提供给 callbackFn 的函数可能会改变它

• 十、findLast方法：反向迭代数组，并返回满足提供的测试函数的第一个元素的值。如果没有找到对应元素，则返回 undefined。

• 十一、findLastIndex方法：反向迭代数组，并返回满足提供的测试函数的第一个元素的值。如果没有找到对应元素，则返回 undefined。

• 十二、flat方法：创建一个新的数组，并根据并根据指定深度将所有子数组元素拼接到新的数组中

• 语法：flat（）；flat（deep）

• 参数：

•  deep：可选，默认为1
  

• 返回值：一个新的数组，其中包括拼接后的子数组元素

// 示例1，展平嵌套数组
const arr5 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

• 十三、flatMap方法：对数组中的每一个元素应用给定的回到函数，然后将结果展开一级，返回一个新的数组。它等价于在调用map后，再

•               调用深度为1的flat方法，但是比分别调用这两个方法要高效一些
  

//示例1
const arr6 = [1, 2, 3, 4];

arr.flatMap((x) => [x, x * 2]);
// [1, 2, 2, 4, 3, 6, 4, 8]

// 示例2，在map方法中添加和删除元素 // flatMap（）方法可以用作在map（）方法中添加和删除元素（修改元素数量）的方法。换句话说，它允许你将一些项处理为另一些项 // （通过单独处理每一个输入项），在这个意义上，他的作用类似于filter的相反操作，如果要保留该项，那么就返回一个包含该项的 // 单元素数组，如果要删除该项，就返回一个空数组，如果要添加元素，就返回一个包含多个元素的数组

// 假设我们想要删除所有负数，并将奇数拆分成偶数和 1
const a = [5, 4, -3, 20, 17, -33, -4, 18];
//         |\  \  x   |  | \   x   x   |
//        [4,1, 4,   20, 16, 1,       18]
const out7 = a.flatMap((item) => {
    if (item < 0) {
        return []
    }
    return item % 2 === 0 ? [item] : [item - 1, 1]
})
// [4, 1, 4, 20, 16, 1, 18]

• 十四、forEach() 方法对数组的每个元素执行一次给定的函数。
• 注意：除非抛出异常，否则没有办法停止或中断 forEach() 循环。如果有这样的需求，则不应该使用 forEach() 方法
• 可以通过像 for、for...of 和 for...in 这样的循环语句来实现提前终止。当不需要进一步迭代时，
• 诸如 every()、some()、find() 和 findIndex() 等数组方法也会立即停止迭代
• forEach() 期望的是一个同步函数，它不会等待 Promise 兑现。
• 在使用 Promise（或异步函数）作为 forEach 回调时，请确保你意识到这一点可能带来的影响

*十五、from（）方法：从可迭代或类数组对象创建一个新的浅拷贝的数组实例。 语法： Array.from(arrayLike) Array.from(arrayLike, mapFn) Array.from(arrayLike, mapFn, thisArg) 参数： arrayLike： 想要转换成数组的类数组或者可迭代对象 mapfn：调用数组每个元素的函数，如果提供了该函数，每个将要添加到数组中的元素首先会传递给该函数，然后将maffn的返回值增加到数组中 element：数组正在处理的元素 index：元素下标

• 十六、includes（）方法：用来判断一个数组中是否包含指定的值，如果包含则返回true，否则返回false、

• 十七、indexOf方法：方法返回数组中第一次出现给定元素的下标，如果不存在则返回 -1。lastIndexOf（）相反

// 查找元素出现的所有索引
// 下例使用 lastIndexOf 查找到一个元素在数组中所有的索引（下标），并在找到它们时用 push 将它们添加到另一个数组中。

const indices = [];
const array = ["a", "b", "a", "c", "a", "d"];
const element = "a";
let idx = array.lastIndexOf(element);
while (idx !== -1) {
  indices.push(idx);
  idx = idx > 0 ? array.lastIndexOf(element, idx - 1) : -1;//找到了继续往前面找，否则的话，赋值为-1
}

console.log(indices); // [4, 2, 0] // Copy to Clipboard // 需要注意的是，这里必须单独处理 idx === 0 的情况，因为如果该元素是数组的第一个元素，则无论 fromIndex 参数的值为何，它总是会被找到。这与 indexOf 方法不同。

• 十八、isArray（）；用于确定传递的值是否是一个数组

• 语法：Array.isArray(value)

• 返回值：如果 value 是 Array，则为 true；否则为 false。如果 value 是 TypedArray 实例，则总是返回 false。

• instanceof vs. Array.isArray()：当检测 Array 实例时，Array.isArray 优于 instanceof，因为 Array.isArray 能跨领域工作

• 十九、join()：将一个数组或者类数组的所有元素链接成一个字符串并且返回这个字符串，用逗号或者指定的分隔符进行分割，

•                如果数组只有一个元素，那么将返回该元素而不使用分隔符
  

• 语法：join()；join(sparator)

• 参数：separator 可选 指定一个字符串来分隔数组的每个元素。如果需要将分隔符转换为字符串。如果省略， 数组元素用逗号（,）分隔。如果 separator 是空字符串（""），则所有元素之间都没有任何字符 注意：所有数组元素被转换成字符串并连接到一个字符串中。如果一个元素是 undefined 或 null， 它将被转换为空字符串，而不是字符串 "undefined" 或 "null"。

• 二十、keys():返回一个新的数组迭代器对象，包含数组中每个索引的键

const array1 = ['a', 'b', 'c'];
const iterator = array1.keys();

for (const key of iterator) {
  console.log(key);
}

// Expected output: 0
// Expected output: 1
// Expected output: 2
// 在稀疏数组中使用 keys()
// 与 Object.keys() 只包含数组中实际存在的键不同，keys() 迭代器不会忽略缺失属性的键。

const arr7 = ["a", , "c"];
const sparseKeys = Object.keys(arr);
const denseKeys = [...arr.keys()];
console.log(sparseKeys); // ['0', '2']
console.log(denseKeys); // [0, 1, 2]

• pop() 方法从数组中删除最后一个元素，并返回该元素的值。此方法会更改数组的长度。
• push() 方法将指定的元素添加到数组的末尾，并返回新的数组长度。
• shift() 方法从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度。
• unshift() 方法将指定元素添加到数组的开头，并返回数组的新长度。

*二十一、reduce()：reduce() 方法对数组中的每个元素按序执行一个提供的 reducer 函数， 每一次运行 reducer 会将先前元素的计算结果作为参数传入，最后将其结果汇总为单个返回值。 第一次执行回调函数时，不存在“上一次的计算结果”。如果需要回调函数从数组索引为 0 的元素 开始执行，则需要传递初始值。否则，数组索引为 0 的元素将被用作初始值，迭代器将从第二个 元素开始执行（即从索引为 1 而不是 0 的位置开始）。

• 二十二、reverse方法：就地反转数组中的元素，并返回同一数组的引用。数组的第一个元素会

• 变成最后一个，数组的最后一个元素变成第一个。换句话说，数组中的元素顺序将被翻转，变为与之前相反的方向。 要在不改变原始数组的情况下反转数组中的元素，使用 toReversed()。 语法：reverse() 返回值：原始数组反转后的引用。注意，数组是就地反转的，并且没有复制。 注意：reverse 方法反转数组中元素的位置，改变了数组，并返回该数组的引用。 reverse() 方法会保留空槽。如果源数组是稀疏的，则空槽对应的新索引将被删除，并且也成为空槽。

• 二十三、some()方法：测试数组中元素是否至少有一个元素通过了提供的函数实现的测试。如果在数组中找到一个元素使得提供的函数返回 true，

• 则返回 true；否则返回 false。它不会修改数组。

• 二十四、sort方法：sort() 方法就地对数组的元素进行排序，并返回对相同数组的引用。默认排序是将元素转换为字符串

• 然后按照它们的 UTF-16 码元值升序排序

• 注意：如果想要不改变原数组的排序方法，可以使用 toSorted()。

• 二十五、splice方法：通过移除或者替换已存在的元素和/或添加新元素就地改变一个数组的内容。

• 注意：要创建一个删除和/或替换部分内容而不改变原数组的新数组，请使用 toSpliced()。要访问数组的一部分而不修改它，参见 slice()。

• 二十六：with方法：Array 实例的 with() 方法是使用方括号表示法修改指定索引值的复制方法版本。它会返回一个新数组，其指定索引处的值会被新值替换。