来源:https://www.cnblogs.com/rlann/p/7222150.html

(...)ES6三点扩展运算符

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

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将一个数组添加到另一个数组的尾部

![复制代码](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9jb21tb24uY25ibG9ncy5jb20vaW1hZ2VzL2NvcHljb2RlLmdpZg)
// 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); 
![复制代码](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9jb21tb24uY25ibG9ncy5jb20vaW1hZ2VzL2NvcHljb2RlLmdpZg)

4 合并数组

![复制代码](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9jb21tb24uY25ibG9ncy5jb20vaW1hZ2VzL2NvcHljb2RlLmdpZg)
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' ] 
![复制代码](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9jb21tb24uY25ibG9ncy5jb20vaW1hZ2VzL2NvcHljb2RlLmdpZg)

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]

«

(...)ES6三点扩展运算符相关推荐

  1. es6 对象的扩展运算符

    对象的扩展运算符 <数组的扩展>一章中,已经介绍过扩展运算符(...). const [a, ...b] = [1, 2, 3]; a // 1 b // [2, 3] ES2017 将这 ...

  2. Vue的三个点es6知识,扩展运算符表达含义

    <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...

  3. ES6增加了扩展运算符: ... 三个点是ES几的

    ES6 的扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. 1.将一个数组转为用逗号分隔的参数序列(把数组中元素展开). 如下: ...

  4. ES6高级:扩展运算符,箭头函数,class类,iterator迭代器

    2. 扩展运算符 ... 2.1 reset参数 reset参数==必须放在最后==,为了替代arguments,在函数形参中使用,==接受剩余参数==,以==数组==的形式去接受 //1. rese ...

  5. ES6中的扩展运算符

    扩展运算符(...)将一个数组转化为参数序列,通常与函数一起使用,show(...['judy','girl']). 数组合并:[...arr1,...arr2,...arr3] 字符串转字符数组:[ ...

  6. ES6对象的扩展运算符

    1.对象的扩展运算符(-)用于取出参数对象的所有可遍历属性,拷贝到当前对象之中 let z = {a:3,b:4}; let n = {...z}; console.log(n);//{a:3,b:4 ...

  7. c语言扩展运算符是什么,扩展运算符(spread)是三个点(…)

    扩展运算符(spread)是三个点(-),将一个数组||类数组||字符串转为用逗号分隔的序列. js中用来对数组进行操作,把数组里面的东西统统拿出来 一.展开数组 //展开数组 let a = [1, ...

  8. 了解ES6 The Dope Way第三部分:模板文字,扩展运算符和生成器!

    by Mariya Diminsky 通过玛丽亚·迪明斯基(Mariya Diminsky) 了解ES6 The Dope Way第三部分:模板文字,扩展运算符和生成器! (Learn ES6 The ...

  9. es6之扩展运算符 Object.assign和 三个点(...)

    一.导读 ES6, 全称 ECMAScript 6.0 ,是 JavaScript 的下一个版本标准,2015.06 发版. ES6 主要是为了解决 ES5 的先天不足,比如 JavaScript 里 ...

最新文章

  1. 特斯拉车主「作死」成真:炫耀「主驾无人」,自动驾驶导致车毁人亡
  2. Java Eclipse进行断点调试
  3. 如何实现Linux下高亮关键字的tail -f功能
  4. bean包、entity包、mode包、domain包的区别
  5. xshell十大技巧
  6. Python批量替换目录下文件后缀脚本实例
  7. 手机滤镜怎么移植到ps上_一分钟教你电脑端Lr、Ps滤镜预设/手机端Lr预设如何导入【图文教程】...
  8. mysql temporary_mysql – 如何在同一个查询中多次引用TEMPORARY表?
  9. 跟燕十八学习PHP-第二十八天-union用法深入讲解
  10. oracle单引号和双引号用法
  11. 2022年11月网络工程师考试知识点分布
  12. 精选1000个机械原理动图
  13. 你的程序要读入一系列正整数数据,输入-1表示输入结束,-1本身不是输入的数据,程序输出读到的数据中的奇数和偶数的个数。(Java经典编程案例)
  14. 2022年烷基化工艺模拟考试题及烷基化工艺模拟考试题库
  15. 使用scrapy框架爬取腾讯招聘信息
  16. 硬盘数据被覆盖了怎么恢复
  17. Julia 机器学习 ---- 单变量线性回归 和 多元线性回归 (Linear regression)
  18. 小知识:什么是build.prop?
  19. 【财经期刊FM-Radio|2021年03月04日】
  20. 基于C51的DMX512开发笔记

热门文章

  1. 让你的网页逼格上升一截——wow.js的引入
  2. ipynb引用另一个ipynb
  3. Qt-5.3.2 在友善Smart210开发板的移植记录
  4. 第四五周(3.28-4.10)进度及下周计划(4.10组会总结)
  5. chinakang8提供伤感日志_谁能知道,点烟时的寂寞
  6. OrangePi Zero Play 72
  7. 用python 将蓝底照片转化为白底照片
  8. selenium之css定位详解
  9. pdf.js添加关键词背景按钮
  10. 2017天猫双11全球狂欢节交易额1682亿!