ES6学习笔记之函数的扩展

Xu Quan（Nikkkki）

2018-08-03

学习笔记

ES6, JavaScript

Learning Card

函数参数的默认值
- 可以直接为函数指定参数的默认值
- 参数严格等于undefined时默认值生效
- 指定默认值的参数应作为尾参数
- 函数参数的length属性不包括默认值参数
rest参数
- 写法： …变量名
- 用来获取多余的参数
- 是一个真实的数组
- rest参数之后不能有其他参数
- length属性不包括rest参数
name属性
- 返回函数的函数名
箭头函数
- function改为=>
- 当函数不需要参数或者需要多个参数时，使用()来包含参数，只有一个参数时可以省略圆括号
- 如果箭头函数的代码块部分多余一条语句，用{}括起来，使用return返回；如果只有一条语句，可以省略{}和`return
- this总是指向定义时的对象

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 China

这里会先检查y是否被赋值了，如果没有，就赋值为World，但是这样写会有一些问题，如果y的值对应的布尔值是false，该赋值就不起作用。

ES6允许为函数的参数指定默认值。

function log(x, y = 'World') {
  console.log(x, y);
}
log('Hello')  // Hello World
log('Hello', 'China')  // Hello China
log('Hello', '')  // Hello

这里只有当y的赋值严格等于undefined的时候，默认值才会有效。如果给y赋值为空字符串''，那么y的值就为空字符串。

参数默认值的位置

参数默认值建议作为函数的尾参数，这样在设置参数值的时候，能更方便地省略设置该参数。如果参数默认值设置在非尾部，那么在省略该参数时，容易将赋值给后面参数的值错误地赋值到默认值上来。

function fn(x = 1, y) {
  return [x, y];
}
fn(2)  //[2, undefined]

函数的`length`属性

函数的length属性是指该函数预期传入的参数个数，如果某个参数被指定了默认值，那么预期传入的参数就不包括这个参数了，因此length属性会返回没有设定默认值的参数个数，也就是说，指定参数的默认值后，函数的length属性将失真。

同样地，length属性也不包括rest参数。

函数参数的作用域

给函数参数指定默认值时，参数会形成一个单独的作用域（可以理解就是函数参数的括号内），等到初始化结束，作用域会消失，这在不设置参数默认值时是不会出现的。

var x = 1;
function fn(x, y = x) {
  console.log(y)
}
fn(2)  //2

上面代码中，y的默认值是变量x，调用函数fn时，参数形成一个单独的作用域，这个作用域内，默认值x指向第一个参数x，而不是全局变量x

2. rest 参数

ES6引入了rest参数，写法与arguments对象类似，形式是…变量名，用来获取函数的多余参数。

rest参数和arguments对象的区别在于，arguments对象时一个类似数组的对象，如果需要使用对象的方法，就必须使用Array.prototype.slice.call(arguments)来转换成数组使用，而rest参数是一个真正的数组

1	const sortNumbers = (...numbers) => numbers.sort();

注意点：

rest参数之后不能有其他参数
函数的length属性不包括rest参数

3. `name`属性

函数的name属性返回函数的函数名

1 2	function foo() {} foo.name // "foo"

4. 箭头函数

箭头函数的写法：

省略了关键字function
使用=>定义函数
当函数不需要参数或者需要多个参数时，使用()来包含参数，只有一个参数时可以省略圆括号
如果箭头函数的代码块部分多余一条语句，用{}括起来，使用return返回；如果只有一条语句，可以省略{}和return

1	let result = values.sort((a, b) => a-b);