对于数组元素，有很多操作方法，今天来介绍三种最常见操作方法分别是concat()、slice()、splice()方法~

1. concat()

在现在数组全部元素基础上创建一个新数组

1. 创建一个当前数组的副本
2. 把它的参数添加至副本末尾
3. 返回新构建的数组

let colors = ["red", "green", "blue"];
let colors2 = color.concat("yellow", ["black", "brown"]);

console.log(colors); // ["red", "green", "blue"]
console.log(colors2); // ["red", "green", "blue", "yellow", "black", "brown"]

这里可以看出，concat() 对参数数组进行了打平操作 打平数组参数的行为可以重写，方法是在参数数组上指定一个特殊的符号: Symbol.isConcatSpreadable 这个符号可以阻止concat()打平参数数组。

强制不打平数组

let colors = ["red", "green", "blue"];
let newColors = ["black", "brown"];

newColors[Symbol.isConcatSpreadable] = false;

let colors3 = colors.concat("yellow", newColors); // ["red", "green", "blue", "yellow", ["black", "brown"]]

强制打平数组

let colors = ["red", "green", "blue"];
let moreNewColors = {
	[Symbol.isConcatSpreadable]: true,
	length: 2,
	0: "pink",
	1: "cyan"
};

let colors4 = colors.concat("yellow", moreNewColors); // ["red", "green", "blue", "yellow", "pink", "cyan"]

2. slice()

构建一个包含原有数组中一个或多个元素的新数组

接收参数 一个：返回该索引到数组末尾的所有元素 两个：返回从开始索引到结束索引对应的所有元素，不包括结束索引所对应的元素 操作不影响原数组

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

console.log(colors2); // ["green", "blue", "yellow", "purple"]
console.log(colors3); // ["green", "blue", "yellow"]

参数出现负值：用 数组长度+负值 确定位置

3. splice()

• 最强大的数组方法

在数组中间插入元素

1. 删除

传两个参数 ①要删除的第一个元素的位置要 ②删除元素的数量

2. 插入

传三个参数 ①开始位置 ②要删除的元素数量(0) ③要插入的位置

3. 替换

传三个参数 ①开始位置 ②要删除元素的数量 ③要插入的任意多个元素

splice()方法返回一个数组，包含从数组中被删除的元素

let colors = ["red", "green", "blue", "yellow", "purple"];

let colors2 = colors.splice(0, 1); // 删除第一项
console.log(colors); // ["green", "blue"]
console.log(colors2); // ["red"]

let colors3 = colors.splice(1, 0, "yellow", "orange"); // 在位置1插入两个元素
console.log(colors); // ["green", "yellow", "orange", "blue"]
console.log(colors3); // []

let colors4 = colors.splice(1, 1, "red", "purple"); // 插入两个元素，删除一个元素
console.log(colors); // ["green", "red", "purple", "orange", "blue"]
console.log(colors3); // ["yellow"]

数组归并方法

数组有两个归并方法：reduce() 与 reduceRight()

这两个方法都会迭代数组的所有项，并在此基础上构建一个最终的返回值

reduce() 方法从数组第一项开始遍历到最后一项 reduceRight() 方法从最后一项遍历到第一项

使用reduce()还是reduceRight()，主要取决于要从哪头开始遍历数组。除此之外，它们完全相同。

接收两个参数

1. 对每一项都会运行的归并函数
2. 可选的归并起点的初始值

归并函数接收四个参数

1. 上一个归并值
2. 当前项
3. 当前项的索引
4. 数组本身

这个函数返回的任何值都会作为第一个参数自动传给下一项 第一次迭代发生在数组的第二项上，因此第一个参数是数组的第一项，第二个参数就是数组的第二项

例子

let values = [1, 2, 3, 4, 5];
let sum = values.reduce((prev, cur, index, array) => prev + cur);
// 1+2=3  3+3=6   6+4=10  10+5=15
alert(sum); // 15

2. reduce的用法

2.1 数组累加，累乘

一般做法

let values = [1, 2, 3, 4, 5];
let sum = 0;
values.forEach((item)=>{
	sum += item;
})
console.log(sum); // 15

使用reduce

let values = [1, 2, 3, 4, 5];
let sum = values.reduce((prev, cur, index, array) => prev + cur);
console.log(sum); // 15

function Multiplication(...vals) {
    return vals.reduce((prev, cur) => prev * cur, 1);
}
Multiplication(1, 2, 3, 4, 5); // 120

2.2 代替map和filter

const arr = [0, 1, 2, 3];

// 代替map：[0, 2, 4, 6]
const a = arr.map(v => v * 2);
const b = arr.reduce((prev, v) => [...prev, v * 2], []);

// 代替filter：[2, 3]
const c = arr.filter(v => v > 1);
const d = arr.reduce((prev, cur) => cur > 1 ? [...prev, cur] : prev, []);

// 代替map和filter：[4, 6]
const e = arr.map(v => v * 2).filter(v => v > 2);
const f = arr.reduce((prev, cur) => cur * 2 > 2 ? [...prev, cur * 2] : prev, []);

迭代器方法

Array的原型上暴露了3个用于检测数组内容的方法

1. keys() 返回数组索引的迭代器
2. values() 返回数组元素的迭代器
3. entries() 返回索引/值的迭代器

例子

const a = ["apple", "orange", "banana", "strawberry"];

const aKeys = Array.from(a.keys()); // [0, 1, 2, 3]
const aValues = Array.from(a.values()); // ["apple", "orange", "banana", "strawberry"]
const aEntries = Array.from(a.entries()); // [[0, "apple"], [1, "orange"], [2, "banana"], [3, "strawberry"]]

迭代方法

五个迭代方法，都不改变调用他们的数组

• 每个方法接收两个参数

1. 以每一项为参数运行的函数
2. 可选的作为函数运行上下文的作用域对象

• 函数接收三个参数

1. 数组元素
2. 元素索引
3. 数组本身

every()

对数组中的每一项运行给定函数，如果该函数对每一项都返回true，则返回true

some()

对数组中的每一项运行给定函数，如果该函数对任一项返回true，则返回true

例子

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let everyResult = numbers.every((item, index, array) => item > 2); // false
let someResult = numbers.some((item, index, array) => item > 2); // true

filter()

对数组中的每一项运行给定函数，返回该函数会返回true的项组成的数组

map()

对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。

例子

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

forEach()

对数组中的每一项运行给定函数。这个方法没有返回值

相当于使用for循环一个遍历数组

例子

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
numbers.forEach((item, index, array) => {//执行某些操作})