扩展运算符
扩展运算符就是三个点 (...),如果rest参数的逆运算,将一个数组转换为用逗号分隔的参数。
console.log(...[1,2,3]) // 1 2 3
// 如果扩展运算符后面是一个空数组 则不产生任何效果
[...[],1] // [1]
能够代替数组的apply方法
//ES5的写法
function f(x,y,z){
// ...
}
var args = [0,1,2];
f.apply(null,args)
// ES6 的方法
function f(x,y,z){
// ...
}
var arg =[1,2,3];
f(...arg);
合并数组
// ES5
arr1.concat(arr2);
// ES6
[...arr1,arr2]
与结构赋值结合
let [first,...rest] = [1,2,3,4,5]'
first // 1
rest // [2,3,4,5]
// 结构赋值的时候只能把扩展运算符放到最后面不然那会报错
把字符串变成数组
console.log([...'hello']) // [h,e,l,l,o]
Arrar.from()
Array.from 方法用于将两类对象转换为真正的数组。类似数组的对象和可遍历对象。(包括ES6新增的数据结构Set和Map)。 下面是一个类似与数组的对象 Array.from()将它转化为真正的数组。
let obj ={
'0':'a',
'1':'b',
length:2
}
console.log(Array.from(obj)) // ['a','b']
/*
里种对象,目前我遇到比较少。
以至于我在写demo的时候没写length导致打印出来的是 [] 这里length表示数组的长度是多少,
如果写的是1那么打印的结果是['a']
如果length为3 那么打印出来就是 ['a','b',undefined]
*/
Array.from() 还可以接受第二个参数,作用类似于数组的map方法。用来对每个元素进行处理
Array.from([1,2,3],(x)=>x*x) // [1,4,9]
Array.of()
Array.of() 方法将一组数值转换为数组。 Array.of(1,2,3) // [1,2,3] 这个方法主要弥补构造方法 Array的不足
Array()// []
Array(3) // [,,]
Array(1,2,3) // [1,2,3]
// 上面代码中 1个、2个、3个参数时返回的结果不一样。只有两个参数以上才会转换为新数组。
数组中find和findIndex()
find() 方法和findIndex() 方法
//find,一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回true的成员。如果没有符合条件的成员直接返回 undefined
[1,2,3,4].find((n)=>n>3) // 4
// findIndex()用法与find相似。返回的结果是第一个符合要求元素的位置.如果所有成员都不符合要求。返回 -1
[1,2,3,4].findIndex(n=>n>2) // 2
fill()方法
// fill方法使用给定值填充一个数组
['a','b','c'].fill(7); // [7,7,7]
// fill 方法可以接受第二个和第三个参数 用于指定填充的起始位置和结束位置。
[1,2,3].fill(7,1,2);// [1,7,3]
数组实例的includes()
Array.includes方法返回一个布尔值,表示某个数组是否包含给定的值。
[1,2,3].includes(1) // true
[1,2,3].ncludes4) // false
[1,2,NaN].includes(NaN) // true
// 没有 includes 方法我们都是用 indexOf方法来判断
/*
indexOf 两个缺点
1.不够语义化,其含义是找到参数值的第一个出现位置,所以要比较是否不等于 -1.
2. 其内部使用严格相等运算符 === 进行,会导致对NaN的误判。
*/
以上是ES6常用的几种方法,还有一些我没有举例出来。我感觉在实际工作中用的不多(可能是我项目经验较少) 如果有错误,请您指正。5