ES6函数的扩展
以下内容摘自--ES6标准入门(阮一峰),纯粹为了记忆。
函数参数的默认值
1、基本用法
在ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法。
function log(x,y) { y=y||'World'; console.log(x,y) } log('Hello') //Hello World log('Hello','China')//Hello China log('Hello','')//Hello World
如果用户给参数y赋值false,这时候是不起作用的。并且以上第三个y参数期望输出空串,但是也变为了World.为了避免这种情况我们可以变为以下:
if(typeof y==='undefined')
{
y='World';
}
ES6允许为函数的参数设置默认值,即直接写在参数定义的后面:
function log(x,y='World') { console.log(x,y); } log('Hello')//Hello World log('Hello','China') //Hello China log('Hello','')//Hello
参数变量时默认声明的,所以不能用let或const再次声明。
function foo(x=5) { let x=1; //error const x=2;//error }
上面的代码中,参数变量X是默认声明的,在函数体中不能用let或const再次声明,否则会报错。
2、与解构赋值默认值结合使用
参数默认值可以与解构赋值的默认值结合使用。
function foo({x,y=5}) { console.log(x,y); } foo({})//undefined,5 foo({x:1})//1,5 foo({x:1,y:2})//1,2 foo()//Error
上面的代码使用了对象的解构赋值默认值,而没有使用函数参数的默认值。只有当函数foo的参数是一个对象时,变量x和y才会通过解构赋值而生成。如果函数foo调用时参数不是对象,变量x和y就不会生成,从而报错。
3.参数默认值的位置
通常情况下,定义了默认值的参数应该是函数的尾参数。因为这样比较容易看出到底省略了哪些参数。如果非尾部的参数设置了默认值,实际上这个参数是无法省略的。
function f(x=1,y) { return[x,y]; } f()//[1,undefined] f(2)//[2,undefined] f(,1)//报错 f(undefined,1)//[1,1]
如果传入undefined,将触发该参数等于默认值,null则没有这个效果。
function foo(x=5,y=6) { console.log(x,y); } foo(undefined,null)//5,null
4.函数length属性
(function(a){}).length//1 (function(a=5){}).length//0 (function(a,b,c=5){}).length//2
这是因为length属性的含义是该函数预期传入的参数个数。某个参数指定默认值以后,预期传入的参数个数就不包含这个参数了。同理,rest参数也不会计入length属性。
如果设置了默认的参数不是尾参数,那么length属性也不再计入后面的参数。
(function(a=0,b,c){}).length//0 (function(a,b=1,c)()).length//1
5、作用域
一旦设置了参数的默认值,函数进行声明初始化时,参数会形成一个单独的作用域(context).等到初始化结束,这个作用域就会消失。这种语法行为在不设置参数默认值时时不会出现的。
var x=1; function f(x,y=x) { console.log(y); } f(2)//2
上面的代码中,参数y的默认值等于变量x.调用函数f时,参数形成一个单独的作用域。在这个作用域里面,默认值变量x指向第一个参数x,而不是全局变量x,所以输出是2.
let x=1; function f(y=x) { let x=2; console.log(y); } f()//1
上面的代码中,函数f调用时,参数y=x形成一个单独的作用域。在这个作用域里面,变量x本身没有定义,所以指向外层的全局变量x.函数调用时,函数体内部的局部变量x影响不到默认值变量x.
如果参数的默认值是一个函数,该函数的作用域也遵守这个规则。
let foo='outer'; function bar(func=x=>foo) { let foo='inner'; console.log(func()); } bar();//outer
函数bar的参数func的默认值是一个匿名函数,返回值为变量foo.函数参数形成的单独作用域里面并没有定义变量foo,所以foo指向外层的全局变量foo,因此输出outer.
rest参数
ES6引入了rest参数(形式为"...变量名"),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest参数搭配的变量是一个数组,该变量将多余的参数放入其中。
function add(...values) { let sum=0; for(var val of values) { sum+=val; } return sum; }
add(2,5,3)//10
下面是一个rest参数代替arguments变量的例子。
function sortNumbers() { return Array.prototype.slice.call(arguments).sort(); } //rest参数的写法 const sortNumbers=(...numbers)=>numbers.sort();
rest参数中的变量代表一个数组,所以数组特有的方法都可以用于这个变量。
rest参数之后不能再有其他参数(即只能是最后一个参数)。否则会报错。
name属性
函数的name属性返回该函数的函数名。
function foo(){} foo.name//"foo"
ES6对这个属性的行为做出了一些修改。如果将一个匿名函数赋值给一个变量,ES5的name属性会返回空字符串,而ES6的name属性会返回实际的函数名。
var f=function (){}; //ES5 f.name //"" //ES6 f.name //"f"
如果将一个具名函数赋值给一个变量,则ES5和ES6的name属性都返回这个具名函数原本的名字。
const bar=function baz(){}; //ES5 bar.name //"baz" //ES6 bar.name //"baz"