ES6-rest参数
文章目录
- rest参数
- 一.rest参数
- 二.扩展运算符
- 三.扩展运算符的应用
- 四.严格模式
- 五.name属性
- 参考文档
rest参数
一.rest参数
- rest参数(形式为"…变量名"),用于获取函数的多余参数,这样就不需要使用arguments(参数)对象了.
- rest参数搭配的变量是一个数组,该变量将多余的参数放入数组中.
function add(...a){let sum = 0;for(var val of a){sum += val;}return sum;
}
add(2,5,3);//10
add函数是一个求和函数,利用rest参数,可以向该函数传入任意数目的参数.
3. rest参数代替arguments变量
// arguments变量的写法
function sortNumbers() {return Array.prototype.slice.call(arguments).sort();
}// rest参数的写法
const sortNumbers = (...numbers) => numbers.sort();
- res参数中的变量代表一个数组,所以数组特有的方方都可以用于这个变量.下面是一个利用rest参数改写数组push方法的例子
function push(array, ...items){//forEach为每一个items.forEach(function(item){array.push(item);console.log(item);});
}
var a = [];
push(a, 1, 2, 3);
- rest参数之后不能再有其他参数(即只能是最后一个参数),否则会报错.
- 函数的length属性,不包括rest参数
(function(a){}).length //1
(function(...a){}).length //0
(function(a,...b){}).length //1
二.扩展运算符
- 含义:
扩展运算符(spread)是三个点(…).它好比rest参数的逆运算,将一个数组转为用逗号分隔的参数序列.
console.log(...[1,2,3])
//1 2 3
console.log(1,...[2,3,4],5);
//1 2 3 4 5
[...document.querySelectorAll('div')]
//[<div>,<div>,<div>]
- 该运算符主要用于函数调用
function add(x, y) {return x + y;
}var numbers = [4, 38];
add(...numbers) // 42
- 扩展运算符与正常的函数参数可以结合使用,非常灵活
function f(v, w, x, y, z) {console.log(v); //-1console.log(w); //0console.log(x); //1console.log(y); //2console.log(z); //3
}
var args = [0, 1];
f(-1, ...args, 2, ...[3]);
三.扩展运算符的应用
- 合并数组
//ES5
[1, 2].concat(more)
//ES6
[1, 2, ...more]var arr1 = ['a','b'];
var arr2 = ['c'];//ES5的合并数组
arr1.concat(arr1, arr2);
//ES6的合并数组
[...arr1, ...arr2]
四.严格模式
- 从ES5开始,函数内部可以设定为严格模式
function doSomething(a,b){'use strict'//code
}
- ES6做了一点修改,规定只要函数参数使用了默认值、解构赋值、或者扩展运算符,那么函数内部就不能显式设置为严格模式,否则就会报错.
五.name属性
- 函数的name属性,返回该函数的函数名.
function foo(){}
foo.name //"foo"
如果将一个匿名函数赋值给一个变量,ES5的name属性, 会返回空字符串,而ES6的name属性会返回实际的函数名.
2. function构造函数返回的函数实例,name属性的值为"anonymous".
(new Function).name // "anonymous"
3.bind返回的函数,name属性值会加上“bound ”前缀。
function foo() {};
foo.bind({}).name // "bound foo"(function(){}).bind({}).name // "bound "
参考文档
ES6官方文档
ES6-rest参数相关推荐
- ES6 rest参数,扩展运算符,Symbol数据类型,迭代器和生成器 【详解加案例 】(二)
文章目录 1.ES6 rest 参数 2. ES6 扩展运算符 2.1 ES6 简介 2.2 应用 3. ES6 Symbol 数据类型 3.1 Symbol两种创建方式 3.2 Symbol注意事项 ...
- ES5和ES6可变参数
在ES5中,可变参数依靠arguments,代码如下: <!DOCTYPE html> <html> <head> <meta charset="u ...
- ES6——rest参数
ES6 引入 rest 参数(形式为...变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了.rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中. functio ...
- ES6——函数参数默认值
ES6 之前,不能直接为函数的参数指定默认值,ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面. function fun(x = 'Hello'){console.log(x); } f ...
- ES6函数参数的默认值
基本用法 在ES6之前,不能直接将函数的参数指定默认值,只能采用变通的方法 function fn(x,y) {y = y || 'World'console.log(x,y) }fn('Hello' ...
- ES6 Rest参数
Rest参数接收函数的多余参数,组成一个数组,放在形参的最后,形式如下: function func(a, b, ...theArgs) { // ... } rest参数只包括那些没有给出名称的参数 ...
- ES6函数参数的解构赋值,以及2种设置参数默认值方法的区别
文章目录 1. 函数参数的解构赋值方式 2. 函数参数解构设置参数默认值 1. 方法1 2. 方法2 3. 总结 1. 函数参数的解构赋值方式 下面代码中,函数add的参数表面上是一个数组,但在传入参 ...
- es6 箭头函数 rest参数 扩展运算符
Es6 箭头函数 语法: 普通函数: fn=function(){} 箭头函数: fn=()=>{} 特性: this是静态的,this始终指向函数声明时所在作用域下的this的值(使用call ...
- ES6新特性——rest参数
ES6引入rest参数,用于获取函数的实参,用来代替arguments; 下面对比一下ES5和ES6获取实参的方式: 1.ES5获取实参的方式: function date() {console.lo ...
- 前端知识 | 简析ES6
CMAScript 6 简介: CMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了.它的目标,是使得 JavaScript ...
最新文章
- 计算机 课题学科代码,学科分类与代码表课题.doc
- Linux 退出保存/不保存
- python qtdesigner安装,PyCharm+Qt Designer+PyUIC安装配置教程详解
- [Tomcat报错]SEVERE: Error listenerStart
- CSS中的块元素,内联元素,内联块元素
- poj2955 Brackets (区间dp)
- 《Android开发艺术探索》读书笔记 (7) 第7章 Android动画深入分析
- 一种常见(粒度,统计值)报表的实现方案
- oracle dbv验证,ORACLE施用dbv工具检验数据文件是否有坏块
- [luogu P2183] [国家集训队]礼物 {exlucas}
- 参考文献类型标识码--中英文对照
- php7没有pecl,PHP7 pecl 安装 mongodb扩展 和 PHPLIB
- Hyperledger Fabric 2.x 环境搭建
- Python中pandas.Dataframe数据筛选
- java计算机毕业设计消防网站源代码+数据库+系统+lw文档
- Steam游戏—底特律:化身成人,回家章节中女主角上二楼打扫卫生,按L Shift开窗按不动怎么办
- matlab输入数据作方程,用MATLAB函数编写并求解微分方程
- 欲先攻其事必先利其器 (第三方资源篇)
- 【RPO技巧拓展】————5、RPO攻击初探
- UCOS-Ⅲ:软件定时器