ES6 - 数组扩展(扩展运算符)
扩展运算符
扩展运算符(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数组的扩展
一.数组的复制 // alert([1,2,3]==[1,2,3]); let cc = [0,1,2]; let dd = cc; alert(dd==cc);//此时改变dd会影响cc ES5 只 ...
- es6数组的扩展
数组扩展运算符 ...(三个点) const demoArr=[0,1,2,3,4] console.log(...demoArr) // 0 1 2 3 4 // 他把一个数组用逗号分隔了出来 // ...
- ES6数组的扩展--Array.from()和Array.of()
一. Array.from() : 将伪数组对象或可遍历对象转换为真数组 1.何为伪数组 如果一个对象的所有键名都是正整数或零,并且有length属性,那么这个对象就很像数组,语法上称为"类 ...
- ES6数组的扩展运算符
一.基本使用 ES6中函数可以使用 rest参数 接收函数的多余参数,组成一个数组,放在形参的最后面. let fn = (a, ...value) => { console.log(a); c ...
- ES6 数组的扩展
1. Array.from() Array.from()将类数组(array-like)对象与可遍历的对象转化为数组并返回. 下面是一个类数组 let arr = { '0':'a', '1':'b' ...
- ES6数组扩展
前面的话 数组是一种基础的JS对象,随着时间推进,JS中的其他部分一直在演进,而直到ES5标准才为数组对象引入一些新方法来简化使用.ES6标准继续改进数组,添加了很多新功能.本文将详细介绍ES6数组扩 ...
- ES6知识整理(4)--数组的扩展
最近工作比较忙,基本每天都会加班到很晚.处理一些客户端兼容问题以及提升用户体验的优化.也将近一周没更文了,现在继续es6的学习总结. 上篇回顾 ES6知识整理(三)--函数的扩展 扩展运算符 形式是3 ...
- ES6的新特性(8)——数组的扩展
数组的扩展 扩展运算符 含义 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(...[1, 2, 3]) / ...
- ES6学习(三):数组的扩展
chapter08 数组的扩展 8.1 扩展运算符 8.1.1 扩展运算符的含义 ... 如同rest运算符的逆运算,将一个数组转换为用逗号分隔的参数序列. console.log(...[1, 2, ...
- Es6学习笔记(7)----数组的扩展
参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ 数组的扩展 1.扩展运算符:可以将数组转化成逗号隔离的单个参数...[1,2,3] //控制台运 ...
随机推荐
- springboot2.1.3 本地加载jar包+打包载入本地jar
项目已springboot为主,有时候我们需要引入的jar包并非maven公共库中存在(这里不谈私自搭建私库),那我们能否像普通的工程一样,导入自己手动添加的jar包文件呢? 答案是肯定的,来,一起往 ...
- Intel网卡的漫游主动性
- centos7搭建lnmp
一.准备 1. 修改网络yum源 先将系统自带的yum配置文件重命名或删除,然后下载下面两个文件 阿里云:http://mirrors.aliyun.com/repo/Centos-7.repo ep ...
- AHOI2014 奇怪的计算器 和 HDU5306 Gorgeous Sequence
线段树秀操作题. 奇怪的计算器 有 N 个数,一共会对这 N 个数执行 M 个指令(对没个数执行的指令都一样),每一条指令可以是以下四种指令之一:(这里 a 表示一个正整数) 加上 a 减去 a 乘以 ...
- 利用Java反射机制优化简单工厂设计模式
之前项目有个需求,审批流程的时候要根据配置发送信息:发送短信.发送邮件.当时看到这个就想到要用工厂模式,为什么要用工厂模式呢?用工厂模式进行大型项目的开发,可以很好的进行项目并行开发.就是一个程序员和 ...
- 【Android Studio】 资源下载
Gradle各版本集合 http://services.gradle.org/distributions/ Android Studio各版本集合 http://www.android-studio. ...
- SpringBoot配置ThreadPoolTaskExecutor
package com.example.demo; import org.springframework.context.annotation.Bean; import org.springframe ...
- Connected Component in Undirected Graph
Description Find connected component in undirected graph. Each node in the graph contains a label an ...
- H5制作显示轮播图的方法Swiper
1.需要引入Swiper插件 <!-- swiper插件 --> <link rel="stylesheet" href="https://unpkg. ...
- 用正确的姿势使用 celery
简介 celery 是一个简单.灵活.可靠的分布式系统,可以处理大量的消息. celery 是一个任务队列,关注实时处理,同时支持任务调度. 它的工作机制是这样的: 快速使用 安装:pip3 inst ...