在 ES6 中,我们可以通过设置函数参数的默认值来为函数提供更好的灵活性和可读性。本文将介绍 ES6 中函数参数默认值的设置方式,并重点讨论其注意事项。
设置函数参数默认值的方式
我们可以在函数定义的参数列表中使用赋值运算符 =
来设置函数参数的默认值。例如:
function foo(x = 0, y = 1) { console.log(x, y); }
在上面的示例中,foo
函数定义了两个参数 x
和 y
,并为它们设置了默认值 0
和 1
。这意味着,如果在调用 foo
函数时不传入任何参数,那么 x
的值将为 0
,y
的值将为 1
。
如果在调用 foo
函数时传入了参数,那么这些参数将会覆盖默认值,例如:
foo(); // 0 1 foo(2); // 2 1 foo(2, 3); // 2 3
除了使用赋值运算符 =
,我们还可以使用其他表达式来为函数参数设置默认值。例如,我们可以使用函数调用来设置默认值:
// javascriptcn.com 代码示例 function bar(x = getDefault()) { console.log(x); } function getDefault() { console.log('getDefault() called'); return 0; } bar(); // getDefault() called 0 bar(2); // 2
在上面的示例中,bar
函数使用 getDefault()
函数的返回值作为 x
的默认值。当调用 bar
函数时不传入任何参数时,getDefault()
函数将被调用,x
的默认值将为 0
。
注意事项
虽然使用函数参数默认值可以使代码更简洁易读,但在实际使用中,我们需要注意以下事项。
1. 默认值表达式只在函数被调用时求值
在函数定义时,函数参数的默认值表达式并不会被求值。它们只会在函数被调用时,当没有传入对应的参数时才会被求值。例如:
// javascriptcn.com 代码示例 let a = 1; function baz(x = a + 1) { console.log(x); } baz(); // 2 a = 2; baz(); // 3
在上面的示例中,我们使用变量 a
的值作为 x
的默认值表达式。当我们调用 baz
函数时,x
的默认值为 2
,因为此时变量 a
的值为 1
。但当我们修改变量 a
的值为 2
时,在再次调用 baz
函数时,x
的默认值为 3
,因为此时变量 a
的值为 2
。
2. 只有 undefined 才会触发默认值
只有当传入的函数参数值为 undefined
时,才会触发对应参数的默认值。例如:
function qux(x = 1, y = 2) { console.log(x, y); } qux(undefined, 3); // 1 3 qux(null, 3); // null 3
在上面的示例中,我们将参数 x
的值显式地传入 undefined
,这将触发 qux
函数使用 x
的默认值 1
,而 y
的值将为 3
。然而,如果我们将 null
作为 x
的传入值,那么 x
的值就会变为 null
,而不是使用默认值 1
。
3. 默认值对 arguments 不造成影响
即使对函数参数使用了默认值,也不会对 arguments
对象造成影响。例如:
function quux(x = 1, y = 2) { console.log(arguments[0], arguments[1]); } quux(); // undefined undefined quux(1, 3); // 1 3 quux(1); // 1 undefined
在上面的示例中,我们使用 arguments
对象来访问函数参数,而未使用命名函数参数。即使我们未传入任何参数时,arguments
对象也没有默认值,其值将为 undefined
。
总结
本文介绍了在 ES6 中设置函数参数默认值的方式,并讨论了其注意事项,包括默认值表达式只在函数被调用时求值、只有 undefined
才会触发默认值、以及默认值对 arguments
对象不造成影响等。了解这些注意事项将帮助我们更好地使用函数参数默认值,使我们的代码更简洁易读,提高开发效率。
来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/652fc3347d4982a6eb0f3826