记录一下ES6扩展运算符(三点运算符)...的用法
...运算符用于操作数组,有两种层面
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扩展运算符(三点运算符)...的用法的更多相关文章
- Es6扩展运算符--三点运算符(...)--展开语法(Spread syntax)
0.看文档呀 关于拓展运算符更详细的解释见 > MDN展开语法 关于剩余参数更详细的解释见 >MDN剩余参数 关于解构赋值更详细的解释见 >MDN解构赋值 直接看上面的文档更好 1. ...
- ES6---扩展运算符和rest‘...’(三点运算符),在数组、函数、set/map等中的应用
ES6新增的三点运算符,是由三个点表示,在数组中扮演着重要的角色,可以对数组进行合并与分解.可以对set等数据结构进行转换.可以对函数参数进行简化表示,接下来,我们一起揭开其神秘面纱… ●三点—res ...
- ES6 扩展运算符 三点(...)
含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(...[, , ]) // 1 2 3 conso ...
- es6 学习小记 扩展运算符 三个点(...)
参考: es6 扩展运算符 三个点(...) 经常回顾,方能真正掌握. 一.含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. ...
- ES6扩展运算符的几个小技巧
es6扩展运算符,也就是... ,作用是将一个数组转为用逗号分隔的参数序列. 那么问题来了,我们为啥要用这么奇怪的东东涅,当然因为它能大大提高我们的开发效率.所以,可别小看这三个点. 1.复制数组( ...
- ES6(模板字符串,三点运算符,Symbol,iterator接口)
模板字符串 作用:简化字符串的拼接 模板字符串必须用``包含 变化的部分使用${xxx}包含 对象的简写方式 同名的属性可以省略不写 可以省略函数的function 箭头函数 箭头函数的特点 箭头函数 ...
- ES6...扩展运算符(数组或类数组对象)
数组和类数组对象定义 数组:[] 类数组对象:只包含使用从零开始,且自然递增的整数做键名,并且定义了length表示元素个数的对象,我们就认为他是类数组对象. 数组使用 let foo_arr = [ ...
- ES6系列_4之扩展运算符和rest运算符
运算符可以很好的为我们解决参数和对象数组未知情况下的编程,让我们的代码更健壮和简洁. 运算符有两种:对象扩展运算符与rest运算符. 1.对象扩展( spread)运算符(...) (1)解决参数个数 ...
- es6入门6--数组拓展运算符,Array.from()基本用法
本文只是作为ES6入门第九章学习笔记,在整理知识点的同时,会加入部分个人思考与解答,若想知道更详细的介绍,还请阅读阮一峰大神的ES6入门 一.拓展运算符 ES6中新增了拓展运算(...)三个点,它的作 ...
随机推荐
- EM算法——Expectation-Maximization
最大似然估计 一个栗子:假如去赌场,但是不知道能不能赚钱,你就在门口堵着出来一个人就问一个赚了还是赔了,如果问了5个人都说赚了,那么你就会认为,赚钱的概率肯定是非常大的. 已知:(1)样本服从分部的模 ...
- linux 基础命令(12月25日笔记)
1. cp指令指令:cp (copy,复制)作用:复制文件/文件夹到指定的位置语法:#cp [-r] 被复制的文档路径 文档被复制到的路径选项: -r:recurs ...
- latex建立参考文献的超链接
在Latex生成的pdf文档中建立超链接(如从正文到参考文献,从目录到相应内容,从页码编号到实际页面等),有利于读者快速定位当前阅读的信息. 如何在生成的pdf文件中包含超链接呢?需要注意一下两点: ...
- QQ帐户的申请与登陆-(字符串操作)
题目: 实现QQ新帐户申请和老帐户登陆的简化版功能.最大挑战是:据说现在的QQ号码已经有10位数了. 输入格式: 输入首先给出一个正整数N(≤10^5),随后给出N行指令.每行指令的格式为:“命令符( ...
- hdu 1392 Surround the Trees 凸包裸题
Surround the Trees Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Other ...
- JavaSE习题 第八章 线程
问答题 1.线程和进程是什么关系? 进程是程序的一次动态执行,对应了从代码加载,执行至执行完毕的一个完整的过程 线程是比进程更小的执行单位,一个进程在其执行过程中可以产生多个线程,形成多条执行线索 2 ...
- 堆排序 java实现
import java.util.Arrays; /* * 思路: * 1.方法adjustDown:对于一个数组a[],针对第i个数进行向下(直到len-1)调整,使得该位置成为大顶堆 * 2.方法 ...
- [osg]osg窗口显示和单屏幕显示
osg::ref_ptr<osg::Node> loadedModel = osgDB::readNodeFile("cow.osg"); osg::ref_ptr&l ...
- MVC路由 路由的三种扩展 替换MVC内置的Handler
Global.asax 是 程序入口文件 路由配置 为什么localhost:8088/Home/Index/1 能返问到我们写的 会去掉前缀跟端口号 变成Home/Index/1 用这个跟路由 ...
- Vue中ESlint配置文件eslintrc.js文件详解
最近在跟着视频敲项目时,代码提示出现很多奇奇怪怪的错误提示,百度了一下是eslintrc.js文件没有配置相关命令,ESlint的语法检测真的令人抓狂,现在总结一下这些命令的解释,方便以后查阅. 默认 ...