JavaScript組み込みオブジェクト - Array配列(2) - メソッド

        JavaScript では、Array オブジェクトを使用して配列を定義できます。さらに、Array オブジェクトは配列に関連するさまざまなプロパティとメソッドも提供します。ここでは、一般的に使用される関数メソッドまたは一般的ではない関数メソッドを整理します。

        次の表に、Array オブジェクトで提供されるメソッドと説明情報を示します。

名前	説明する
の（）	引数の数や型に関係なく、可変数の引数を使用して新しい配列インスタンスを作成します
concat()	2 つ以上の配列を連結して結果を返します
copyWithin()	要素を配列内の指定された位置から配列内の別の指定された位置にコピーします
エントリ()	配列の反復可能なオブジェクトを返します。
毎（）	数値要素の各要素が条件を満たすかどうかを確認する
埋める（）	配列を固定値で埋める
フィルター（）	数値要素を検出し、条件を満たすすべての要素の配列を返します。
探す（）	関数に渡された条件を満たす配列要素を返します。
findIndex()	関数に渡された条件を満たす配列要素のインデックスを返します。
forEach()	コールバック関数は配列の要素ごとに 1 回実行されます。
から（）	指定されたオブジェクトから配列を作成します
含む()	配列に指定された値が含まれているかどうかを判断する
の指標（）	配列内の要素を検索し、その位置を返します。
isArray()	オブジェクトが配列かどうかを判断する
参加する（）	配列のすべての要素を文字列に入れる
キー()	元の配列のキーを含む配列の反復可能なオブジェクトを返します。
lastIndexOf()	配列内の要素を検索し、最後に出現した要素を返します。
地図（）	指定された関数を通じて配列の各要素を処理し、処理された配列を返します。
ポップ（）	配列の最後の要素を削除し、削除された要素を返します。
押す（）	1 つ以上の要素を配列の末尾に追加し、配列の長さを返します。
減らす（）	配列内のすべての要素を (左から右に) 蓄積し、結果を返します。
reduceRight()	配列内のすべての要素を (右から左に) 蓄積し、結果を返します。
逆行する（）	配列内の要素の順序を逆にする
シフト（）	配列の最初の要素を削除して返します。
スライス（）	配列の一部をインターセプトし、この新しい配列を返します
いくつかの（）	配列内の要素が指定された条件を満たすかどうかを確認します
選別（）	配列の要素を並べ替える
スプライス（）	配列の要素を追加または削除する
toString()	配列を文字列に変換して結果を返す
シフト解除()	配列の先頭に 1 つ以上の要素を追加し、新しい配列の長さを返します。
値の()	配列オブジェクトの元の値を返します。

1. 一般的に使用される方法

1.1 concat() メソッド - 配列を結合する

        concat() メソッドは、2 つ以上の配列を結合するために使用されます。このメソッドは既存の配列を変更しませんが、新しい配列を返します。

文法：

var new_array = old_array.concat(value1[, value2[, ...[, valueN]]])

パラメータ:

パラメータ名	説明する
値N	配列や値を新しい配列に連結します。 valueN パラメータが省略された場合、 concat は呼び出された既存の配列のコピーを返します。

戻り値: 新しい Array インスタンス。

例 1:

const num1 = [1, 3, 5, 7, 9];
const num2 = [2, 4, 6, 8, 10];

console.log(num1.concat(num2));

出力は次のとおりです。

[
  1、3、5、7、9、2、4、6、8、10
  ]
_

        concat() メソッドを使用して配列をマージすることに加えて、スプレッド演算子を使用して配列をマージすることもできます。ES6 で新しく追加されたコンテンツのコード例は次のとおりです。

例 2:

const num1 = [1, 3, 5, 7, 9];
const num2 = [2, 4, 6, 8, 10];

// 通过扩展运算符合并数组
console.log([...num1, ...num2]);

出力は次のとおりです。

[
  1、3、5、7、9、2、4、6、8、10
  ]
_

1.2  filter()メソッド

        filter() メソッドは、提供された関数によって実装された検証に合格したすべての要素を含む新しい配列を作成します。これは、データをフィルター処理し、不要なデータを削除し、新しい配列を返すために使用されます。

文法：

var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])

パラメータ:

パラメータ名	説明する
折り返し電話	配列の各要素をテストするために使用される関数。true を返すと、要素がテストに合格し、要素が保持されることを意味し、false は、要素が保持されないことを意味します。次の 3 つのパラメータを受け入れます
要素	現在処理されている配列内の要素。
索引	処理される要素の配列内のインデックス。
配列	フィルターが呼び出された配列自体。
この引数	コールバックの実行時にこれに使用される値。

戻り値: テストに合格した要素で構成される新しい配列、またはテストに合格した配列要素がない場合は空の配列。

例 1、矢印記号を使用して要素を直接テストします。

const fruits =  [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ];

// 筛选出带有小于字母a的水果，并返回新数组
const newFruits = fruits.filter(item => item.includes('a'));
// 输出新数组
console.log(newFruits);

出力結果:

// テストに合格した要素のみが新しい配列に追加されます

[ 'Pear', 'Orange', 'Banana' ]

示例二，定义测试函数获取对应参数进行测试：

const fruits =  [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ];

// 定义测试的函数
const callback = (ele, index, arr) => {
    console.log(index, ele, arr);
    return ele.includes('a');
}

// 筛选出带有小于字母a的水果，并返回新数组
const newFruits = fruits.filter(callback);
// 输出新数组
console.log(newFruits);

输出结果如下：

// 每个元素测试时所获取的三个参数

0 Apple [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ]
1 Pear [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ]
2 Orange [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ]
3 Banana [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ]
4 Plum [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ]

    

// 通过测试返回的新数组
[ 'Pear', 'Orange', 'Banana' ]

1.3 find()方法

        find() 方法返回数组中满足提供的测试函数的第一个元素的值，否则返回 undefined。

语法：

arr.find(callback[, thisArg])

参数：

返回值：数组中第一个满足所提供测试函数的元素的值，否则返回 undefined。

示例：

const fruits =  [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ];

// 查询带p的水果名称
const firstValue = fruits.find(item => item.includes('p'));
// 输出结果
console.log(firstValue);

输出结果：

Apple

1.4 findIndex()方法

        findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。

语法：

arr.findIndex(callback[, thisArg])

参数：

返回值：数组中通过提供测试函数的第一个元素的索引。否则，返回-1

示例：

const fruits =  [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ];

// 查询带p的水果名称
const firstIndex = fruits.findIndex(item => item.includes('p'));
// 输出结果
console.log(firstIndex);

输出结果：

0

1.5 indexOf()方法

        indexOf()方法返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。

语法：

arr.indexOf(searchElement[, fromIndex])

参数：

返回值：首个被找到的元素在数组中的索引位置; 若没有找到则返回 -1

示例：

const fruits =  [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ];

// 从数组fruits开头位置查询Pear元素的位置
const index = fruits.indexOf("Pear");
// 输出结果
console.log(index);

// 从数组fruits索引为2的位置，查询Banana的索引
const bIndex = fruits.indexOf("Banana", 2);
console.log(bIndex);

输出结果：

// Pear的索引位置

1

    

//Banana的索引位置

3 

1.6 lastIndexOf()方法

        lastIndexOf() 方法返回指定元素（也即有效的 JavaScript 值或变量）在数组中的最后一个的索引，如果不存在则返回 -1。从数组的后面向前查找，从 fromIndex 处开始。

语法：

arr.lastIndexOf(searchElement[, fromIndex])

参数：

返回值：数组中该元素最后一次出现的索引，如未找到返回-1。

示例：

const fruits =  [ 'Apple', 'Pear', 'Orange', 'Banana', 'Plum' ];

// 从数组fruits结尾位置开始查询Pear元素的位置
const index = fruits.lastIndexOf("Pear");
// 输出结果
console.log(index);

// 从数组fruits索引为fruits.length-1的位置，查询Banana的索引
const bIndex = fruits.lastIndexOf("Banana", fruits.length-1);
console.log(bIndex);

输出结果：

// Pear的索引位置

1

   

//Banana的索引位置

3 

1.7 find与index的四种方法区别

• find()查询返回的是结果中第一个元素的值
• findIndex()查询返回的是结果中第一个元素的索引
• indexOf()是从数组开始方向查询，并返回第一个结果的索引。
• lastIndexOf()是从数组结尾方向反向查询，并返回第一个结果的索引。

1.8 forEach()方法

        forEach() 方法对数组的每个元素执行一次提供的函数。

语法：

arr.forEach(callback(currentValue [, index [, array]])[, thisArg]);

参数：

参数名	描述
callback	为数组中每个元素执行的函数，该函数接收三个参数
currentValue	数组中正在处理的当前元素。
index	数组中正在处理的当前元素的索引。
array	forEach() 方法正在操作的数组。
thisArg	可选参数。当执行回调函数 callback 时，用作 this 的值。

返回值：undefined

注意： 除了抛出异常以外，没有办法中止或跳出 forEach() 循环。如果你需要中止或跳出循环，forEach() 方法不建议使用。

示例：

const numbers = [50, 89, 22, 59, 38, 99, 105];

// map()循环
numbers.forEach(item => console.log(item));

输出结果：

50
89
22
59
38
99
105

1.9 includes()方法

        includes() 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回false。

语法：

arr.includes(valueToFind[, fromIndex])

参数：

返回值：返回一个布尔值 Boolean ，如果在数组中找到了（如果传入了 fromIndex ，表示在 fromIndex 指定的索引范围中找到了）则返回 true 。

注：使用 includes()比较字符串和字符时是区分大小写。

1.9.1 fromIndex大于零或小于零不同之处

示例：

const numbers = [1, 2, 3, NaN];

// 大于0位置开始查询
console.log(numbers.includes(2));
console.log(numbers.includes(4));
console.log(numbers.includes(3, 3));
console.log(numbers.includes(NaN));

// 小于0位置开始查询
//实际起始位：numbers.length + (-1) = 3，值3的索引为2，故结果为false
console.log(numbers.includes(3, -1));    
//实际起始位：numbers.length + (-1) = 3, 值1的索引为0，故结果为false
console.log(numbers.includes(1, -1));
// 实际起始位：numbers.length + (-100) = -96，值2的索引为1，故结果为true
// 起始位索引小于0，则从0开始查询
console.log(numbers.includes(2, -100));

输出结果：

// 大于0位置开始查询

true
false
false
true

   

// 小于0位置开始查询
false
false
true

1.9.2 includes()不支持模糊查询

示例：

const fruits = ['Apple', 'Pear', 'Orange', 'Banana', 'Plum'];

// 输出结果：
console.log(fruits.includes('an'));
console.log(fruits.includes('Plum'));

输出结果：

false
true

1.9.3 arguments对象使用includes()方法

示例：

(function() {
  console.log([].includes.call(arguments, 'a'));
  console.log([].includes.call(arguments, 'd'));
})('a','b','c');

输出结果：

true
false

1.10 join()方法

        join() 方法将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串。如果数组只有一个项目，那么将返回该项目而不使用分隔符。

语法：

arr.join([separator])

参数：

返回值：一个所有数组元素连接的字符串。如果 arr.length 为0，则返回空字符串。

1.10.1 常规合并

示例：

const words = ["How", "are", "you", "?"];
// 拼接字符
console.log(words.join(" ")); 
console.log(words.join("-")); 

输出结果：

How are you ?
How-are-you-?

1.10.2 arguments对象使用join()方法

示例：

(function(){
    const word = Array.prototype.join.call(arguments, '');
    console.log(word);
})('H', 'e', 'l', 'l', 'o');

输出结果：

Hello

1.11 map()方法

        map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

语法：

var new_array = arr.map(function callback(currentValue[, index[, array]]) {
 // Return element for new_array 
}[, thisArg])

参数：

返回值：回调函数的结果组成了新数组的每一个元素。

1.11.1 重构元素

示例：

const numbers = [23, 77, 26, 38, 15, 69];
// 使用map()循环将数组中元素乘以2，并返回一个新数组
const newNums = numbers.map(item => item * 2);
// 输出结果
console.log(newNums);

// 将索引模2等于0的，减去10
const newNums2 = numbers.map((item, index) => index%2===0 ? item-10 : item);
// 输出结果
console.log(newNums2);

输出结果：

// 乘以2结果

[ 46, 154, 52, 76, 30, 138 ]

  

// 减去10结果
[ 13, 77, 16, 38, 5, 69 ]

1.11.2 使用map()获取ASCII码

示例：

const codes = Array.prototype.map.call("Hello World!", item => item.charCodeAt(0))
// 输出结果
console.log(codes);

输出结果：

[ 72, 101, 108, 108, 111, 32,  87, 111, 114, 108, 100,  33 ]

1.12 pop()方法

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

语法：

arr.pop()

返回值：从数组中删除的元素(当数组为空时返回undefined)。

示例：

const words = ["How", "are", "you", "?"];
// 删除最后一个元素
words.pop();
// 输出结果
console.log(words);

输出结果：

[ 'How', 'are', 'you' ]

1.13 push()方法

        push() 方法将一个或多个元素添加到数组的末尾，并返回该数组的新长度。

语法：

arr.push(element1, ..., elementN)

参数：

参数名	描述
elementN	被添加到数组末尾的元素。

返回值：当调用该方法时，新的 length 属性值将被返回。

1.13.1 添加元素到数组

示例：

const words = ["How", "are", "you", "?"];
// 添加一个元素
words.push("Nice");
// 输出结果
console.log(words);

// 添加多个元素
words.push("to", "meet", "you");
// 输出结果
console.log(words);

输出结果：

// 添加一个元素 输出结果

[ 'How', 'are', 'you', '?', 'Nice' ]

  

// 添加多个元素 输出结果
['How',  'are', 'you',  '?', 'Nice', 'to', 'meet', 'you' ]

1.13.2 结合apply()合并两数组

        使用 apply() 添加第二个数组的所有元素，当第二个数组太大时不要使用这个方法来合并数组，因为事实上一个函数能够接受的参数个数是有限制的。

示例：

const words = ["How", "are", "you", "?"];
const word2 = ["Nice", "to", "meet", "you"];

// 合并两个数组
Array.prototype.push.apply(words, word2);
// 输出结果
console.log(words);

输出结果：

[ 'How',  'are', 'you',  '?',  'Nice', 'to',  'meet', 'you' ]

1.14 reduce()方法

        reduce() 方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值。

语法：

arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])

参数：

参数名	描述
callback	执行数组中每个值 (如果没有提供  initialValue则第一个值除外)的函数，包含四个参数
accumulator	累计器累计回调的返回值; 它是上一次调用回调时返回的累积值，或initialValue（见于下方）。
currentValue	数组中正在处理的元素。
index	数组中正在处理的当前元素的索引。 如果提供了 initialValue，则起始索引号为0，否则从索引1起始。(可选)
array	调用 reduce()的数组(可选）
initialValue	作为第一次调用  callback函数时的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素。 在没有初始值的空数组上调用 reduce 将报错。

返回值：函数累计处理的结果。

1.14.1 求和

示例：

const numbers = [10, 20, 30, 15, 35, 5, 50];

// 求和
const total = numbers.reduce((total, value) => total + value, 0);
// 输出结果
console.log("Total:", total);

输出结果：

Total: 165

1.14.2 合并子数组

        reduce()也可以作为flatMap()方法的替补方案，将数组中所有子数组合并到一维数组中。

示例：

const arr = [20, 30, 50, 60, [15, 35, 55, 75], [5, 10, 12]];
// 合并数组
const newArr = arr.reduce((all, item) => 
    all.concat( Array.isArray(item) ? item : [item] ) 
    , []);
// 输出结果
console.log(newArr);

输出结果：

[ 20, 30, 50, 60, 15, 35, 55, 75,  5, 10, 12 ]

1.14.3 求数组中最小值和最大值

示例：

const arr = [20, 30, 50, 60, 15, 35, 55, 75];

// 求最小值
const minValue = arr.reduce((minValue, item) => Math.min(minValue, item), arr[0]);

// 求最大值
const maxValue = arr.reduce((maxValue, item) => Math.max(maxValue, item), arr[0]);

// 输出结果
console.log("最小值：", minValue);
console.log("最大值：", maxValue);

输出结果：

最小值： 15
最大值： 75

1.15 reduceRight()方法

        reduceRight() 方法接受一个函数作为累加器（accumulator）和数组的每个值（从右到左）将其减少为单个值。

语法：

arr.reduceRight(callback(accumulator, currentValue[, index[, array]])[, initialValue])

参数：

参数名	描述
callback	一个回调函数，用来操作数组中的每个元素，可接受四个参数
accumulator	上一次调用回调的返回值，或提供的  initialValue。
currentValue	当前被处理的元素。
index	数组中当前被处理的元素的索引。（可选）
array	调用 reduceRight() 的数组(可选）
initialValue	值用作回调的第一次调用的累加器。如果未提供初始值，则将使用并跳过数组中的最后一个元素。在没有初始值的空数组上调用reduce或reduceRight就会创建一个TypeError。

返回值：执行之后的返回值。

示例：

const number = [1, 2, 3, 4, 5, 6, 7, 8, 9];
// 从右向左合并元素
const numStr = number.reduceRight((allStr, item) => allStr + item.toString(), "");
// 输出结果
console.log(numStr);

输出结果：

987654321

1.16 reverse()方法

        reverse() 方法将数组中元素的位置颠倒，并返回该数组。数组的第一个元素会变成最后一个，数组的最后一个元素变成第一个。该方法会改变原数组。

语法：

arr.reverse()

返回值：颠倒后的数组。

1.16.1 反转数组

示例：

const number = [1, 2, 3, 4, 5, 6, 7, 8, 9];
// 反转数组
number.reverse();
// 输出结果
console.log(number);

输出结果：

[ 9, 8, 7, 6, 5, 4, 3, 2, 1 ]

1.16.2 反转类数组对象

        以下类数组中包含3个元素和一个 length 属性, 然后颠倒这个类数组对象。reverse() 的调用返回一个颠倒后的类数组对象的引用。

示例：

const arrObj = { 0: "Hello", 1: "are", 2: "you", length: 3 };
// 反转数组对象
Array.prototype.reverse.call(arrObj);
// 输出结果
console.log(arrObj);

输出结果：

{ '0': 'you', '1': 'are', '2': 'Hello', length: 3 }

1.17 shift()方法

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

语法：

arr.shift()

返回值：从数组中删除的元素; 如果数组为空则返回undefined 。 

示例：

const number = [1, 2, 3, 4, 5, 6, 7, 8, 9];
// 删除第一个元素
number.shift();
// 输出结果
console.log(number);

//循环删除
let i;
while( (i = number.shift()) !== undefined ){
    console.log('val: ' + i);
}
// 最后输出数组
console.log("arr: ", number);

输出结果：

// 删除第一个元素后数组

[ 2, 3, 4, 5, 6, 7, 8, 9 ]

  

// while循环删除
val: 2
val: 3
val: 4
val: 5
val: 6
val: 7
val: 8
val: 9
arr []

1.18 slice()方法

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

语法：

arr.slice([begin[, end]])

参数：

参数名	描述
begin	提取起始处的索引（从 0 开始），从该索引开始提取原数组元素。         如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取， slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。         如果省略 begin，则 slice 从索引 0 开始。         如果 begin 大于原数组的长度，则会返回空数组。
end	提取终止处的索引（从 0 开始），在该索引处结束提取原数组元素。 slice 会提取原数组中索引从  begin 到  end 的所有元素（包含 begin，但不包含 end）。         slice(1,4) 会提取原数组中从第二个元素开始一直到第四个元素的所有元素 （索引为 1, 2, 3的元素）。         如果该参数为负数， 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）。         如果  end 被省略，则  slice 会一直提取到原数组末尾。         如果 end 大于数组的长度， slice 也会一直提取到原数组末尾。

返回值：一个含有被提取元素的新数组。

示例：

const fruits = ['Apple', 'Pear', 'Orange', 'Banana', 'Plum'];
// 从索引为1的位置截取 begin - 1 + len - 1 = 索引为2位置
// begin - 1是起始位从begin开始且包含begin
// len - 1是end位置不包含end
// 故 1 - 1 + 3 - 1 = 2
const cutArr = fruits.slice(1, 3);
// 输出结果
console.log(cutArr);

输出结果：

[ 'Pear', 'Orange' ]

1.19 sort()方法

        sort() 方法用原地算法对数组的元素进行排序，并返回数组。默认排序顺序是在将元素转换为字符串，然后比较它们的UTF-16代码单元值序列时构建的

语法：

arr.sort([compareFunction])

参数：

参数名	描述
compareFunction	用来指定按某种顺序进行排列的函数。如果省略，元素按照转换为的字符串的各个字符的Unicode位点进行排序。
firstEl	第一个用于比较的元素。
secondEl	第二个用于比较的元素。

返回值：排序后的数组。请注意，数组已原地排序，并且不进行复制。

1.19.1 数值排序

示例：

const number1 = [20, 30, 50, 60, 15, 35, 55, 75];
const number2 = [20, 30, 50, 60, 15, 35, 55, 75];

// 升序
number1.sort((a, b) => a - b);
// 降序
number2.sort((a, b) => b - a);

// 输出结果
console.log(number1);
console.log(number2);

输出结果：

// 升序

[ 15, 20, 30, 35, 50, 55, 60, 75 ]

  

// 降序
[ 75, 60, 55, 50, 35, 30, 20, 15 ]

1.19.2 字符串排序

示例：

const fruits = ['Apple', 'Pear', 'Orange', 'Banana', 'Plum'];

// 降序排序
fruits.sort((a, b) => {
    if(a.toUpperCase() > b.toUpperCase()){
        return 1;
    } else if(a.toUpperCase() < b.toUpperCase()){
        return -1;
    }
    return 0;
});
// 输出结果
console.log(fruits);

输出结果：

[ 'Apple', 'Banana', 'Orange', 'Pear', 'Plum' ]

1.19.3 localeCompare()比较

        当排序非 ASCII 字符的字符串（如包含类似 e, é, è, a, ä 等字符的字符串）。一些非英语语言的字符串需要使用 String.localeCompare。这个函数可以将函数排序到正确的顺序。

示例：

var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu'];

// 使用localeCompare()进行字符比较
items.sort((a, b) => a.localeCompare(b));
// 输出结果
console.log(items);

输出结果：

[ 'adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé' ]

1.20 splice()方法

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

语法：

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

参数：

参数名	描述
start	指定修改的开始位置（从0计数）。如果超出了数组的长度，则从数组末尾开始添加内容；如果是负值，则表示从数组末位开始的第几位（从-1计数，这意味着-n是倒数第n个元素并且等价于 array.length-n）；如果负数的绝对值大于数组的长度，则表示开始位置为第0位。
deleteCount	整数，表示要移除的数组元素的个数。 如果 deleteCount 大于 start 之后的元素的总数，则从 start 后面的元素都将被删除（含第 start 位）。 如果 deleteCount 被省略了，或者它的值大于等于 array.length - start(也就是说，如果它大于或者等于 start之后的所有元素的数量)，那么 start之后数组的所有元素都会被删除。 如果 deleteCount 是 0 或者负数，则不移除元素。这种情况下，至少应添加一个新元素。
item1, item2, ...	要添加进数组的元素,从 start 位置开始。如果不指定，则 splice() 将只删除数组元素。

返回值 ：由被删除的元素组成的一个数组。如果只删除了一个元素，则返回只包含一个元素的数组。如果没有删除元素，则返回空数组。

1.20.1 删除某个元素

示例：

const fruits = ['Apple', 'Pear', 'Orange', 'Banana', 'Plum'];
// 删除Apple
fruits.splice(0, 1);
// 输出结果
console.log(fruits);

输出结果：

[ 'Pear', 'Orange', 'Banana', 'Plum' ]

1.20.2 删除某元素及后面所有元素

示例：

const fruits = ['Apple', 'Pear', 'Orange', 'Banana', 'Plum'];
// 删除Orange及后面所有元素
fruits.splice(2);
// 输出结果
console.log(fruits);

输出结果：

[ 'Apple', 'Pear' ]

1.20.3 删除某元素及后面指定长度元素

示例：

const fruits = ['Apple', 'Pear', 'Orange', 'Banana', 'Plum'];
// 删除Orange及长度为2
fruits.splice(2, 2);
// 输出结果
console.log(fruits);

输出结果：

[ 'Apple', 'Pear', 'Plum' ]

1.20.4 删除某几个元素，并插入新元素

示例：

const fruits = ['Apple', 'Pear', 'Orange', 'Banana', 'Plum'];
// 删除Orange及长度为2，并插入三个新元素
fruits.splice(2, 2, 'Grapes', 'Muskmelon', 'Grapefruit');
// 输出结果
console.log(fruits);

输出结果：

[ 'Apple', 'Pear', 'Grapes', 'Muskmelon', 'Grapefruit', 'Plum' ]

1.21 toString()方法

        toString() 返回一个字符串，表示指定的数组及其元素。

语法：
 

arr.toString()

返回值 ：一个表示指定的数组及其元素的字符串。

示例：

const array1 = [1, 'a', "Hello"];
const stringVal = array1.toString();
console.log(stringVal);

输出结果：

1,a,Hello

1.22 unshift()方法

        unshift() 方法将一个或多个元素添加到数组的开头，并返回该数组的新长度(该方法修改原有数组)。

语法：

arr.unshift(element1, ..., elementN)

参数：

参数名	描述
elementN	要添加到数组开头的元素或多个元素。

返回值：当一个对象调用该方法时，返回其 length 属性值。

示例：

const number = [2, 5, 8, 11, 15, 18, 21, 23];

// 逐个添加
number.unshift(50);
number.unshift(23);
number.unshift(19);
// 输出结果
console.log(number);

// 一次添加多个
number.unshift(100, 150, 230);
console.log(number);

输出结果：

// 逐个添加 结果

[ 19, 23, 50,  2,  5, 8, 11, 15, 18, 21, 23 ]

// 一次添加多个 结果 
[ 100, 150, 230, 19, 23, 50, 2,   5,   8, 11, 15, 18, 21,  23 ]

1.23 isArray()方法

        Array.isArray() 用于确定传递的值是否是一个 Array。

语法：

Array.isArray(obj)

参数：

参数名	描述
obj	需要检测的值。

返回值：如果值是 Array，则为true; 否则为false。

示例：

// 下面的函数调用都返回 true
console.log(Array.isArray([]));
console.log(Array.isArray([1]));
console.log(Array.isArray(new Array()));
console.log(Array.isArray(new Array('a', 'b', 'c', 'd')))
// 鲜为人知的事实：其实 Array.prototype 也是一个数组。
console.log(Array.isArray(Array.prototype)); 

// 下面的函数调用都返回 false
console.log(Array.isArray());
console.log(Array.isArray({}));
console.log(Array.isArray(null));
console.log(Array.isArray(undefined));
console.log(Array.isArray(17));
console.log(Array.isArray('Array'));
console.log(Array.isArray(true));
console.log(Array.isArray(false));
console.log(Array.isArray(new Uint8Array(32)))
console.log(Array.isArray({ __proto__: Array.prototype }));

输出结果：

// // 下面的函数调用都返回 true

true
true
true
true
true

  

// // 下面的函数调用都返回 false
false
false
false
false
false
false
false
false
false
false

二、其他方法

2.1 of()方法

        Array.of() 方法创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型。

         Array.of() 和 Array 构造函数之间的区别在于处理整数参数：Array.of(5) 创建一个具有单个元素 5 的数组，而 Array(5) 创建一个长度为7的空数组（注意：这是指一个有5个空位(empty)的数组，而不是由5个undefined组成的数组）。

语法：

Array.of(element0[, element1[, ...[, elementN]]])

参数：

参数	描述
element N	任意个参数，将按顺序成为返回数组中的元素。

返回值：新的 Array 实例。

示例：

const num1list = Array.of(7);
const num2list = Array.of(3,4,5);

const num1 = Array(5);
const num2 = Array(1, 2, 3);
const num3 = Array(undefined);

console.log(num1list);
console.log(num2list)

console.log(num1);
console.log(num2);
console.log(num3);

输出结果如下：

> [ 7 ]
>  [3, 4, 5 ]

   

> [ <5 empty items> ]
> [ 1, 2, 3 ]
> [ undefined ]

2.2 copyWithin()方法

        copyWithin() 方法浅复制数组的一部分到同一数组中的另一个位置，并返回它，不会改变原数组的长度。

语法：

arr.copyWithin(target[, start[, end]])

参数：

参数名	描述
target	0 为基底的索引，复制序列到该位置。如果是负数， target 将从末尾开始计算。 如果 target 大于等于 arr.length，将会不发生拷贝。如果 target 在 start 之后，复制的序列将被修改以符合 arr.length。
start	0 为基底的索引，开始复制元素的起始位置。如果是负数， start 将从末尾开始计算。 如果  start 被忽略， copyWithin 将会从0开始复制。
end	0 为基底的索引，开始复制元素的结束位置。 copyWithin 将会拷贝到该位置，但不包括 end 这个位置的元素。如果是负数，end 将从末尾开始计算。 如果 end 被忽略， copyWithin 方法将会一直复制至数组结尾（默认为 arr.length）。

返回值：改变后的数组。

示例：

const words = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
const words2 = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
const words3 = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];

// 将words数组中 0 位置元素 a 移至索引为3的位置
words.copyWithin(3, 0, 1);

// 将words2数组中0位置元素 a 移至索引 3位置，并移2位
words2.copyWithin(3, 0, 2);

// 将words3数组中 0位置元素移至 索引为4位置，且不指定结束位置
words3.copyWithin(4, 0);

console.log( words);
console.log( words2);
console.log( words3);

输出结果如下所示，移至位置元素被替换，使用此方法请注意使用场景：

[
  'a', 'b', 'c',
  'a', 'e', 'f', 'g'
]

   
[
  'a', 'b', 'c',
  'a', 'b', 'f','g'
]

  
[
  'a', 'b', 'c',
  'd', 'a', 'b', 'c'
]

2.3 entries()方法

        entries() 方法返回一个新的Array Iterator对象，该对象包含数组中每个索引的键/值对。

语法：

arr.entries()

参数：无

返回值：一个新的 Array 迭代器对象。Array Iterator是对象，它的原型（__proto__:Array Iterator）上有一个next方法，可用用于遍历迭代器取得原数组的[key,value]。

2.3.1 while循环

示例：

const words = ['a','b','c','d','e','f','g'];
// 获取迭代器实例
const iteratorObj = words.entries();
// 获取第一个迭代器
let nextObj = iteratorObj.next();

console.log(nextObj);       //迭代器结构

// 循环获取剩余元素，当nextObj.done为true时结束
while(!nextObj.done){
    // 输出结果
    console.log(nextObj.value);
    // 获取下一个迭代器
    nextObj = iteratorObj.next();
};

输出结果如下：

// 迭代器结构，done 用于指示迭代器是否完成：在每次迭代时进行更新而且都是false，直到迭代器结束done才是true。

{ value: [ 0, 'a' ], done: false }

   

// while循环输出结果

[ 0, 'a' ]
[ 1, 'b' ]
[ 2, 'c' ]
[ 3, 'd' ]
[ 4, 'e' ]
[ 5, 'f' ]
[ 6, 'g' ]

2.3.2 二维数组的排序

        可以使用迭代器循环获取所有子元素，进而将子数组通过sort()进行排序，示例/如下：

const numbers = [
    [32, 12, 8, 20],
    [3, 4, 19, 12, 88, 6, 9, 45],
    [100, 21, 59, 23, 33, 150, 39, 52],
    [1,6, 8, 5, 4, 2]
];
// 获取Iterator实例对象
const iteratorObj = numbers.entries();
// 获取迭代器
let next = iteratorObj.next();
// 循环获取子数组
while(!next.done){
    // 子数组在迭代器 next.value数组索引为1的位置
    // 通过sort()方法进行排序
    next.value[1].sort((a, b) => a - b);
    // 获取下一个迭代器
    next = iteratorObj.next();
}

console.log(numbers)

输出结果如下，此时二维数组中子数组已全部进行升序排序：

[
  [ 8, 12, 20, 32 ],
  [ 3,  4,  6,  9, 12, 19, 45, 88 ],
  [  21, 23,  33,  39,  52, 59, 100, 150 ],
  [ 1, 2, 4, 5, 6, 8 ]
]

2.3.3 使用for ... of循环

        除了以上使用while + next.done循环外，还可以使用for ... or循环，示例如下：

const words = ['a','b','c','d','e','f','g'];
// 获取迭代器实例
const iteratorObj = words.entries();

// 使用for ..of 循环输出迭代器
for(let value of iteratorObj){
    console.log(value);
}

输出结果如下：

[ 0, 'a' ]
[ 1, 'b' ]
[ 2, 'c' ]
[ 3, 'd' ]
[ 4, 'e' ]
[ 5, 'f' ]
[ 6, 'g' ]

2.4 every()方法

        every() 方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。

语法：

arr.every(callback[, thisArg])

参数：

参数名	描述
callback	用来测试每个元素的函数，它可以接收三个参数：
element	用于测试的当前值
index	用于测试的当前值的索引。（可选）
array	调用 every 的当前数组。（可选）
thisArg	执行 callback 时使用的  this 值。

返回值：如果回调函数的每一次返回都为 truthy 值，返回 true ，否则返回 false。

示例：

const numbers = [
    [32, 12, 8, 20],
    [3, 4, 19, 12, 88, 6, 9, 45],
    [100, 21, 59, 23, 33, 150, 39, 52],
    [1,6, 8, 5, 4, 2]
];

// 1.判断numbers数组中，所有子元素是否为数组
console.log(numbers.every( item => Array.isArray(item) ));

// 2.回调函数（也可以把执行函数拿出来单独定义）
// 判断是否为数组外，并判断是否所有数组长度都大于5
const callback = function(ele, index, arr){
    return Array.isArray(ele)&&ele.length>5;
}

// 判断numbers数组中，所有子元素是否为数组
console.log(numbers.every( callback ));


// 3.回调函数（可以传入callback回调中的this对象）
const callback2 = function(ele, index, arr){
    console.log('this object:', this);
    return Array.isArray(ele);
}
// 模拟this对象
const thisArg = { value: 2 };
// 判断numbers数组中，所有子元素是否为数组
console.log(numbers.every( callback2 , thisArg));

输出结果如下：

// 1.因二维数组中所有子元素都为数组，故返回为true

true

  

// 2.因二维数组中所有子元素长度有小于5位的，故返回false
false

  

// 3.这里是模拟了一个thisArg对象传入，也可以将numbers输入或其他需绑定对象
this object: { value: 2 }
this object: { value: 2 }
this object: { value: 2 }
this object: { value: 2 }
true

2.4 fill()方法

        fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。

语法：

arr.fill(value[, start[, end]])

参数：

参数名	描述
value	用来填充数组元素的值。
start	起始索引，默认值为0。（可选）
end	终止索引，默认值为 this.length。(可选）

返回值：修改后的数组。

示例：

const words = ['a','b','c','d','e','f','g'];
const words2 = ['a','b','c','d','e','f','g'];

// words数组，将w从索引3位置填充到5位置终止
words.fill('w', 3, 5);

// words数组，将x从索引 5位置填充到结束位置
words.fill('x', 5);

// words2数组，将数组中所有元素都替换为 z
words2.fill('z');

console.log(words);
console.log(words2);

输出结果如下：

[  'a', 'b', 'c', 'w', 'w', 'x', 'x' ]

  
[  'z', 'z', 'z', 'z', 'z', 'z',  'z' ]

注：fill()方法和copyWithin()之间区别：

1. fill()方法是将内容指定到数组的某位置，copyWithin()是将数组中某位或多位元素移至新位置。
2. fill()方法中的end是指结束位置的索引，但不包含本位置；copyWithin()方法中的end是自start起始点索引位置开始，至结束长度，实际结束位置索引为start+end-1位置。
3. fill()方法不指定end位置则会填充整个数组；copyWithin()方法不指定end位置则只移动start位置元素。

2.5 flat()方法

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

语法：

var newArray = arr.flat([depth])

参数：

返回值：一个包含将数组与子数组中所有元素的新数组。

2.5.1 扁平化嵌套数组

示例：

const numbers = [
    3, 50, 89, 22, 59,
    [38, 99, 105, 30],
    [26, 78]
]

// 扁平化嵌套数组
const newArr = numbers.flat();

// 输出结果
console.log(numbers);
console.log(newArr);

输出结果：

// 原数组

[ 3, 50, 89, 22, 59, [ 38, 99, 105, 30 ], [ 26, 78 ] ]

    

// 合并后新数组
[3, 50,  89, 22, 59, 38, 99, 105, 30, 26, 78 ]

2.5.2 移除数组中空间

        flat() 方法可以移除数组中的空项。

示例：

const numbers = [ 3, 50, 89,, 22, 59 ]

// 移除空项
const newNums = numbers.flat();
// 输出结果
console.log(newNums);

输出结果：

[ 3, 50, 89, 22, 59 ]

2.6 flatMap()方法

        flatMap() 方法首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。它与 map 连着深度值为1的 flat 几乎相同，但 flatMap 通常在合并成一种方法的效率稍微高一些。

语法：

var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
    // return element for new_array
}[, thisArg])

参数：

参数名	描述
callback	可以生成一个新数组中的元素的函数，可以传入三个参数
currentValue	当前正在数组中处理的元素
index	可选的。数组中正在处理的当前元素的索引。
array	可选的。被调用的  map 数组
thisArg	可选的。执行  callback 函数时 使用的 this 值。

返回值：一个新的数组，其中每个元素都是回调函数的结果，并且结构深度 depth 值为1。

2.6.1 通过映射函数合并

示例：

const numbers = [
    3, 50, 89, 22, 59,
    [38, 99, 105, 30],
    [26, 78]
];
// 通过映射函数合并所有结果
// 如果是数组，直接使用valuue，如果不是将value转换为数组
const newNums = numbers.flatMap(value => Array.isArray(value)?value:[value]);
// 输出结果
console.log(newNums);

输出结果：

[ 3, 50,  89, 22, 59, 38, 99, 105, 30, 26, 78 ]

2.6.2 Object元素合并

示例：

const menus =  [ 
    {name: "Java", children: [
        {name: "SpringBoot"},
        {name: "Struts"},
        {name: "Freemarker"}
    ]},
    {name: "PHP", children: [
        {name: "ThinkPHP"},
        {name: "Yii"}
    ]},
    {name: "Python", children: [
        {name: "Python基础"}
    ]}
];

// 通过映射函数将对象元素合并成一维数组
const newMenus = menus.flatMap(item => [{name: item.name}, ...item.children]);
// 输出结果
console.log(newMenus);

输出结果：

[
  { name: 'Java' },
  { name: 'SpringBoot' },
  { name: 'Struts' },
  { name: 'Freemarker' },
  { name: 'PHP' },
  { name: 'ThinkPHP' },
  { name: 'Yii' },
  { name: 'Python' },
  { name: 'Python基础' }
]

2.6.3 map()和flatMap()区别

1. map()和flatMap()都可以循环遍历数组。
2. map()是一对一返回元素到新数组中，flatMap()是将的所有元素合并到一维数组中。
3. map()在循环返回新数组后不会改变元素数量，flatMap()循环返回新数组中元素个数会因条件不同而改变。

示例：

const numbers = [ 3, 50, 89, 22, 59, 38, 99, 105, 30 ];

// map()循环
const numsMap = numbers.map(value => [value]);
// flatMap()循环
const numsFlatMap = numbers.flatMap(value => [value]);
// 一对一返回，输出结果
console.log(numsMap);
console.log(numsFlatMap);


// flatMap() 修改返回结果，不满足条件指定为空数组
const numsNewFlatMap = numbers.flatMap(value => value<50?[]:[value]);
// 输出结果
console.log(numsNewFlatMap);

输出结果：

// map()返回结果

[ [ 3 ],  [ 50 ], [ 89 ], [ 22 ], [ 59 ], [ 38 ], [ 99 ], [ 105 ],  [ 30 ] ]

  

// flatMap()返回结果
[ 3, 50,  89, 22, 59, 38, 99, 105, 30 ]

  

// flatMap()返回结果个数不唯一，可通过条件筛选
[ 50, 89, 59, 99, 105 ]

2.7 keys()方法

        keys() 方法返回一个包含数组中每个索引键的Array Iterator对象。

语法：

arr.keys()

返回值：一个新的 Array 迭代器对象。

示例：

const words = ["How", "are", "you", "?"];
// 获取keys迭代器
const keysIterator = words.keys();
// 使用for ... of输出
for(const value of keysIterator){
    console.log('key', value);
}

输出结果：

key 0
key 1
key 2
key 3

2.8 values()方法

        values() 方法返回一个新的 Array Iterator 对象，该对象包含数组每个索引的值

语法：

arr.values()

返回值：一个新的 Array 迭代对象。

示例：

const words = ["How", "are", "you", "?"];
// 获取values迭代器
const valuesIterator = words.values();
// 使用for ... of输出
for(const value of valuesIterator){
    console.log('value：', value);
}

输出结果：

value： How
value： are
value： you
value： ?

注：keys()方法是获取数组中所有索引值的迭代器实例，values()方法是获取数组中所有值的迭代器实例。

2.9 some()方法

        some() 方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。

注：如果用一个空数组进行测试，在任何情况下它返回的都是false。

语法：

arr.some(callback(element[, index[, array]])[, thisArg])

参数：

参数名	描述
callback	用来测试每个元素的函数，接受三个参数
element	数组中正在处理的元素。
index	可选的。数组中正在处理的元素的索引值。
array	可选的。some()被调用的数组。
thisArg	可选的。执行 callback 时使用的  this 值。

返回值：数组中有至少一个元素通过回调函数的测试就会返回true；所有元素都没有通过回调函数的测试返回值才会为false。

示例：

const fruits = ['Apple', 'Pear', 'Orange', 'Banana', 'Plum'];
// 判断数组中是否存在Orange
const flagOrange = fruits.some(item => item == "Orange");
const flagGrapes = fruits.some(item => item == "Grapes");
// 输出结果
console.log(flagOrange);
console.log(flagGrapes);

输出结果：

true
false

2.10 toLocaleString()方法

        toLocaleString() 返回一个字符串表示数组中的元素。数组中的元素将使用各自的 toLocaleString 方法转成字符串，这些字符串将使用一个特定语言环境的字符串（例如一个逗号 ","）隔开。

语法：

arr.toLocaleString([locales[,options]]);

参数：

参数名	描述
locales	带有BCP 47语言标记的字符串或字符串数组，关于 locales参数的形式与解释，请看 Intl页面。（可选）
options	一个可配置属性的对象，对于数字  Number.prototype.toLocaleString()，对于日期 Date.prototype.toLocaleString()。（可选）

返回值：表示数组元素的字符串。

示例：

const array1 = [1, 'a', new Date('2023/10/01')];
const localeString = array1.toLocaleString('en', {timeZone: "UTC"});
console.log(localeString);

输出结果：

1,a,10/1/2023, 12:00:00 AM

2.11 @@iterator

        @@iterator 属性和 Array.prototype.values() 属性的初始值是同一个函数对象。

语法：

arr[Symbol.iterator]()

返回值：数组的 iterator 方法，默认情况下，与 values() 函数。

示例：

const number = [2, 5, 8, 11, 15, 18, 21, 23];

// 获取迭代器
const newArr = number[Symbol.iterator]();

// 通过next获取
console.log(newArr.next().value);

// 获取for...of 输出所有元素
for(let val of newArr){
    console.log('val:', val);
}

输出结果：

// 通过next()获取值

2

  

// 通过for...of输出剩下所有元素
val: 5
val: 8
val: 11
val: 15
val: 18
val: 21
val: 23

2.12 Array[@@species]

        Array[@@species] 访问器属性返回 Array 的构造函数。species 访问器属性返回 Array 对象的默认构造函数。子类的构造函数可能会覆盖并改变构造函数的赋值。

语法：

Array[Symbol.species]

返回值：Array 的构造函数。

示例：

// 获取默认的构造器
const constructorArr = Array[Symbol.species];
// 输出结果
console.log(constructorArr);

class myArr extends Array{
    // // 重写 MyArray 的 species 属性到父类 Array 的构造函数
    static get [Symbol.species](){
        return [1, 2, 3];
    }
}

// 获取重写后的构造器
const constructorFunc = myArr[Symbol.species];

// 输出结果
console.log(constructorFunc);

输出结果：

// 默认构造器 

[Function: Array]

  

// 重写后的构造器
[ 1, 2, 3 ]

2.23 from()方法

        Array.from() 方法从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。

语法：

Array.from(arrayLike[, mapFn[, thisArg]])

参数：

参数名	描述
arrayLike	想要转换成数组的伪数组对象或可迭代对象。
mapFn	如果指定了该参数，新数组中的每个元素会执行该回调函数。
thisArg	可选参数，执行回调函数 mapFn 时 this 对象。

返回值：一个新的数组实例。

2.23.1 字符串生成数组

示例：

console.log(Array.from("Hello!"));

输出结果：

[ 'H', 'e', 'l', 'l', 'o', '!' ]

2.23.2 从Set生成数组

示例：

const data = new Set([1, 2, 3, 4, 5]);
console.log(Array.from(data));

输出结果：

[ 1, 2, 3, 4, 5 ]

2.23.3 从Map生成数组

示例：

const data = new Map([ [1, "How"], [2, "are"], [3, "you"] ]);
console.log(Array.from(data));

输出结果：

[ [ 1, 'How' ], [ 2, 'are' ], [ 3, 'you' ] ]

2.23.4 从Map中单独获取key和value

示例：

const data = new Map([ [1, "How"], [2, "are"], [3, "you"] ]);
// 获取键
console.log(Array.from(data.keys()));
// 获取值
console.log(Array.from(data.values()));

输出结果：

[ 1, 2, 3 ]
[ 'How', 'are', 'you' ]

2.23.5 arguments生成数组

示例：

function run(){
    console.log(Array.from(arguments));
};

run('a', 'b', 'c');

输出结果：

[ 'a', 'b', 'c' ]

   2.23.6 使用箭头函数

        示例：

// 将每个元素乘以2输出
console.log(Array.from([1, 2, 3], v => v * 2));

输出结果：

[ 2, 4, 6 ]

2.23.7 数组去重合并

示例：

// 定义去重合并函数
function deMerge(){
    let arr = [].concat.apply([], arguments);
    return Array.from(new Set(arr));
}

let arr1 = [2, 3, 5, 8, 10];
let arr2 = [3, 6, 8, 10, 12];
// 合并并去重
let mergeArr = deMerge(arr1, arr2);
// 输出新数组
console.log(mergeArr);

输出结果：

[ 2, 3,  5, 8, 10, 6, 12 ]

        以上则是表格中收集的所有函数方法，希望对大家开发有所帮助。