es6的新特性对函数的功能新增加了rest参数和...的拓展运算符。这是两个什么东西呢?

先来看一个问题:如何获取一个函数除了定义的参数之外的其他参数?传统的做法是借助函数的arguments关键字来获取的。

方法如下:

function add(a,b){
var i=2,rest=[];
if(arguments.length>2){
for(i;i<arguments.length;i++){
rest.push(arguments[i]);
}
}
return rest;
}
console.log(add(5,6,7,8));//7,8
//这种方法饶了一个弯子,需要排除前面两个参数,i从2进行循环。

es6的方法:
采用...“变量名”的方法,这个就是es6的rest参数,rest将函数多余的参数转化为一个数组,无需借助arguments参数了。
      function sum(a,b,...rest) {
let sum = a + b;
console.log('获取出ab之外的其他参数:'+rest);
for(var val of rest){
sum += val;
}
return sum;
}
var arr = [];
for(var i = 0;i < 100;i++){
arr.push(i);
}
console.log(sum(4,5,9,10,11,12,13));
console.log(sum(...arr));

如上我们用rest参数就可以获取到除了a,b参数之外的参数。

再来看看什么是es6的拓展运算符...?

...是一个将数组转为用逗号分隔的参数序列,与rest参数恰恰相反。

思考问题?如何求一个数组中的最大值?

  //es5的方法,需要借助apply将数组转化为参数给Math.max()方法使用。
var maxArr=[10,20,35];
var max = Math.max.apply(null,maxArr);//apply()第一个参数指定为null 或 undefined 时this会自动指向全局对象(浏览器中就是window对象);
//es6方法。借助...拓展运算符。
var max2 = Math.max(...maxArr);
console.log(max2);//是不是比es5的方法方便多了。

...拓展运算符还可以用来合并两个数组:

//使用...合并数组
var arr1 = [1,2,3];
var arr2 = [4,5,6];
//es5
var arr3 = arr1.concat(arr2);
//es6
var arr4 = [...arr1,...arr2];
console.log(arr3);[1,2,3,4,5,6]
console.log(arr4);[1,2,3,4,5,6]

es6函数的rest参数和拓展运算符(...)的解析的更多相关文章

  1. [js高手之路] es6系列教程 - 不定参数与展开运算符(...)

    三个点(...)在es6中,有两个含义: 用在形参中, 表示传递给他的参数集合, 类似于arguments, 叫不定参数. 语法格式:  在形参面前加三个点( ... ) 用在数组前面,可以把数组的值 ...

  2. javascript es6系列教程 - 不定参数与展开运算符(...)

    三个点(...)在es6中,有两个含义: 用在形参中, 表示传递给他的参数集合, 类似于arguments, 叫不定参数. 语法格式:  在形参面前加三个点( ... ) 用在数组前面,可以把数组的值 ...

  3. ES6函数的拓展

    ES里面现在支持在函数的参数直接给参数赋一个默认值,ES6支持拓展运算符(...)三个英文的点,这个形式如function(...a)这个里面...a可以接受若干的值,这个拓展运算符也可以把若干的值转 ...

  4. es6入门6--数组拓展运算符,Array.from()基本用法

    本文只是作为ES6入门第九章学习笔记,在整理知识点的同时,会加入部分个人思考与解答,若想知道更详细的介绍,还请阅读阮一峰大神的ES6入门 一.拓展运算符 ES6中新增了拓展运算(...)三个点,它的作 ...

  5. ES6 rest参数和扩展运算符

    rest参数 ES6引入了rest参数(形式为“…变量名”).其中rest参数搭配的变量是一个数组可以使用数组的一切操作. 例: function rest(...values){ let sum=0 ...

  6. ES6 函数的拓展(四)

    一.参数带默认值函数1.在函数形参可以赋予函数默认值[即实参严格匹配undefined时,在函数内部使用形参时调用它的默认值]2.函数name属性 [返回函数名称,无名的函数返回空字符串]3.函数le ...

  7. ES6 函数参数的默认值

    基本用法 在ES6之前,不能直接为函数的参数指定默认值,只能采取变通的方法. function log(x,y){ y = y||'world'; console.log(x,y); } log('k ...

  8. ES6 - 函数扩展(函数参数默认值)

    函数参数默认值 ES6 之前,不能直接为函数的参数指定默认值,只能采用变通的方法. function log(x, y) { y = y || 'World'; console.log(x, y); ...

  9. 函数——es6函数扩展(二)

    一.声明 1. let(变量) 可以只声明不给值(默认为undefined),或者是先声明后给值,但是必需声明后再使用,可以重复赋值,可以防止变量泄露: 同一作用域里不能重复的声明,不同作用域里可以, ...

随机推荐

  1. js中数组对象根据内容查找符合的第一个对象

    今天在写一个混合开发版的app,其中一个功能是扫描快递单号,客户要求不能扫描重复的快递单号!所有就验证查出. 首先实现思路就是: 1.定义一个全局数组变量:var nubList = []; 2.进入 ...

  2. ASP.NET静态化方法

    直接通过访问页面获取html代码实现静态化 突然想到一个静态化页面的方法:直接保存源代码即可. 模拟浏览器访问,获得源码,写入文件.不知道是否存在安全风险:各位大神请指点: 注意 1.资源使用绝对路径 ...

  3. wowza拉流和推流接口备忘

    拉流接口地址:https://www.wowza.com/docs/stream-management-query-examples# 推流接口地址:https://www.wowza.com/doc ...

  4. nginx 安装和配置

    1. 安装相关依赖 yum install readline-devel pcre-devel openssl-devel zlib-devel gcc gcc-c++ gd-devel libxml ...

  5. Linux学习之路 -- 简单日常使用命令

    tail -f catalina.out #在 logs 下面查看日志( -f 实时查看) rm -rf /var/log/httpd/access #删除文件(-r删除文件 并删除文件夹下的内容 - ...

  6. 从web图片裁剪出发:了解H5中的Blob

    刚开始做前端的时候,有个功能卡住我了,就是裁剪并上传头像.当时两个方案摆在我面前,一个是flash,我不会.另一个是通过iframe上传图片,然后再上传坐标由后端裁剪,而我最终的选择是后者.有人会疑惑 ...

  7. OSI与TCP/IP网络模型分层

      学习linux的人,都会接触到一些网络方面的知识.作为一个linux方面的萌新,今天,小编就接触了OSI模型和TCP/IP协议栈,那么什么是OSI模型呢?     OSI模型,开放式系统互联通信参 ...

  8. Membership ——入门基础

    Membership是ASP.NET为我们提供的一套验证和存储用户凭证的框架.它可以帮助我们快速的开发用户登录.管理以及权限验证相关的模块,很多人可能会说Membership开发起来确实很快,但是总是 ...

  9. linux命令每日一练:find与rm实现查找并删除目录或文件

    linux命令每日一练 linux中find与rm实现查找并删除目录或文件 linux 下用find命令查找文件,rm命令删除文件. 删除指定目录下指定文件 find 要查找的目录名 -name .s ...

  10. 【集美大学1411_助教博客】alpha阶段后 成绩

    团队作业7 成绩(助教对团队排名) 团队名称 设想和目标 计划 资源 变更管理 设计/实现 测试/发布 团队的角色,管理,合作 总结 全组讨论的照片 团队成员在Alpha阶段的角色和具体贡献 合计 排 ...