JavaScript数组方法总结，本文是根据数组原型上的方法进行总结，由于方法太多将会分篇章发布

通过浏览器控制台 console 可查看到 Array 数组上原型的所有方法（如下图）。对于原型问题此文章暂不过多叙述，单针对对象中的方法进行自我看法的总结；细心的同学可以发现对象原型上所携带的方法基本上是我们敲代码时所使用过的，文章部门叙述引用于MDN；第一篇章，后面会陆续发布第二篇第三篇预计在8月15号左右总结完数组的所有方法，总结起来发现很多方法在之前工作中某个场景使用很合适但是当时总是想不起来，想在趁有空对一些方法进行重新回顾，温故而知新

Array.prototype.at() 

 at() 方法接收一个下标并返回该下标所对应的数组的数据，下标值允许是正数或者负数。如果是负整数则会从数组的最后开始向前进行搜索并返回对应下标的数组数据，如果下标值超过数组的长度则返回 undefined。

let arr = ['aaa','bbb','ccc','ddd','fff'];

console.log(arr.at(0));   // 'aaa'

console.log(arr.at(1));   // 'bbb'

console.log(arr.at(-1));  // 'fff'

console.log(arr.at(5));   // undefined

Array.prototype.concat() 

  concat() 方法用于合并两个或多个数组，并且此方法不会更改原数组，而是返回一个新数组由被调用的对象中的元素组成，每个参数的顺序依次是该参数的元素或参数本身。嵌套数组不会对里面的数组进行展开合并，仅对数组的单层数据进行合并处理，而且改方法不会改变this或任何作为参数提供的数组，而是返回一个浅拷贝，它包含与原始数组相结合的相同元素的副本。 原始数组的元素将复制到新数组中。

对象引用（而不是实际对象）：concat将对象引用复制到新数组中。 原始数组和新数组都引用相同的对象。 也就是说，如果引用的对象被修改，则更改对于新数组和原始数组都是可见的。 这包括也是数组的数组参数的元素。
数据类型如字符串，数字和布尔：concat将字符串和数字的值复制到新数组中。

例：

let arr = ['aaa','bbb'],

    arr2 = ['ccc','ddd','fff'];
console.log(arr.concat(arr2));   // ['aaa', 'bbb', 'ccc', 'ddd', 'fff'] // 可定义一个新的变量进行接收

let arr = ['aaa','bbb']
console.log(arr.concat(1,[2,3]));   // ['aaa','bbb',1,2,3]

let arr = ['aaa','bbb'],

    arr2 = ['ccc','ddd','fff'],
　　 arr3 = [1,2,3],
    arr4 = arr.concat(arr2,arr3);
console.log(arr.concat(arr2,arr3));   // ['aaa', 'bbb', 'ccc', 'ddd', 'fff',1,2,3]
console.log(arr4);   // ['aaa', 'bbb', 'ccc', 'ddd', 'fff',1,2,3]

var num1 = [[1]],　　num2 = [2, [3]],　　num3=[5,[6]];


var nums = num1.concat(num2);

console.log(nums);  // [[1], 2, [3]]

var nums2=num1.concat(4,num3);

console.log(nums2);  // [[1], 4, 5,[6]];

Array.prototype.constructor()

 consrtuctor() 不做过多叙述可 点击此处 前往了解具体描述；

Array.prototype.copyWithin()

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

let  arr = ['a',1,'b',2,'c',3];
console.log(arr.copyWithin(0,3,4)); // [2,1,'b',2,'c',3]  此处是将原数组中的第3项赋值给第0项
console.log(arr.copyWithin(1,3));  //  [2, 2, 'c', 3, 'c', 3] 

Array.prototype.copyWithin() 

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

let  arr = ['a',1,'b',2,'c',3];
console.log(arr.copyWithin(0,3,4)); // [2,1,'b',2,'c',3]  此处是将原数组中的第3项赋值给第0项
console.log(arr.copyWithin(1,3));  //  [2, 2, 'c', 3, 'c', 3] 

 Array.prototype.entries()

　entries() 方法返回一个新的 Array Iterator 对象，该对象包含数组中每个索引的键/值对。其原型上有一个 next方法可供调用，可用于获取原数组的 【key value】;

let arr = ['aaa','bbb','ccc'],
　　arr2 = arr.entries();
console.log(arr2);  //   得到一个 Array Iterator
console.log(arr2.next()); //  可复制到浏览器控制台中进行测试

console.log(arr2.next().value); // [0,'aaa']
console.log(arr2.next().value); // [1,'bbb']

//

Array.prototype.every()

   every() 方法用于测试调用其的数组是否通过传入的函数的校验；

/* 语法 arr.every(callback(element[index[array]])[thisArg])
　　callback  回调函数；可接受三个参数
　　　　　　　　　　　　　1. element  用于测试的当前的值；
　　　　　　　　　　　　　2. index    用于测试的当前的索引值；
　　　　　　　　　　　　　3. array    调用 every 的函数；
　　thisArg  执行 callback 时的 this 值；

　　every 方法为数组中的每个元素执行一次 callback 函数，直到它找到一个会使 callback 返回 falsy（虚值假值）的元素。如果发现了一个这样的元素，every 方法将会立即返回 false。否则，callback 为每一个元素返回 true，every 就会返回 true。callback 只会为那些已经被赋值的索引调用。不会为那些被删除或从未被赋值的索引调用。

　　callback 在被调用时可传入三个参数：元素值，元素的索引，原数组。

　　如果为 every 提供一个 thisArg 参数，则该参数为调用 callback 时的 this 值。如果省略该参数，则 callback 被调用时的 this 值，在非严格模式下为全局对象，在严格模式下传入 undefined。

　　every 不会改变原数组。

　　every 遍历的元素范围在第一次调用 callback 之前就已确定了。在调用 every 之后添加到数组中的元素不会被 callback 访问到。如果数组中存在的元素被更改，则他们传入 callback 的值是 every 访问到他们那一刻的值。那些被删除的元素或从来未被赋值的元素将不会被访问到。

　　every 和数学中的"所有"类似，当所有的元素都符合条件才会返回 true。正因如此，若传入一个空数组，无论如何都会返回 true。*/

---------------------------------------------------------------
let arr = ['aaa','bbb','ccc'];
let fn = (value)=> !value;
console.log(arr.every(fn));    // false

let arr = ['aaa','bbb','ccc'];
 let fn = (value)=> typeof value === 'string';
 console.log(arr.every(fn));   // true

let arr = ['aaa','bbb','ccc',111];
let fn = (value)=> typeof value === 'string';
console.log(arr.every(fn));   // false

 Array.prototype.fill()

 　fill() 方法用于固定一个值并填充数组从开始下标到结束下标的全部元素，且不包括结束索引；并返回操作后的数组；

/* 语法 arr.every(value(start[end]))
　　value  用来填充数组元素的值；
　　start  起始下标；
　　end    结束下标； 

　　fill 方法接受三个参数 value、start 以及 end、start 和 end 参数是可选的，其默认值分别为 0 和 this 对象的 length 属性值。

　　如果 start 是个负数，则开始索引会被自动计算成为 length + start，其中 length 是 this 对象的 length 属性值。如果 end 是个负数，则结束索引会被自动计算成为 length + end。

　　fill 方法故意被设计成通用方法，该方法不要求 this 是数组对象。

　　fill 方法是个可变方法，它会改变调用它的 this 对象本身，然后返回它，而并不是返回一个副本。

　　当一个对象被传递给 fill 方法的时候，填充数组的是这个对象的引用。*/

---------------------------------------------------------------

Array.prototype.filter()

 　filter() 方法经常用于过滤一个数组；并返回一个新的数组，其包含过滤后的所有元素；

/* 语法 let newArr = arr.filter(callback(element[index[array]])[thisArg])
　　 callback   回调函数，用于过滤测试数组中的每一个元素的函数。根据定义的校验规则如果通过则返回 ture 保留该元素并添加进返回的新数组中。不通过校验规则返回 false 则不添加进返回的新数组中；其接受三个可选参数
　　　　　　　　element  数组中正在处理的元素；
　　　　　　　　index    正在处理的元素的下标；
　　　　　　　　array    调用其方法filter的数组本身；
 　　thisArg    调用执行callback回调函数时用于的this值，可选参数。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ，"this" 的值为 "undefined"*/

---------------------------------------------------------------
 
//从上面图片可以看出filter类似于for循环，循环对数组进行处理；其实现方法也可使用for循环实现，但是为什么还要用filter呢？最直白的理解因为简单省事代码少还凸显开发水平！！

// 例： let arr = [1,2,'a',3,4,5,6,'aa',7,8,9,'aaa'];// 快速过滤出Number类型 

 - filter 实现 两行结束甚至代码优化合并下可以更少 

 - for 循环实现；这一对比结果一目了然；

// 当然filter的功能远不止过滤一个数字出来如此简单

// 过滤出数组中的奇数

let newArr = [1,2,'a',3,4,5,6,'aa',7,8,9,'aaa'].filter(function(item){
　　return item%2 && item>0
})
console.log(newArr)  //[1,3,5,7,9]

console.log([1,2,'a',3,4,5,6,'aa',7,8,9,'aaa'].filter(item => item%2&&item)) //此处得出的结果和上面是一样的，但是上面的代码太多了，不符合我摸鱼的个性，还是简写成这样更能体现出我的开发水平；

// 去除数组中的重复项

let newArr = [1,1,2,2,3,3,4,4,5,5].filter((element,index,array)=> array.indexOf(element)==index);
console.log(newArr) // [1,2,3,4,5]

Array.prototype.find() 

　find() 方法返回数组中满足提供的测试函数的第一个元素，如果没有返回 undefined；callback 函数会为数组中的每个索引调用即从 0 到 length - 1，而不仅仅是那些被赋值的索引，这意味着对于稀疏数组来说，该方法的效率要低于那些只遍历有值的索  引的方法。 em... 似曾相识的 callback 似曾相识的参数

/* 语法 let value = arr.find(callback(element[index[array]])[thisArg])
　　 callback   回调函数，其接受三个可选参数
　　　　　　　　element  数组中正在处理的元素；
　　　　　　　　index    正在处理的元素的下标；
　　　　　　　　array    调用其方法find的数组本身；
 　　thisArg    调用执行callback回调函数时用于的this值，可选参数。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ，"this" 的值为 "undefined"*/

---------------------------------------------------------------

let arr = [1,2,'a',3,4,5,6,'aa',7,8,9,'aaa'];
console.log(arr.find(item => item > 1)) // 2 你会发现数组中有好几个大于 1 的值；但是只返回了一个值2

// 也可以快速查找到匹配的对象数据
let arr = [{name: '百度', id: 1},{name: '谷歌', id: 2},{name: 'EDG', id: 3}];
arr.find(value => value.name == '谷歌') // {name: '谷歌', id: 2}
arr.find(value => value.name == '火狐') // undefined 

Array.prototype.findIndex() 

　findIndex() 方法返回匹配到的第一个值得下标，如果没有匹配到则返回 -1；find（）方法是返回其值，findIndex是返回其下标；调用参数基本上一致

/* 语法 let index = arr.findIndex(callback(element[index[array]])[thisArg])
　　 callback   回调函数，其接受三个可选参数
　　　　　　　　element  数组中正在处理的元素；
　　　　　　　　index    正在处理的元素的下标；
　　　　　　　　array    调用其方法findIndex的数组本身；
 　　thisArg    调用执行callback回调函数时用于的this值，可选参数。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ，"this" 的值为 "undefined"*/

---------------------------------------------------------------

let arr = [1,2,'a',3,4,5,6,'aa',7,8,9,'aaa'];
console.log(arr.findIndex(item => item > 1)) // 1 

// 也可以快速查找到匹配的对象数据的下标
let arr = [{name: '百度', id: 1},{name: '谷歌', id: 2},{name: 'EDG', id: 3}];
arr.findIndex(value => value.name == '谷歌') // 1
arr.findIndex(value => value.name == '火狐') // -1

Array.prototype.findLast() 

 　findLast() 方法返回匹配到的最后一个元素的值，如果没有匹配到则返回 undefiner；find（）方法是从前往后查询，findLast是从后往前查询；调用参数基本上一致

/* 语法 let lastValue = arr.findLast(callback(element[index[array]])[thisArg])
　　 callback   回调函数，其接受三个可选参数
　　　　　　　　element  数组中正在处理的元素；
　　　　　　　　index    正在处理的元素的下标；
　　　　　　　　array    调用其方法findLast的数组本身；
 　　thisArg    调用执行callback回调函数时用于的this值，可选参数。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ，"this" 的值为 "undefined"*/

---------------------------------------------------------------

let arr = [1,2,'a',3,4,5,6,'aa',7,8,9,'aaa'];
console.log(arr.findLast(item => item > 1)) // 9 

Array.prototype.findLastIndex() 

 　findLastIndex() 方法返回从后向前查询匹配到的第一个值得下标，如果没有匹配到则返回 -1；findIndex（）方法是返回从前向后查询匹配其值的下标，findLastIndex是返回从后向前查询匹配其下标的下标；调用方法基本上一致

/* 语法 let lastIndex = arr.findLastIndex(callback(element[index[array]])[thisArg])
　　 callback   回调函数，其接受三个可选参数
　　　　　　　　element  数组中正在处理的元素；
　　　　　　　　index    正在处理的元素的下标；
　　　　　　　　array    调用其方法findIndex的数组本身；
 　　thisArg    调用执行callback回调函数时用于的this值，可选参数。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ，"this" 的值为 "undefined"*/

---------------------------------------------------------------

let arr = [1,2,'a',3,4,5,6,'aa',7,8,9,'aaa'];
console.log(arr.findLastIndex(item => item > 1)) // 返回数组中9的下标，打印结果为 10 

Array.prototype.flat() 

 　flat() 方法按照一个指定的深度递归遍历数组，并将其所有元素遍历到子数组中的元素上进行合并并返回一个新的数组; 将多维数组转为一维数组

/* 语法 let newArr = arr.flat([depth])
　　 depth   默认为1，指定多层嵌套数组的深度*/

---------------------------------------------------------------

let arr = [1,2,[3,4,[5,6,[7,8,[9,10]]]]];
console.log(arr.flat()) //  [1, 2, 3, 4, Array(3)]
console.log(arr.flat(4)) //  [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
console.log(arr.fiat(100)) //  [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]  这里就如果不知道数组层数的时候可直接传入一个很高的数值
console.log(arr.flat('a')) // 如果这里传入的不是数字或小于1的数字会使用默认值 0，并返回原来其调用的数组；如果传入小数不会对小数进行处理只对整数值进行处理

Array.prototype.flatMap() 

 　flatMap() 方法与 flat 方法几乎相同，但是 faltMap方法会更高效一些

/* 语法 let newArr = arr.flatMap(callback[currentValue[index[]array]],[thisArg])
　　 callback       回调函数可接收到三个参数
　　　　 currentValue   当前正在处理的数组元素
　　　　 index          当前正在处理的数组元素的下标
　　　　 array          当前调用 flatMap 的数组
　　 thisArg        调用执行callback回调函数时用于的this值，可选参数。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ，"this" 的值为 "undefined

*/

---------------------------------------------------------------

let arr = [1,2,[3,4,[5,6,[7,8,[9,10]]]]];
console.log(arr.flat()) //  [1, 2, 3, 4, Array(3)]
console.log(arr.flat(4)) //  [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
console.log(arr.fiat(100)) //  [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]  这里就如果不知道数组层数的时候可直接传入一个很高的数值
console.log(arr.flat('a')) // 如果这里传入的不是数字或小于1的数字会使用默认值 0，并返回原来其调用的数组；如果传入小数不会对小数进行处理只对整数值进行处理

JavaScript数组方法总结，本文是根据数组原型上的方法进行总结，由于方法太多将会分篇章发布的相关教程结束。