扩展运算符
基本使用
console.log(1,...[2,3,4],5);
// 1,2,3,4,5
函数中使用
function add(x, y, z) {return x + y + z;}
add(...[1,2],3)
//6
用扩展运算符代替数组的 apply
- 我们可以使用扩展运算符展开数组,不用依赖于 apply 将数组转化成函数的参数
var args = [0, 1, 2];
ES5 写法
function fun5(x, y, z){...}
fun5.apply(null, args)
ES6 可以达到相同的效果
function fun6(x, y, z){...}
fun6(...arrs)
ES5 写法
var args = [1, 7 ,90, 4]
Math.max.apply(null,args) //90
ES6 写法
var args = [1, 7 ,90, 4]
Math.max(...args) //90
扩展运算符的使用
合并数组
[1, 2, ...arr]
[...arr1,...arr2,...arr3]
解构赋值
const [first, ...arr] = [1,2,3,4,5]
//arr = [2,3,4,5]; first = 1;
const [...arr, last] = [1,2,3,4,5];
// 注意此处 rest 只能为最后一个 Uncaught SyntaxError: Rest element must be last element;
扩展运算符其他的使用
- 实现了 Iterator 的接口的对象都可以使用扩展运算符
eg1:
let nodelist = document.querySelectorAll('div');
var array = [...nodelist];
eg2:let map = new Map([[1,"one"],
[2,"two"],
[3,"three"],]);
[...map.keys()] //[1,2,3]
eg3:
var go = function* () {
yield 1;
yield 2;
yield 3;
}
[...go()] //[1, 2, 3]
数组的方法
- Array.from() // 类数组转为数组
- Array.of() // 一组值转为数组
-
copyWithin(target, start, end)
target(必选) 开始替换的位置 — start 开始选取的位置 ——end 选取结束的位置
let arr = [1,2,3,4,5]; arr.copyWithin(2,0) // [1, 2, 1, 2, 3]
- arr.find(function(value, index, arr){}) // 找到一个符合回调函数条件的值并返回
- arr.findIndex(function(value, index, arr){}) // 同 find,只是它返回 index
- arr.fill(params, start,end) // 用于用 params 填充到数组
- arr.keys(),arr.values(),arr.entries();
for (let index of ['a', 'b'].keys()){console.log(index) //0,1
}
for (let value of ['a', 'b'].value()){console.log(value) //"a","b"
}
for (let [index, value] of ['a', 'b'].entries()){console.log(index, value) //0,"a" 1 ,"b"
}
- arr.include(params, start)// 找一个值返回布尔值
- arr.forEach()
- arr.filter();
- arr.every();
- arr.some();
- arr.map();