...运算符用于操作数组,有两种层面

1. 第一个叫做 展开运算符(spread operator),作用是和字面意思一样,就是把东西展开。可以用在array和object上都行。
比如:

let a = [1,2,3];
let b = [0, ...a, 4]; // [0,1,2,3,4] let obj = { a: 1, b: 2 };
let obj2 = { ...obj, c: 3 }; // { a:1, b:2, c:3 }
let obj3 = { ...obj, a: 3 }; // { a:3, b:2 }

2. 第二个,第三个叫做 剩余操作符(rest operator),是解构的一种,意思就是把剩余的东西放到一个array里面赋值给它。一般只针对array的解构,其他的没见过。。。
比如:

let a = [1,2,3];
let [b, ...c] = a;
b; // 1
c; // [2,3] // 也可以
let a = [1,2,3];
let [b, ...[c,d,e]] = a;
b; // 1
c; // 2
d; // 3
e; // undefined // 也可以
function test(a, ...rest){
console.log(a); // 1
console.log(rest); // [2,3]
} test(1,2,3)

还有类似的

let array = [1, 2, 3, 4, 5];
const { x, y, ...z } = array;
// 其中z=[3, 4, 5],注意如果由于array的length不足以完成析构,则会导致z为[]
对象:
let obj = { name: 'zhangsan', age: 30, city: 'shenzhen' };
const {name, ...others} = obj;
console.log(name); // 'zhangsan'
console.log(others); // {age: 30, city: 'shenzhen'}

转自:https://blog.csdn.net/chauncywu/article/details/73060918

记录一下ES6扩展运算符(三点运算符)...的用法的更多相关文章

  1. Es6扩展运算符--三点运算符(...)--展开语法(Spread syntax)

    0.看文档呀 关于拓展运算符更详细的解释见 > MDN展开语法 关于剩余参数更详细的解释见 >MDN剩余参数 关于解构赋值更详细的解释见 >MDN解构赋值 直接看上面的文档更好 1. ...

  2. ES6---扩展运算符和rest‘...’(三点运算符),在数组、函数、set/map等中的应用

    ES6新增的三点运算符,是由三个点表示,在数组中扮演着重要的角色,可以对数组进行合并与分解.可以对set等数据结构进行转换.可以对函数参数进行简化表示,接下来,我们一起揭开其神秘面纱… ●三点—res ...

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

    含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(...[, , ]) // 1 2 3 conso ...

  4. es6 学习小记 扩展运算符 三个点(...)

    参考: es6 扩展运算符 三个点(...) 经常回顾,方能真正掌握. 一.含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. ...

  5. ES6扩展运算符的几个小技巧

    es6扩展运算符,也就是...  ,作用是将一个数组转为用逗号分隔的参数序列. 那么问题来了,我们为啥要用这么奇怪的东东涅,当然因为它能大大提高我们的开发效率.所以,可别小看这三个点. 1.复制数组( ...

  6. ES6(模板字符串,三点运算符,Symbol,iterator接口)

    模板字符串 作用:简化字符串的拼接 模板字符串必须用``包含 变化的部分使用${xxx}包含 对象的简写方式 同名的属性可以省略不写 可以省略函数的function 箭头函数 箭头函数的特点 箭头函数 ...

  7. ES6...扩展运算符(数组或类数组对象)

    数组和类数组对象定义 数组:[] 类数组对象:只包含使用从零开始,且自然递增的整数做键名,并且定义了length表示元素个数的对象,我们就认为他是类数组对象. 数组使用 let foo_arr = [ ...

  8. ES6系列_4之扩展运算符和rest运算符

    运算符可以很好的为我们解决参数和对象数组未知情况下的编程,让我们的代码更健壮和简洁. 运算符有两种:对象扩展运算符与rest运算符. 1.对象扩展( spread)运算符(...) (1)解决参数个数 ...

  9. es6入门6--数组拓展运算符,Array.from()基本用法

    本文只是作为ES6入门第九章学习笔记,在整理知识点的同时,会加入部分个人思考与解答,若想知道更详细的介绍,还请阅读阮一峰大神的ES6入门 一.拓展运算符 ES6中新增了拓展运算(...)三个点,它的作 ...

随机推荐

  1. 【Java】【路径】

    [java中Class.getResource用法(用于配置文件的读取)] 用JAVA获取文件,听似简单,但对于很多像我这样的新人来说,还是掌握颇浅,用起来感觉颇深,大常最经常用的,就是用JAVA的F ...

  2. 【bzoj】4538: [Hnoi2016]网络

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=4538 维护一个数据结构支持对于一颗树的操作,需要支持: 1.对于树上的一条路径上的每个点上 ...

  3. bzoj 2243: [SDOI2011]染色 线段树区间合并+树链剖分

    2243: [SDOI2011]染色 Time Limit: 20 Sec  Memory Limit: 512 MBSubmit: 7925  Solved: 2975[Submit][Status ...

  4. html 进度条

    <html> <head> <title>进度条</title> <style type="text/css"> .co ...

  5. 【SQL Prompt】SQL Prompt7.2下载及破解教程

    基本介绍 SQL Prompt能根据数据库的对象名称,语法和用户编写的代码片段自动进行检索,智能的为用户提供唯一合适的代码选择.自动脚本设置为用户提供了简单的代码易读性--这在开发者使用的是不大熟悉的 ...

  6. tips 移入悬浮功能

    前景: 页面部分区域需要移入悬浮效果,当然默认的 title 也是可以的,最多只是格格不入,但是却是最为靠谱的.. 思路: 基于 jq 实例扩展 .使用立即执行函数保持功能独立. 自定义类实现功能封装 ...

  7. Python Appium 开启Android测试之路

    1.获取 Android app的Activity 打开终端cmd,先cd进入到刚才下载的“新浪.apk”目录下,然后使用aapt dump badging xxx.apk命令获取包内信息.注意,启动 ...

  8. github下载文件和文件夹

    1.建议安装的插件.Octo mate在你的github的单个文件页面会出现download的下载按钮. 2.octo tree 右侧多一个github readme.md的一个菜单. 3.下载文件夹 ...

  9. 非常好的一个CentOS 6.2 apache 2.4.2 编译教程

    除了以下2点,没有错的. 1)pcre-devel 需要安装 2)apr 和 apr-util 有了新的版本了 How to Install Apache 2.4.2 from Source on C ...

  10. java异常:java.lang.NullPointerException

    /** * 功能:空指针异常测试 */ /* Object[] parameters1=null; if(parameters1.length>0&&parameters1!=n ...