总结15个数组相关的方法

let arr = ['关', '张', '马', '黄', '赵'];   //  创建通用数组

let changedArr = [];

1.shift: 从数组首部删除元素 以数组形式返回被删除的元素

changedArr = arr.shift();

console.log(arr);  //  ['张', '马', '黄', '赵']

console.log(changedArr);  //  ['关']

--------------------------分割线------------------------

也可使用该方法直接在控制台输出数组首部元素(不影响原数组为前提),具体:

console.log(arr.shift());  //  ['关']

2.unshift:从数组首部添加元素 将一个或多个元素添加到数组的首部，并返回该数组的新长度。

changedArr = arr.unshift('曹', '刘');

console.log(arr);  //  ['曹', '刘', '关', '张', '马', '黄', '赵'];

console.log(changedArr);  //  7     这里返回改变后数组长度length

3.push:从数组末尾添加元素 将一个或多个元素添加到数组的末尾，并返回该数组的新长度。

changedArr = arr.push('曹', '刘');

console.log(arr);  //  ['关', '张', '马', '黄', '赵', '曹', '刘'];

console.log(changedArr);  //  7     这里返回改变后数组长度length

4.pop:从数组末尾删除元素 以数组形式返回被删除的元素

changedArr = arr.pop();

console.log(arr);  //  ['关', '张', '马', '黄'];

console.log(changedArr);  //  ['赵']

--------------------------分割线------------------------

也可使用该方法直接在控制台输出数组末尾元素(不影响原数组为前提),具体:

console.log(arr.pop());  //  ['赵']

5.slice:此方法可传入两个参数: slice(begin, end)  用来浅拷贝并返回一个新数组, 其中以begin开始 (包括begin索引的值) 并以end结束 (不包括end索引的值)

console.log(arr.slice(1, 3));  //  ['张', '马']

console.log(arr.slice(-2);  //  ['黄']    index以第一个值为0,末尾开始第一个为-1

console.log(arr.slice(1,-1));  //  ['张', '马', '黄']

6.splice: 三个参数: splice(index, deleteCount, item)  用来添加或替换 新元素或数组, 其中index为进行splice操作的索引处, deleteCount为要替换的元素数量(为0时则是添加作用), item 替换项,可以是元素或数组

arr.splice(2, 0, '董');

console.log(arr);  //  ['关', '张', '董', '马', '黄', '赵']

--------------------------分割线------------------------

返回值为被删除部分

console.log(arr.splice(4, 1, '董'));  //  ['赵']

7.reduce * (这一块我也没搞很清楚,这里只是一种用法) 参数为一个函数和一个初始值: reduce(reducer, num)     reducer 内为: (previousValue, currentValue) => previousValue + currentValue;   此方法对数组内的每个元素执行一次reducer函数, 并记住每一次计算的值 给下一次的 previousValue 然后再次计算,反复迭代,最终达到累加的目的

这里需重新定义数组  arr1 = [1, 2, 3, 4, 5]

arr1.reduce((pre, cur) => pre + cur , 3)

console.log(arr1);   //  18

8.forEach: 参数为一个函数: forEach(fun)  调用此方法的数组内每个元素都执行一次fun函数

返回值 undefined

arr.forEach(it => console.log(it)); 

 //   '关' 

'张'

'马'

'黄'

'赵'

9.find: find() 方法返回数组中满足提供的测试函数的第一个元素的值。无满足项返回 undefined。

const array1 = [5, 12, 8, 130, 44];

const found = array1.find(element => element > 10);

console.log(found);

10.findIndex: findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回-1。

const array1 = [5, 12, 8, 130, 44];

const isLargeNumber = (element) => element > 13;

console.log(array1.findIndex(isLargeNumber)); // 3

11.filter: 传入一个函数参数: filter(fun)   直译 过滤器, 此方法创建一个新数组,并将过滤条件筛选出来的元素放入

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);  // ["exuberant", "destruction", "present"]

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

const elements = ['Fire', 'Air', 'Water'];

console.log(elements.join());// "Fire,Air,Water"


console.log(elements.join(''));// "FireAirWater"


console.log(elements.join('-'));  //  "Fire-Air-Water"

13.map: 一个函数为参数: map(fun) 创建一个新数组，其结果是该数组中的每个元素是调用一次fun后的返回值。

const array1 = [1, 4, 9, 16];

const map1 = array1.map(x => x * 2);

console.log(map1);  //  [2, 8, 18, 32]

14.indexOf: 同findIndex. 返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。

const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];

console.log(beasts.indexOf('bison'));  // 1


console.log(beasts.indexOf('bison', 2));  // 4


console.log(beasts.indexOf('giraffe')); // -1

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

const array1 = [1, 2, 'a', '1a'];

console.log(array1.toString());// "1,2,a,1a"