es6学习-函数扩展

函数的扩展

函数参数的默认值

基本用法

ES6提供了函数的指定默认值的写法，例子如下

function Point(x = 0, y = 0) {
   
  this.x = x;
  this.y = y;
}

const p = new Point();
p // { x: 0, y: 0 }

优点：①读代码的人容易知道哪些参数可以省略。②以后代码优化，把这参数去掉也不会导致代码无法运行。

有几个注意点

①参数是默认声明，不能使用let或const再次声明

function foo(x = 5) {
   
  let x = 1; // error
  const x = 2; // error
}

②函数参数不能有同名参数

// 不报错
function foo(x, x, y) {
   
  // ...
}

// 报错
function foo(x, x, y = 1) {
   
  // ...
}
// SyntaxError: Duplicate parameter name not allowed in this context

③参数的值是重新计算默认值的表达式的值。也就是说，参数是惰性求值

let x = 99;
function foo(p = x + 1) {
   
  console.log(p);
}

foo() // 100

x = 100;
foo() // 101

与解构赋值默认值结合使用

参数默认值可以与解构赋值结合起来使用，实现参数的自动赋值以及对一些配置项进行省略。

例子如下

// 写法一
function m1({
   x = 0, y = 0} = {
   }) {
   
  return [x, y];
}

// 写法二
function m2({
   x, y} = {
    x: 0, y: 0 }) {
   
  return [x, y];
}

第一种写法由于第二种，因为第一种写法当传过来的参数为undefined时，参数是有值的，而第二种参数是无值的，因为当有参数传过来的时候，就不会使用默认值。

参数默认值的位置

有默认值的参数一般都是放在函数参数的尾部，因为这样比较容易看出来，哪些参数是可以省略的，而如果设置了默认值的参数不再尾部的话，这个参数其实是不能省略的。

例子

// 例一
function f(x = 1, y) {
   
  return [x, y];
}

f() // [1, undefined]
f(2) // [2, undefined])
f(, 1) // 报错
f(undefined, 1) // [1, 1]

// 例二
function f(x, y = 5, z) {
   
  return [x, y, z];
}

f()