JavaScript函数参数的默认值（附带实例）

在 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

上面代码检查函数 log() 的参数 y 有没有赋值，如果没有，则指定默认值为 World。这种写法的缺点在于，如果参数 y 赋值了，但是对应的布尔值为 false，则该赋值不起作用。就像上面代码的最后一行，参数 y 等于空字符串，结果被改为默认值。

为了避免这个问题，通常需要先判断一下参数 y 是否被赋值，如果没有，再等于默认值。

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

可以看到，ES6 的写法比 ES5 简洁许多，而且非常自然。这样的写法有两个优点：

首先，阅读代码的人可以立刻意识到哪些参数是可以省略的，不用查看函数体或文档；
其次，有利于将来的代码优化，即使未来的版本在对外接口中，彻底拿掉这个参数，也不会导致以前的代码无法运行。

【实例】函数参数默认值应用。

<script>
function throwIfMissing() {
    throw new Error('Missing parameter');
}

function foo(mustBeProvided = throwIfMissing()) {
    return mustBeProvided;
}

foo() // Error: Missing parameter
</script>

利用参数默认值，可以指定某一个参数不能省略，如果省略就抛出一个错误。程序中的 foo() 函数，如果调用的时候没有参数，就会调用默认值 throwIfMissing() 函数，从而抛出一个错误。

从程序中还可以看到，参数 mustBeProvided 的默认值等于 throwIfMissing() 函数的运行结果（注意函数名 throwIfMissing 之后有一对圆括号），这表明参数的默认值不是在定义时执行，而是在运行时执行。如果参数已经赋值，则默认值中的函数就不会运行。

JavaScript函数参数的默认值（附带实例）

相关文章