ES6:拓展运算符(...)

es6新增拓展运算符,它主要有两种作用:合并和拆分

合并

比如我们定义这么一个数组:

const player1 = ['Tom', '020123', 15, 23, 18, 43];

用这个数组来存储Tom玩家与他的姓名,id和他的分数,我们定义三个变量来获取这三个值:

const [name, id, scores] = player1;
console.log(name, id, scores);

但打印出来scores的值只有一个:
在这里插入图片描述
这里就可以通过拓展运算符将scores合并为一个新的数组:

const [name, id, ...scores] = player1;
console.log(name, id, scores);

在这里插入图片描述
这样我们就把剩余所有的元素合并为新数组了

拆分

有以下两个数组:

const users1 = ['Tom', 'Jerry'];
const users2 = ['Mario', 'Louis', 'Yoshi'];

我们需要把它们合并为一个新数组users,并在他们两个中间插入一个Bob,就要这么操作:

let users = [];
users = users.concat(users1);
users.push('Bob');
users = users.concat(users2);
console.log(users);

在这里插入图片描述
属实繁琐,而使用拓展运算符可以将两个数组拆分,分别加入新的数组:

let users = [];
users = [...users1, 'Bob', ...users2];
console.log(users);

在这里插入图片描述

发布了26 篇原创文章 · 获赞 0 · 访问量 601

猜你喜欢

转载自blog.csdn.net/weixin_43856797/article/details/103992234
今日推荐