JavaScript函数默认参数用法：ES6语法、undefined处理与复用技巧

本文介绍JavaScript ES6引入的函数默认参数功能。通过示例说明如何替代传统的undefined检查，实现参数初始化。重点解析默认值在运行时的计算机制，以及前序参数如何被后续默认参数复用，帮助开发者编写更简洁的函数定义。

前言

JavaScript默认参数基础

JavaScript函数支持定义默认参数值。利用默认参数特性，可以为形式参数赋予初始值。若调用函数时未提供实参，该参数的值将默认为undefined。

参考以下代码示例：


function foo(num1){
console.log(num1);
}
foo();

调用函数foo时若未传入任何参数，变量num1的值即为undefined。然而，有时我们需要指定一个具体的默认值而非undefined。在此之前，常见的做法是检测参数是否为undefined，若是则手动赋值。例如，若希望num1的默认值为9，可采用如下写法：


function foo(num1) {
if (num1 === undefined) {
num1 = 9;
}
console.log(num1);
}
foo();

ECMAScript 6引入了函数的默认参数。使用ECMA 2015的默认参数功能，你将不再需要检查未定义的参数值。现在，你可以将9设置为参数本身的默认值。你可以重写上述函数以使用默认值，如下所示：


function foo(num1 =9) {
console.log(num1);
}
foo();

对于函数foo，若调用时未传递num1参数，JavaScript引擎会自动将9赋给num1作为默认值。

显式传递undefined的情况

即使调用函数时显式传入undefined作为参数值，该参数仍会应用默认值。


function foo(num1 =9) {
console.log(num1);
}
foo(undefined);

在上述代码中，调用foo时传入undefined作为num1的值，因此num1最终被设置为默认值9。

默认值的运行时计算

JavaScript函数的默认值是在运行时计算的。为阐明此机制，请参考以下代码：


function foo(value = koo()) {
return value;
}
function koo() {
return "Ignite UI";
}
var a = foo();
console.log(a);

在函数foo中，参数value的默认值被设定为调用函数koo。当运行foo函数时，才会执行koo的计算。调用foo后，输出结果如下图所示（本例使用了Ignite UI框架）。

JavaScript默认参数基础

默认参数的复用

已定义的默认参数可供后续参数的默认值计算使用。参考以下代码：


function foo(num1 = 9, num2 = num1 + 8){
console.log(num2);
}
foo();

在上述代码中，num2的默认值基于num1的默认值进行计算。调用函数foo时，输出结果如下：

JavaScript默认参数基础

结论

JavaScript默认参数在函数定义中极具实用价值。当调用函数缺少实参时，默认参数机制允许为形参指定默认值，避免其默认为undefined。

英文原文：Easy JavaScript Part 3: What Is a Default Parameter in a Function?

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持本站。