典型数组用法（数组方法小结）
典型数组用法（数组方法小结）push:在数组尾部添加元素，会增加数组的长度pop:在数组尾部取出元素，会减少数组的长度按是否会修改原数组分成两大类。var arr = []; arr.push(100);为什么我们可以使用push方法呢？因为arr是通过Array构造器产生的，它相当于是:var arr = new Array(); app.push(100);而按照原型链的规则，app是可以使用Array.prototype上的属性和方法的。也就是说数组对象具有的方法是从Array.prototype上继承而来的。我们可以在浏览器开发者工具中去检查一下：
数组是一种常见的数据结构，数组操作也是前端工程师必知必会的技能。本文针对js中的数组操作进行总结，归类，建议收藏。
1 简介本文总结了js中数组的方法，并做了一些分类。属于基本功能，所有与js打交道的人都可以阅读。
2 主要内容•数组的方法从哪里来•数组的方法分类•几个数组的使用技巧
3 数组的方法从哪里来当我们定义一个数组之后，我们就可以直接使用它的方法。例如：
var arr = [];
arr.push(100);
为什么我们可以使用push方法呢？因为arr是通过Array构造器产生的，它相当于是:
var arr = new Array();
app.push(100);
而按照原型链的规则，app是可以使用Array.prototype上的属性和方法的。也就是说数组对象具有的方法是从Array.prototype上继承而来的。
我们可以在浏览器开发者工具中去检查一下：
按是否会修改原数组分成两大类。
4.1 改变原数组的方法4.1.1 push/pop方法push:在数组尾部添加元素，会增加数组的长度
pop:在数组尾部取出元素，会减少数组的长度
var arr = [1 2 3 4 5];
arr.push(6);
console.log(arr); // [1 2 3 4 5 6]
let b = arr.pop();
console.log(arr); // [1 2 3 4 5]
console.log(b); // 6
值得注意的是push()是可以一次添多个元素的，例如arr.push(1 2 3)。
4.1.2 shift/unshift方法unshift: 在头部添加元素，会增加数组的长度
shift:在头部删除元素
var arr = [1 2 3 4 5];
arr.shift();
console.log(arr); // [2 3 4 5]
arr.unshift(6);
console.log(arr); // [6 2 3 4 5]4.1.3 sort：排序
对数组进行排序，会影响数组元素
var arr = [21 1 3 45 2];
arr.sort();
console.log(arr); // (5) [1 2 21 3 45]
arr.sort((a b)=>a-b);
console.log(arr); // (5) [1 2 3 21 45]4.1.4 reverse：数组翻转
var arr = [1，2，3];
arr.reverse();
console.log(arr); // [3，2，1]4.1.5 fill：元素填充
fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。
格式
arr.fill(value[ start[ end]])
参数:
•value用来填充数组元素的值。•start 可选 . 起始索引，默认值为0。•end 可选. 终止索引，默认值为 this.length。
var arr=[1 2 3 2 5];
arr.fill(1 2 4); // 用1填充数组中从起始索引到终止索引内的全部元素
console.log(arr); // (5) [1 2 1 1 5]4.1.6 splice方法：会改变数组
它通过删除或替换现有元素或者原地添加新的元素来修改数组 并以数组形式返回被修改的内容。它是功能最强大的一个方法。
格式：
arr.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() 将只删除数组元素。
所以它可以实现：
•添加功能•删除功能•修改功能
var arr = [1 2 3];
arr.splice(0 0 'a' 'b'); // 向数据的头部添加元素'a' 'b'
arr.splice(0 3); // 从下标为0的元素开始，删除3个元素。以数组的格式返回删除的元素
arr.splice(2 1 "a");// 从下标为2的元素开始，删除1个，并插入a。相当于arr[2] = "a"。以数组的格式返回删除的元素4.2 不改原数组的方法
•concat•slice•join
4.2.1 concat作用：实现拼接数组。它不会改变原数组，会返回一个拼接后的新数组
var arr1 = [1 2 3];
var arr2 = [3 4];
arr1.concat(arr2);
console.log(arr1.length); // 3。arr1不会变化。
console.log(arr1.concat(arr2)) // [1 2 3 3 4]4.2.2 slice方法
作用：从数组中截取出一部分，并以数组的格式返回，不会改变原数组
格式：slice(下标起点，下标终点）
var arr = [1 2 3 4 5 6];
console.log(arr); // (6) [1 2 3 4 5 6]
console.log(arr.length); // 6
console.log(arr.slice(1 4)); // (3) [2 3 4]4.2.3 join方法
作用：返回一个字符串。不会改变原数组。
var arr = [1 2 3 4 5];
arr.join('-');
console.log(arr); // [1 2 3 4 5]
console.log(arr.join('-')); // '1-2-3-4-5'4.2.4 indexOf/lastIndexOf方法
在数组中查找元素所在的下标。不会改变数组，返回指定数值的数组下标
var arr = [1 2 3 2 5];
console.log(arr.indexOf(2)); // 1 返回值为2的数组的下标
console.log(arr.indexOf(2 2)); // 3 第一个参数表示要查找的数，第二个参数表示查找起点位置的索引
console.log(arr.indexOf(6)); // -1
console.log(arr.lastIndexOf(2)); // 3 从数组的末尾开始向前查找，返回正序下标
console.log(arr.lastIndexOf(2 2)); // 1 从数组的末尾开始向前查找，返回正序下标4.2.5 forEach方法
最常见的遍历操作，它不会改变数组且方法没有返回值
var arr = [1 2 3 2 5];
arr.forEach(function(a index array) {
// 循环遍历 对每一项运行给定函数 这个方法没有返回值
// 参数分别为：遍历的数组内容 内容对应的数组索引 数组本身
console.log(a index array === arr);
// 1 0 true
// 2 1 true
// 3 2 true
// 2 3 true
// 5 4 true
})
console.log(arr); // [1 2 3 2 5]
var arr1 = arr.forEach(function(a) { // forEach方法没有返回值
return a * 2;
})
console.log(arr1); // undefined4.2.6 map方法
返回一个新数组，这个新数组中的每一项是对原数组中每一项调用某个函数而得到的。
var arr = [1 2 3 2 5];
var arr1 = arr.map(function(a) {
// 对每一项运行给定函数，返回每次函数调用的结果组成的数组
return a * 2;
})
console.log(arr); // (5) [1 2 3 2 5]
console.log(arr1); // (5) [2 4 6 4 10]4.2.7 filter方法
不会改变原数组，且返回一个新数组，新数组中的项是从原数组中选出来的某些项组成。
var arr = [1 2 3 2 5];
var arr1 = arr.filter(function(a) {
// 返回满足过滤条件组成的数组
return a > 2;
})
console.log(arr); // (5) [1 2 3 2 5]
console.log(arr1); // (2) [3 5]4.2.8 every方法
不会改变原数组，且返回一个布尔值 。
判断数组中每一项都是否满足条件，所有项都满足条件才会返回true
var arr = [1 2 3 2 5];
var arr1 = arr.every(function(a) {
// 判断数组中每一项都是否满足条件，所有项都满足条件才会返回true
return a > 2;
})
console.log(arr); // (5) [1 2 3 2 5]
console.log(arr1); // false4.2.9 some方法
不会改变原数组，且返回一个布尔值**
var arr = [1 2 3 2 5];
var arr1 = arr.some(function(a) {
// 判断数组中每一项都是否满足条件，只要有一项满足条件就会返回true
return a > 2;
})
console.log(arr); // (5) [1 2 3 2 5]
console.log(arr1); // true4.2.10 reduce方法
不会改变原数组，迭代数组的所有项，然后构建一个最终返回的值，从数组的第一项开始，逐个遍历到最后。
var arr = [1 2 3 2 5];
// reduce方法有两个参数：在每一项上调用的函数和（可选的）作为归并基础的初始值
// reduce方法的函数接收 4 个参数：前一个值、当前值、项的索引和数组对象
// 这个函数返回的任何值都会作为第一个参数自动传给下一项
// 第一次迭代发生在数组的第二项上，因此第一个参数是数组的第一项，第二个参数是数组的第二项
var sum = arr.reduce(function(pre cur index array) {
return pre cur;
} 10)
console.log(arr); // (5) [1 2 3 2 5]
console.log(sum); // 234.2.11 reduceRight
不会改变原数组，迭代数组的所有项，从数组的最后一项开始，向前遍历到第一项
var arr = [1 2 3 2 5];
var sum = arr.reduceRight(function(pre cur index array) {
return pre cur;
} 10)
console.log(arr); // (5) [1 2 3 2 5]
console.log(sum); // 234.2.12 find/findIndex：
不会改变原数组，返回数组中满足提供的测试函数的第一个元素的值/下标
var arr = [1 2 3 2 5];
var arr1 = arr.find(ele=>ele>=2); // 返回数组中满足提供的测试函数的第一个元素的值
console.log(arr1); // 2
console.log(arr); // (5) [1 2 3 2 5]4.2.13 includes方法
用来判断一个数组是否包含一个指定的值，返回 true或 false
var arr = [1 2 3 2 5];
console.log(arr.includes(2)); // true
console.log(arr.includes(6)); // false4.2.14 toLocaleString
不会改变原数组，返回一个字符串表示数组中的元素，数组中的元素将使用各自的 toLocaleString 方法转成字符串，这些字符串将使用一个特定语言环境的字符串（例如一个逗号 “ ”）隔开
var arr = [11111111 2222222];
console.log(arr.toLocaleString()); // 11 111 111 2 222 222
console.log(arr); // (2) [11111111 2222222]4.2.15 toString
不会改变原数组，返回一个字符串，表示指定的数组及其元素
var arr = [1 2 3];
arr.toString();
console.log(arr.toString()); // '1 2 3'
console.log(arr); // (3) [1 2 3]4.3 静态方法4.3.1 Array.from()
将伪数组或可迭代对象(包括arguments Array Map Set String…)转换成数组对象
// arrayLike：想要转换成数组的伪数组对象或可迭代对象
// mapFn (可选参数)：如果指定了该参数，新数组中的每个元素会执行该回调函数
// thisArg (可选参数)：可选参数，执行回调函数 mapFn 时 this 对象
// 返回值：一个新的数组实例
Array.from(arrayLike mapFn thisArg)4.3.2 Array.isArray
判断是否是数组
var obj = {}
console.log(Array.isArray(obj) ） // false5 小结
javascript的数组方法中
•会改变原数组的方法有：unshift shift pop push sort reverse splice fill•返回值是布尔值的方法有：Array.isArray includes some every•参数可以是函数的是方法有：sort map forEach filter some every reduce find findIndex•功能最强大的是splice
