欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

ES6三点扩展运算符教程

程序员文章站 2022-12-09 15:48:41
扩展运算符将一个数组转为用逗号分隔的参数序列 console.log(...[a, b, c]) // a b c 用于: 1将一个数组,变为参数序列...

扩展运算符将一个数组转为用逗号分隔的参数序列

console.log(...[a, b, c])  
// a b c

用于:

1将一个数组,变为参数序列

            let add = (x, y) => x + y;
            let numbers = [3, 45];
            console.log(add(...numbers))//48

2 使用扩展运算符展开数组代替apply方法,将数组转为函数的参数

//es5 取数组最大值
console.log(math.max.apply(this, [654, 233, 727]));
//es6 扩展运算符
console.log(math.max(...[654, 233, 727]))
//相当于
console.log(math.max(654, 233, 727))

3 使用push将一个数组添加到另一个数组的尾部

 

// es5  写法  
var arr1 = [1, 2, 3];  
var arr2 = [4, 5, 6];  
array.prototype.push.apply(arr1, arr2); 
//push方法的参数不能是数组,通过apply方法使用push方法 
// es6  写法  
let arr1 = [1, 2, 3];  
let arr2 = [4, 5, 6];  
arr1.push(...arr2); 

4 合并数组

var arr1 = ['a', 'b'];  
var arr2 = ['c'];  
var arr3 = ['d', 'e'];  
// es5 的合并数组  
arr1.concat(arr2, arr3);  
// [ 'a', 'b', 'c', 'd', 'e' ]  
// es6 的合并数组  
[...arr1, ...arr2, ...arr3]  
// [ 'a', 'b', 'c', 'd', 'e' ] 

 

5 将字符串转换为数组

[...'hello']  
// [ "h", "e", "l", "l", "o" ] 
//es5
str.split('')

6 转换伪数组为真数组

var nodelist = document.queryselectorall('p');  
var array = [...nodelist]; 
//具有iterator接口的伪数组,非iterator对象用array.from方法

7 map结构

let map = new map([  
[1, 'one'],  
[2, 'two'],  
[3, 'three'],  
]);  
let arr = [...map.keys()]; // [1, 2, 3]