ES6 中的函数默认参数的使用及注意事项

阅读时长 4 分钟读完

在 ES6 中,我们可以使用函数默认参数来使函数在没有传递参数时使用默认值。本文将介绍 ES6 中的函数默认参数的使用方法及注意事项,以及与之前使用普通参数的方式的区别。

基本使用方法

ES6 中函数默认参数的语法格式如下:

这里 param1param2 是函数的参数,defaultValue1defaultValue2 分别是 param1param2 的默认值。当调用该函数时,如果没有传递实参,则 param1param2 将使用默认值。

示例代码如下:

注意事项

默认参数可选

如果函数有默认参数,则该参数是可选的。也就是说,在调用函数时可以省略该参数,并使用默认值。例如:

在这个示例中,省略第二个参数 b 并使用了默认值 0

使用 undefined 可以触发默认参数

当函数调用时传递的某个参数为 undefined 时,将会触发默认参数。例如:

在这个示例中,传递了第一个参数 5,但是为第二个参数 num2 传递了 undefined。由于 undefined 会触发默认参数,因此 num2 的默认值 3 会被使用。

默认参数的暂时性死区

默认参数的值也遵循暂时性死区(TDZ)规则。也就是说,在函数体内声明的参数也不能在初始化之前被引用。

示例代码如下:

在这个示例中,函数体内的第一个参数 a 中引用了第二个参数 b,但 b 尚未初始化,因此在初始化之前进行了引用,这样会抛出一个未定义错误。

使用函数参数默认值时,需要谨慎总结

在函数参数默认值模式下,你需要谨慎总结你的代码,以免在不必要的情况下给代码造成混淆和错误。尤其是在默认值为对象时,一定要注意不要给对象默认值的可变属性附加值。

示例代码如下:

在这个示例中,函数使用了一个默认值为对象的参数,并给该对象的 message 属性设置了默认值为空数组。但是由于默认值是可变的,所以在第二次调用该函数时,message 属性中已存在的值将保留下来,并再次被添加到数组中。

如何在项目中使用?

在实际项目开发中,我们可以根据需要使用函数参数的默认值。在一些不确定性比较高的场景下,我们可以使用函数参数的默认值来缩短代码,并提高代码的可读性。但是在某些情况下,我们最好仍然使用传统方法来传递参数,以避免出现意外错误。

结论

ES6 中的函数默认参数可使得函数调用时,未传递参数的情况下使用默认值。但是在使用默认参数时,需要谨慎总结,并在必要的情况下使用传统参数传递方式。了解函数默认参数的使用方法及注意事项对于前端开发人员而言是必不可少的。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/649e25dc48841e9894aae927

纠错
反馈