数组扩展
数组扩展
注:<mark>例子均来源于</mark>http://es6.ruanyifeng.com/
Array.of( )
-
Array.of方法用于将一组值,转换为数组
-
其主要目的是弥补数组构造函数Array( )的不足:因为参数个数的不同,不导致Array()的行为有差异
-
如: let a = Array()//[] let b = Array(3)//[empty*3] let c =Array(3,11,8)//[3,11,8] 只有当参数大于2个时,Array才会返回由参数组成的新数组 当参数只有1个时,实际上是指定数组的长度
-
-
Array.of基本可以替代Array()或new Array(),并且不存在由于参数不同而导致的重载,行为统一
-
其总是返回参数值组成的数组,如果没有参数,就返回一个空数组
-
Array.of的模拟实现
function Arrayof(){ return [].slice.call(arguments)//空数组指向函数参数 } console.log(Arrayof(1,2,3))// [1, 2, 3] console.log(Arrayof(1))// [1] console.log(Arrayof())// [] console.log(Arrayof(undefined))// [undefined] console.log(Arrayof(null))// [null]
-
-
Array.of和Array.from的区别
- Array.from()适用于非数组对象转化为数组的场景,<mark>初衷就是为了解决将非数组对象转换为数组的问题</mark>
- 准确来说,Array.from()并不能算创建数组的一种方式,尽管它有创建数组的功能
数组实例的copyWithin()
-
在当前数组的内部,将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组,使用这个方法
会修改当前的数组
Array.prototype.copyWithin(target,start,end) target:必须,从该位置开始替换数据,如果为负值表示倒数,数组从后往前是-1开始 start:可选,从该位置开始读取数据,默认为0,若为负数,表示从末尾开始 end:可选,到该位置前停止读取数据,默认等于数组长度 这三个参数都应该是数值,如果不是,会自动转为数值。 如[1,2,3,4,5].copyWithin(-1,-2)// [1, 2, 3, 4, 4]
数组实例的find()和findIndex ()方法
-
数组的find()用于找出第一个符合条件的数组成员
-
参数为回调函数,所有成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员,如果没有符合条件的成员,返回undefined
该回调函数有三个参数 value:当前的值 index:当前的位置 arr:原数组
-
-
findIndex
方法的用法与find
方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1
。 -
这两个方法都可以接受第二个参数,<mark>用来绑定回调函数的this对象</mark>
function f(v){ return v>this.age } let person ={ name:'john',age:3} var a = [1,2,3,4,5].find(f,person) //f()中this指向person console.log(a)//4
-
Object.is(value1, value2); value1:第一个需要比较的值。 value2:第二个需要比较的值。
数组实例的fill()
- fill方法使用给定值,填充一个数组
- fill方法用于空数组的初始化,非常方便,<mark>数组中原有的元素会被全部抹去</mark>
- 其可以接受第二个,第三个参数。用于指定填充的起始位置和结束为主
- 如果填充的类型为对象,那么被赋值的是同一个内存地址的对象,而不是深拷贝对象
###数组实例的entries(),keys()和values()
-
entries(),keys()和values()用于遍历数组,都返回一个遍历器对象,可以用for…of循环遍历
keys( )对键名的遍历
values( )对键值的遍历
entries( )对键值对的遍历
数组实例的includes( )
-
Array.prototype.includes方法返回一个布尔值,表示某个数组是否包含给定的值,
与字符串的includes方法类似
-
该方法的第二个参数表示搜索的起始位置,默认为0。若第二个参数为负数,则表示倒数的位置
如果这时它大于数组的长度,则会重置从0开始
注:
如数组长度为3,第二个参数为-4,则重置从0开始
如数组长度为3,第二个参数为4,则返回false,不会从0开始
-
在数组没有includes之前,通常使用indexOf的方法,检查是否包含某个值
var a = [NaN].indexOf(NaN) console.log(a) //-1 而indexOf有两个缺点: 1:不够语义化 2:会对NaN误判,因为它内部使用的是(===)进行判断 var b = [NaN].includes(NaN)// true //includes使用的是不一样的判断算法,就没有这个问题。
- 注:map和set数据结构有一个has方法,与includes区别
- map结构的has方法,用来查找键名的
- set结构的has方法,用来查找值的
- 注:map和set数据结构有一个has方法,与includes区别
数组实例的flat(),flatMap()
-
数组的成员有时还是数组,如[[],[],[]],即嵌套数组,Array.prototype.flat()用于将嵌套数组“拉平”,即变为一维数组
-
该方法返回一个新数组,对元数据没有影响
-
flat()默认只会“拉平”一层,可以添加一个整数参数,“拉平多层
var a = [1,2,[3,4]].flat()//[1, 2, 3, 4] var b = [1,[2,3,[4,5]]].flat()// [1, 2, 3, Array(2)] flat(整数参数) var c = [1,[2,3,[4,5]]].flat(2)// [1, 2, 3, 4, 5]
-
如果不管有多少层嵌套,都要转成一维数组,可以用
Infinity
关键字作为参数。array.flat(Infinity)
如果原数组有空位,flat()方***跳过该空位
#### flatMap
-
flatMap()方法对原数组的每个成员执行一个函数(相当于执行Array.prototype.map()),然后对返回值组成的数组执行flat()方法
该方法返回一个新数组,不改变原数组
-
<mark>flatMap()只能展开一层数组。</mark>
如果遍历函数返回的是一个双层的数组,但是默认只能展开一层,因此
flatMap()
返回的还是一个嵌套数组。 -
flapMap()方法的第一个参数是一个遍历函数,可以接受3个参数
flapMap(当前数组的成员,当前数组成员的位置,原数组)
array.flatMap(function callback(currentValue[,index[,array]]){ }[,thisAarg])
-
第二个参数,用来绑定遍历函数里面的this
###数组的空位
-
指数组的某一个位置没有任何值,如Array(3)返回[,,,]
空位不是undefined,一个位置的值等于undefined依然是有值的.
空位是没有任何值
-
ES5中,forEach(),filter(),reduce(),every(),some()都会跳过空格
map()会跳过这个空位,但是会保留这个值
join()和toString()会将空位视为undefined,而undefined和null会被处理成字符串
-
ES6中,明确将空位转为undefined,
ntries()
、keys()
、values()
、find()
和findIndex()
会将空位处理成undefined
。 -
<mark>由于空位的处理规则非常不统一,所以建议避免出现空位。</mark>