(...)ES6三点扩展运算符
扩展运算符将一个数组转为用逗号分隔的参数序列
console.log(...[a, b, c])
// a b c
用于:
1 将一个数组,变为参数序列
let add = (x, y) => x + y;
let numbers = [3, 45];
console.log(add(...numbers))//
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将一个数组添加到另一个数组的尾部
// 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);
4 合并数组
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' ]
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三点扩展运算符的更多相关文章
- es6 学习小记 扩展运算符 三个点(...)
参考: es6 扩展运算符 三个点(...) 经常回顾,方能真正掌握. 一.含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. ...
- ES6学习笔记-扩展运算符(...)
扩展运算符的定义: es6中引入扩展运算符(...),它用于把一个数组转化为用逗号分隔的参数序列. 它常用在不定参数个数时的函数调用,数组合并等情形. 用法一:不定参数个数时的函数调用 <scr ...
- Vue的三个点es6知识,扩展运算符
Vue中的三个点在不同情境下的意思 操作数组 //里面放自己定义的方法 methods: { /** * 把数组中的元素孤立起来 */ iClick() { let iArray = ['1', '2 ...
- ES6数组的扩展运算符
一.基本使用 ES6中函数可以使用 rest参数 接收函数的多余参数,组成一个数组,放在形参的最后面. let fn = (a, ...value) => { console.log(a); c ...
- es6可变参数-扩展运算符
es5中参数不确定个数的情况下: //求参数和 function f(){ var a = Array.prototype.slice.call(arguments); var sum = 0; a. ...
- es6三个点运算符
...扩展运算符:可以将数组或对象里面的值展开 const b = {a:1,b:2} console.log({...b,c:3}); //{a:1,b:2,c:3} 一定程度上可以替代apply方 ...
- 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 ...
- ES6 ( 三 ) 字符串扩展
一.字符Unicode表示方法 ES6中可以使用以下6种方法表示字符 '\z' === 'z' // true '\172' === 'z' // true '\x7A' === 'z' // tru ...
随机推荐
- 操作DOM -------JavaScrip
本文摘要:http://www.liaoxuefeng.com/ 经常用到. 由于HTML文档被浏览器解析后就是一棵DOM树,要改变HTML的结构,就需要通过JavaScript来操作DOM. 始终记 ...
- python换行
python中如果一行代码太长,看着不方便时,怎么办? 只需要在需要换行的地方添加上符号 \ 就行了.
- Perl_实用报表提取语言
Perl 语法 - 基础 perl语言的核心是正则表达式,在文本处理上非常有优势,与python类似,但语法不同,perl的语法很灵活,用多了才会觉得好用. 常用知识点总结: perl语法类似于C ...
- c++引用与指针的区别
c++引用与指针的区别 ★ 相同点: 1. 都是地址的概念: 指针指向一块内存,它的内容是所指内存的地址:引用是某块内存的别名. 指针的权威定义: In a declaration T D where ...
- MySQL基础 - 1 数据库基础
一.数据库基础 1.什么是数据库 1.数据库(database)是保存有组织的数据的容器( 通常是一个文件或一组文件 ) 2.数据库是一个以某种有组织的方式存储的数据集合 注意:数据库软件应该称为DB ...
- JsRender (js模板引擎)
最近学习了一下Jsrender模板渲染工具,非常不错,功能比较强大,官网说他是“简单直观 功能强大 可扩展的 快如闪电”确实如此.总结一下!! jsRender 三个最重要的概念:模板.容器和数据. ...
- Thinkphp5中的Validate验证器的使用
更多笔记: http://note.youdao.com/noteshare?id=e97a5df64888f27d912b3e966b9ec297&sub=web1520841813815 ...
- 精通SpringBoot:详解WebMvcConfigurer接口
SpringBoot 确实为我们做了很多事情, 但有时候我们想要自己定义一些Handler,Interceptor,ViewResolver,MessageConverter,该怎么做呢.在Sprin ...
- Python学习笔记:math模块(数学),random模块(随机数)
math模块 math模块用于数学意义上的一些计算,常用的方法有: math.pi:PI的值(3.141592653589793). math.floor(x):返回一个小于等于x的最大整数(浮点类型 ...
- 免费证书Let’s Encrypt
我们自己也可以签发 SSL 安全证书,但是我们自己签发的安全证书不会被主流的浏览器信任,所以我们需要被信任的证书授权中心( CA )签发的安全证书.而一般的 SSL 安全证书签发服务都比较贵,比如 G ...