1. 思路
在函数体内部检测该参数是否有值,没有值则赋默认值,有值则使用原来的值。
2. 实现
1. 使用 if 语句
function test(a, b, c) {
if (!b) b = 'b的默认值';
if (!c) c = 'c的默认值';
console.log(a, b, c)
}
test(1, 2);
函数参数不是必需的,运行时无论提供多少个参数,JavaScript 都不会报错,省略的参数的值就变为 undefined
。以上示例中 c
的值为 undefined
,进行取反运算后将返回布尔值 true
,所以会执行后面的赋值语句:c ='c的默认值'
;控制台打印结果:
使用 if 语句是最容易想到的,我们还可以进行简化,写更少的代码。
2. 使用三元运算符:?:
function test(a, b, c) {
b = b ? b : 'b的默认值';
c = c ? c : 'c的默认值';
console.log(a, b, c)
}
test(1, 2);
三元运算符是简化 if 语句的常用技巧,?
左边的表达式是条件,若返回值为 true
,那么执行 :
左边的表达式,否则执行 :
右边的表达式。
3.使用逻辑或运算符: ||
function test(a, b, c) {
b = b || 'b的默认值';
c = c || 'c的默认值';
console.log(a, b, c)
}
test(1, 2);
这里用到了逻辑或运算符的特性:当 ||
左侧表达式的值转换为布尔值为 true
时,返回左侧表达式的值;当 ||
左侧表达式的值转换为布尔值为 false
时,返回右侧表达式的值。
当左侧表达式值为真时,不论右侧表达式的值为什么,整个表达式的值都为真;当左侧表达式的值为假时,右侧表达式的值决定整个表达式的值。
这是因为或运算符的规则:
有一个条件为真,那么或运算返回值为真;如果所有条件都为假,那么或运算返回值为假。即:“一真为真,全假为假”。
4. 使用 arguments 对象
arguments
对象用来在函数体内部读取所有参数。
以上3种为函数参数设置默认值的方法都可用 arguments
对象改写。
// if 语句
function test(a, b, c) {
if (!arguments[1]) b = 'b的默认值';
if (!arguments[2]) c = 'c的默认值';
console.log(a, b, c)
}
test(1, 2);
// 三元运算符
function test(a, b, c) {
b = arguments[1] ? arguments[1] : 'b的默认值';
c = arguments[2] ? arguments[2] : 'c的默认值';
console.log(a, b, c)
}
test(1, 2);
// 短路运算符
function test(a, b, c) {
b = arguments[1] || 'b的默认值';
c = arguments[2] || 'c的默认值';
console.log(a, b, c)
}
test(1, 2);
注意:arguments 对象可以在运行时修改,也就是说,修改 arguments 参数会影响到实际的参数。但在严格模式下修改 arguments 对象不会影响到实际的参数。