一,扩展运算符
扩展运算符(spread)是三个点(...)。他好比rest参数的逆运算,讲一个数组转为用都好分隔的参数序列。
console.log(...[1,2,3]);
//1 2 3
console.log(...[1,2,3,[4,5]]);
//1 2 3 [4,5]
扩展运算符的应用
合并数组
[1,2,...more]代替[1,2].concat(more);
字符串:将字符串转换为数组
[..."MGT360124"]
//["M", "G", "T", "3", "6", "0", "1", "2", "4"]
Map和Se结构,Generator函数
扩展运算符内部调用的是数据结构的 Iterator 接口,因此只要具有 Iterator 接口的对象,都可以使用扩展运算符,比如 Map 结构。
let map = new Map([ [1,"one"],[2,"two"],[3,"three"] ]);
let arr = [...map.keys() ]; //[1,2,3]
generator函数运行之后,返回一个遍历器对象,因此也可以使用扩展运算符
const go = function * (){
yield 1;
yield 2;
yield 3;
};
[...go()];//[1,2,3]
变量go是一个 Generator 函数,执行后返回的是一个遍历器对象,对这个遍历器对象执行扩展运算符,就会将内部遍历得到的值,转为一个数组。
Array.of()将一组值,转换为数组
Array.of(3,12,5) ; //[3,12,5]
Array.of(3).length;//1
Array.of() // []
数据实例的find()和findIndex()
数组实例的find()方法,用于找出第一个符合条件的数组成员,他的参数是一个回调函数,所有数组成员依次执行该函数,知道找出第一个返回值为true的成员,探后返回该成员,如果没有符合条件的成员,则返回undefined。
[1,3,5,10].find( (n) => n>5)
//10
数组实例的findIndex方法的用法与find方法非常相似,返回第一歌符合条件的数组成员的位置,如果所有成员都不符合条件则返回-1;
[1,5,9,16].findIndex(function(value,index,arr){
return value >9;
})
//三个参数分别为:当前的值,当前的位置,原数组。
数组实例的fill()使用给定值,填充一个数组
["a"."b","c"].fill(5);
//[5,5,5]
new Array.fill(6);
//[6,6,6]
//fill方法还可以接收第二个和第三个参数,用于指定填充的起始位置和结束位置。
['a','b','c'].fill(6,1,2)
//['a',6,'c']
数组实例的entries() ,keys() 和 values()
ES提供了三个新的方法 entries() 和keys() 和values() 用于遍历数组,他们都返回一个遍历器对象,可以使用for ...of 循环进行遍历,唯一的区别是keys()是对键名的遍历,values()是对键值的遍历,entries()是对键值对的遍历。
for (let index of ['a','b'].keys() ) {
console.log(index);
}
//0
//1
for (let elem of ["a","b"].values() ){
console.log(elem);
}
//'a'
//'b'
for ( let [index,elem] of ['a','b'].entries() ) {
console.log(index,elem);
}
//0 "a"
// 1 "b"
数组实例的includes()
在没有这个方法之前,通常是用indexOf()检测是否包含某个数组,indexOf方法的缺点是:不够语义化,没有使用 ===严格相等这样会出现NaN的误判。
[NaN].indexOf(NaN) //-1
[NaN].includes(NaN) //true
[1,2,3].includes(2)//true
[1,2,3].includes(4)//false
数组的空位
数组的空位指的是:数组的某个位置没有任何值
Array(3)//[,,,]
[,,,] == [undefined,undefined,undefined];//false
ES5中的forEach(),fliter()和every()和some()都会跳过空位
map()会跳过空位,但是会保留这个值
join()和toString()会将空位视为undefined,而undefined和null会被处理成空字符串。
// forEach方法遍历,循环。
[,"a","b"].forEach( function (value, index ,array){
console.log(index,value,array)
});
// 1 "a"
//2 'b'
// filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。
['a', , 'b'].filter( function (x) {
return true;
})
//["a","b"]
//every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。
[,'a'].every(x => x==='a') // true
//some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。
[,'a'].some(x => x !== 'a') // false
// map方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
[,'a'].map(x => 1) // [,1]
ES6中entries()、keys()、values()、find()和findIndex()会将空位处理成undefined。