Array.from()
:从一个类似数组或可迭代对象创建一个新的,浅拷贝的数组实例;典型的“类似数组的对象”是函数的arguments对象,以及大多数 DOM 元素集,还有字符串。
Array.from('foo');//["f", "o", "o"] 从String生成数组 function foo(){ //函数参数,大家都知道函数的arguments是一个类数组 return Array.from(arguments) } foo([1,2,3]) //[1,2,3] const set = new Set(['foo', 'bar', 'baz', 'foo']);//Set也可以 Array.from(set);// [ "foo", "bar", "baz" ] const map = new Map([[1, 2], [2, 4], [4, 8]]);//Map也行哦 Array.from(map);// [[1, 2], [2, 4], [4, 8]] const mapper = new Map([['1', 'a'], ['2', 'b']]); Array.from(mapper.values());// ['a', 'b']; Array.from(mapper.keys());// ['1', '2'];
Array.of():将一系列值转换成数组;比如:
Array.of(1,2,3)//会得到[1,2,3] let items = Array.of(1, 2); console.log(items.length); // 2 console.log(items[0]); // 1 console.log(items[1]); // 2 items = Array.of(2); console.log(items.length); // 1 console.log(items[0]); // 2
Array.find()与Array.findIndex() 这两个是干嘛的嘞,.find()是用于找出第一个符合条件的数组成员;而 .findIndex()是用于找出第一个符合条件的数组成员下标;使用方法如下:
[1, 2, 4, 8].find((n) => n > 4) // 8 [1, 2, 4, 8].findIndex((n) => n > 4) // 3
数组实例的 entries(),keys() 和 values();这三个方法是在遍历的时候才会用到;分别是遍历【下标、值】、下标和值;使用方法如下:
const array=[7,8,9] for(let [index, item] of array.entries()){ console.log(index) console.log(item) } // 0 7 // 1 8 // 2 9 for(let index of array.keys()){ console.log(index) } // 0 // 1 // 2 for(let item of array.values()){ console.log(item) } // 7 // 8 // 9
Array.includes()方法;此方法返回一个布尔值,用于判断数组里是否有我们要找的,某个值;与indexOf方法类似(不过indexOf返回的是-1或者下标)。使用方法如下:
[1, 2, 3].includes(2) // true
[1, 2, 3].includes(4) // false
[1, 2, NaN].includes(NaN) // true 这里需要注意NaN的查询;我们如果使用indexOf方法去查找,会得到什么值,是-1还是2
Array..reduce()方法;此方法是数组的归并方法;可同时将前面数组项遍历产生的结果与当前遍历项进行运算;(我也是通过自己实践慢慢理解的);
完整的array.reduce(function(pre, cur, currentIndex, arr), initialValue);一看,哇!这么多参数啊?干啥呢??
pre:必需。初始值initialValue, 或者计算结束后的返回值。
cur: 必需。当前元素
currentIndex: 可选。当前元素的索引,如果没有提供initialValue,reduce 会从索引1的地方开始执行 callback 方法,跳过第一个索引。如果提供initialValue,从索引0开始 //重点
arr: 可选。当前元素所属的数组对象。
其实我们常用的参数只有两个,pre和cur;下面我们来看下怎么回事儿
var result = [10,20,30]; var sum = result.reduce((pre, cur)=> { return cur + pre; }, 0); console.log(sum) //60 由于传入了初始值0,所以开始时prev的值为0,cur的值为数组第一项10,相加之后返回值为10作为下一轮回调的total值,然后再继续与下一个数组项相加,以此类推,直至完成所有数组项的和并返回。 还可以拉平二维数组哦 let arr = [[0, 1], [2, 3], [4, 5]] let newArr = arr.reduce((pre,cur)=>{ return pre.concat(cur) },[]) console.log(newArr); // [0, 1, 2, 3, 4, 5] 数组去重?也行 let arr = [1,2,3,3,3,1] let newArr = arr.reduce((pre,cur)=>{ if(!pre.includes(cur)){ return pre.concat(cur) }else{ return pre } },[]) console.log(newArr);// [1, 2, 3]
我在项目中常用的es6+的数组方法就介绍完了,有些方法可能没有讲到,我有些没有用过有些用过一两次,就不献丑了,希望对大家有帮助