扩展运算符

扩展运算符(spread)是三个点(...)。它好比 rest 参数的逆运算(函数),将一个数组转为用逗号分隔的参数序列。

rest: 变量将多余的参数放入数组中。

spread(扩展):rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列。

总结:二者为逆操作。

console.log(...[1, 2, 3])
// 1 2 3

该运算符主要用于函数调用。

/**
* 1.该运算符将一个数组,变为参数序列。
*/
function add(x, ...y) {
// x = 10 , ...y = [4,38]
return x + y.reduce((sum, num) => {
return sum + num;
})
} const numbers = [4, 38];
console.log(add(8,...numbers)); //50 /**
* 2.扩展运算符与正常的函数参数可以结合使用,非常灵活。
*/
function f(v, w, x, y, z) {
// v = -1,
// w = 0,x = 1,
// y = 2,z = 3
}
const args = [0, 1];
var arr = f(-1, ...args, 2, ...[3]); console.log(arr); // 42 /**
* 3.替代push
*/
// ES5的 写法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
Array.prototype.push.apply(arr1, arr2);
console.log(arr1); //(6) [0, 1, 2, 3, 4, 5] // ES6 的写法
let arr3 = [0, 1, 2];
let arr4 = [3, 4, 5];
arr3.push(...arr4);
console.log(arr3); //(6) [0, 1, 2, 3, 4, 5]

参考:

阮一峰 - ES6入门 - 扩展运算符

ES6 - 数组扩展(扩展运算符)的更多相关文章

  1. 数组的复制及ES6数组的扩展

    一.数组的复制 // alert([1,2,3]==[1,2,3]); let cc = [0,1,2]; let dd = cc; alert(dd==cc);//此时改变dd会影响cc ES5 只 ...

  2. es6数组的扩展

    数组扩展运算符 ...(三个点) const demoArr=[0,1,2,3,4] console.log(...demoArr) // 0 1 2 3 4 // 他把一个数组用逗号分隔了出来 // ...

  3. ES6数组的扩展--Array.from()和Array.of()

    一. Array.from() : 将伪数组对象或可遍历对象转换为真数组 1.何为伪数组 如果一个对象的所有键名都是正整数或零,并且有length属性,那么这个对象就很像数组,语法上称为"类 ...

  4. ES6数组的扩展运算符

    一.基本使用 ES6中函数可以使用 rest参数 接收函数的多余参数,组成一个数组,放在形参的最后面. let fn = (a, ...value) => { console.log(a); c ...

  5. ES6 数组的扩展

    1. Array.from() Array.from()将类数组(array-like)对象与可遍历的对象转化为数组并返回. 下面是一个类数组 let arr = { '0':'a', '1':'b' ...

  6. ES6数组扩展

    前面的话 数组是一种基础的JS对象,随着时间推进,JS中的其他部分一直在演进,而直到ES5标准才为数组对象引入一些新方法来简化使用.ES6标准继续改进数组,添加了很多新功能.本文将详细介绍ES6数组扩 ...

  7. ES6知识整理(4)--数组的扩展

    最近工作比较忙,基本每天都会加班到很晚.处理一些客户端兼容问题以及提升用户体验的优化.也将近一周没更文了,现在继续es6的学习总结. 上篇回顾 ES6知识整理(三)--函数的扩展 扩展运算符 形式是3 ...

  8. ES6的新特性(8)——数组的扩展

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

  9. ES6学习(三):数组的扩展

    chapter08 数组的扩展 8.1 扩展运算符 8.1.1 扩展运算符的含义 ... 如同rest运算符的逆运算,将一个数组转换为用逗号分隔的参数序列. console.log(...[1, 2, ...

  10. Es6学习笔记(7)----数组的扩展

    参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ 数组的扩展 1.扩展运算符:可以将数组转化成逗号隔离的单个参数...[1,2,3] //控制台运 ...

随机推荐

  1. Idea 热部署插件JRebel 安装与环境配置-上海尚学堂Java培训

    在企业日常项目开发中,如果我们需要调试一个Java Web项目,就需要先将项目编译之后,放入Web容器或借助Maven web 插件来运行,如果对Java源代码进行修改,那么必须重新编译并重启Web容 ...

  2. Win10下免安装版MySQL5.7的安装和配置

    1.MySQL5.7解压 2.新建配置文件my.ini放在D:\Free\mysql-5.7.26-winx64目录下 [mysql] # 设置mysql客户端默认字符集 default-charac ...

  3. rest framework 之序列化

    一.示例 restful work 的序列号就类似于 Django 的 Form 表单. 1.api/urls.py from django.urls import path, re_path fro ...

  4. 洛谷P3069 [USACO13JAN]牛的阵容Cow Lineup(尺取法)

    思路 考虑比较朴素的解法,枚举每个长度为\(k+1\)的区间,然后统计区间中出现次数最多的颜色.这样的话复杂度为\(O(n*k)\)的,显然不行. 观察到统计每个区间中出现次数最多的颜色中,可以只用看 ...

  5. Beta冲刺——用户使用调查报告

    项目Beta冲刺(团队) --用户使用调查报告 一.项目概述 1.1项目名称 卡战三国 1.2项目简介 一款休闲娱乐益智卡牌游戏 1.3 项目预期目标 开发一款基于三国题材的卡牌通关对战手机游戏 二. ...

  6. Css背景设置 、

    每天进步一小步,一年进步一大步. 第一次发博客园文章,主要记录自己学习的一个过程. CSS3 背景 CSS3 包含多个新的背景属性,它们提供了对背景更强大的控制. background-size ba ...

  7. Maven的下载以及配置

    Maven的下载以及配置 Maven的两大核心作用: (1)依赖管理:对Jar包的依赖,解决Jar包之间的冲突 (2)项目构建:项目从编译到测试到运行发布 一.Mavenu的下载(现在的eclipse ...

  8. UI的编程学本质

    一.UI是数据的组织方式.展示及连接 UI模块--数据单元: 链接---数据单元间的联系: 相对链接-数据结构的树.链表: 绝对链接-大的模块级别的切换: 二.UI的IO学本质 屏幕.键盘 将信息输出 ...

  9. Cyclical Quest CodeForces - 235C (后缀自动机)

    Cyclical Quest \[ Time Limit: 3000 ms\quad Memory Limit: 524288 kB \] 题意 给出一个字符串为 \(s\) 串,接下来 \(T\) ...

  10. ava js 测试框架基本试用

    随着js 越来越强大,日常使用中关于js 的问题也就越突出了,我们需要关注的点也就不能只像以前那样 只编写简单的功能实现,我们同时也需要关注js 的健壮性,测试就是其中一个比较重要的环节,以下 是av ...