react es6语法 之 “ ... ” (扩展运算符)
扩展运算符(…)用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中
let bar = { a: 1, b: 2 };
let baz = { ...bar }; // { a: 1, b: 2 }
参考:https://blog.csdn.net/astonishqft/article/details/82899965
应用:
1、将数组转化为函数参数序列
function add(x, y) {
return x + y;
} const numbers = [4, 38];
add(...numbers) //
2、对数组进行值拷贝(直接用=是无法对数组进行值拷贝的,只能复制一份引用)
const arr1 = [1, 2];
const arr2 = [...arr1];
3、字符串转为字符数组
[...'hello']
// [ "h", "e", "l", "l", "o" ]
4、迭代器iterator接口转为数组
5、数组合成
first // 1
rest // [2, 3, 4, 5]
const [first, ...rest] = [1, 2, 3, 4, 5]; 需要注意的一点是:
如果将扩展运算符用于数组赋值,只能放在参数的最后一位,否则会报错。 const [...rest, last] = [1, 2, 3, 4, 5];
// 报错
const [first, ...rest, last] = [1, 2, 3, 4, 5];
// 报错
react es6语法 之 “ ... ” (扩展运算符)的更多相关文章
- ES6学习笔记-扩展运算符(...)
扩展运算符的定义: es6中引入扩展运算符(...),它用于把一个数组转化为用逗号分隔的参数序列. 它常用在不定参数个数时的函数调用,数组合并等情形. 用法一:不定参数个数时的函数调用 <scr ...
- es6可变参数-扩展运算符
es5中参数不确定个数的情况下: //求参数和 function f(){ var a = Array.prototype.slice.call(arguments); var sum = 0; a. ...
- es6 学习小记 扩展运算符 三个点(...)
参考: es6 扩展运算符 三个点(...) 经常回顾,方能真正掌握. 一.含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. ...
- ES6数组的扩展运算符
一.基本使用 ES6中函数可以使用 rest参数 接收函数的多余参数,组成一个数组,放在形参的最后面. let fn = (a, ...value) => { console.log(a); c ...
- (...)ES6三点扩展运算符
扩展运算符将一个数组转为用逗号分隔的参数序列 console.log(...[a, b, c]) // a b c 用于: 1 将一个数组,变为参数序列 let add = (x, y) => ...
- Vue的三个点es6知识,扩展运算符
Vue中的三个点在不同情境下的意思 操作数组 //里面放自己定义的方法 methods: { /** * 把数组中的元素孤立起来 */ iClick() { let iArray = ['1', '2 ...
- ES6 rest与扩展运算符
1.rest 变量将多余的参数放入数组中. function add(...values) { let sum = 0; for (var val of values) { sum += val; } ...
- 关于ES6的对象扩展运算符
对象的扩展运算符(...),用于取出参数对象中的所有可遍历属性,然后拷贝到当前对象之中 对象扩展运算符: 1. 复制对象 let obj1 = { x: 1, y: 2, z: 3 } let obj ...
- call,apply,bind与es6的数组扩展运算符...
js中每一个Function对象都有一个apply个一个call方法: function.apply(thisObj,[argArray]); function.call(thisObj,arg1,a ...
随机推荐
- httpclient 释放连接的问题 Invalid use of SingleClientConnManager: connection still allocated
Invalid use of SingleClientConnManager: connection still allocated httpPost.releaseConnection(); 该代 ...
- vue 单元测试
单元测试 配置和工具 任何兼容基于模块的构建系统都可以正常使用,但如果你需要一个具体的建议,可以使用Karma进行自动化测试.它有很多社区版的插件,包括对webpack和browserify的支持. ...
- Log4j容器深入探究
1.思考 容器是什么? 水壶是容器,水壶中存放着水,等我们需要水了,直接用 Spring中的ApplicationContext是容器,里面存放着各种Bean,等我们需要了直接用,并且可以创建管理Be ...
- js 去掉数组中重复的对象
function deteleObject(obj) { // console.log(obj) var uniques = []; var stringify = {}; ; i < obj. ...
- TF Boys (TensorFlow Boys ) 养成记(三): TensorFlow 变量共享
上次说到了 TensorFlow 从文件读取数据,这次我们来谈一谈变量共享的问题. 为什么要共享变量?我举个简单的例子:例如,当我们研究生成对抗网络GAN的时候,判别器的任务是,如果接收到的是生成器生 ...
- Spring security UserDetailsService autowired注入失败错误
最近使用spring mvc + spring security 实现登录权限控制的时候,一直不能成功登录,检查过后是dao一直无法注入为null CustomUserDetailConfig.jav ...
- 多线程下的神奇的IOCP
https://blog.csdn.net/lijia626482312/article/details/40858061 一个人从接到项目到昨天终于完成,用了差不多4个月,其中各种心酸和眼泪.我的项 ...
- MD5骨骼动画模型加载
前面我们分析了静态模型OBJ格式,桢动画模型MD2,这篇主要分析骨骼动画MD5的一些概念并且实现. 混合桢动画有计算简单,容易实现等优点,但是在需要比较细致的效果时,则需要更多的关键桢,每桢都添加相同 ...
- 这些孩子在 Ubuntu 的 Linux 终端下玩耍
导读 我发现了一个孩子们在他们的计算机教室里玩得很开心的视频.我不知道他们在哪里,但我猜测是在印度尼西亚或者马来西亚.视频请自行搭梯子: https://youtu.be/z8taQPomp0Y 在L ...
- js小功能实现
发送随机数手机验证码60秒倒计时 mm.mobileCheck = function(t){ var mobile = $("#user_mobile").val(); if(&q ...