函数的扩展

函数参数默认值

我们来介绍一下函数的默认值，在ES6之前，不能直接为函数的参数指定默认值，只能采用变通的方式。

我们先来看看ES6之前怎么给函数参数添加默认值

function add(x, y) {
  y = y || 1;
  return x + y;
}
console.log(add(1)) // 2
console.log(add(1, 2)) // 3

我们做的是检查 y 的值有没有传入，如果没有则会默认被赋值为 1。这种方式是有缺点的，如果传入的值为布尔值 false，那么传入的值会变得无效。空字符串也是会有布尔值 false 一样的结果。

那么现在我们来看看ES6 允许设置默认值的写法吧

function add(x = 1, y = 2) {
  return x + y
}
console.log(add()); // 3
console.log(add(3)); // 5
console.log(add(2,3)); // 5

从上面的代码就可以看到，一眼就可以判断出参数是否可省略，且写法比 ES5 简洁许多

注意：

函数的参数变量是默认声明的，所以不能使用 let 或者 const 再次声明。

参数默认值的位置，必须是在函数的尾部，如果不是在尾部，否则是没法省略的。

function add([x, y] = [1, 2]) {
  return x + y
}

来我们还是先用 add 函数来举例，上面就是用的数组的解构赋值，可以个传入的数组进行解构赋值，默认解构赋值。

很奇怪吧，函数居然能有 length，来我们在这里简单提一下函数的 length 是什么。

console.log((function (x){}).length); // 1
console.log((function (x = 1){}).length); // 0
console.log((function (x, y, z = 2){}).length); // 2

没错，就是这样。它的 length 就是函数必须传入的参数，也就是函数的所有参数减去制定了默认值的参数个数。如果设置了默认值的参数不是尾参数，那么 length 属性也不再计入后面的参数了。

ES6 中引入来 rest 参数（形式为 ...变量名 ），用于获取函数的多余参数，替代 arguments 对象。

我们还是那 add 函数来举例吧。

function add(...values) {
  let sum = 0;
  for (let num of values) {
    sum += num
  }
  return sum
}
console.log(add(1,2,3,4,5)); // 15

这里就可以看出来，rest 参数是做什么用的，使用它之后，参数可以无限传入，不限制定量。

函数的 length 不包括 rest 参数。

我们来看看 ES6 中增加的箭头函数( => )，来我们还是用 add 函数来举例子，

function add(a, b) {
  return a + b
}

// 等价于
const add = (a, b) => { return a + b }

来看看更简单的写法

function multiply(n) {
  return n*n
}
// 等价于
const multiply = (n) => n*n

有时候 return 可以省略。

当然，箭头函数可以嵌套使用，会大大增加代码量

function add(x) {
  return function (y) {
    return function (z) {
      return x + y + z
    }
  }
}

上面是普通的写法，然后我们来看一下箭头函数的写法

const add = x => y => z => x + y + z

对比一下，应该就知道啦，两种的写法简便程度差别真的很大。

在这里，稍微提一下箭头函数的相关注意点：

在这里不特点讲述，如果想要具体了解，可以看一下我的另一篇文章[Javasctip - this 指向]()，文章后续补齐。