首页 1 2 3 4 5 6 7

javascript 函数默认参数

JavaScript是一种广泛应用于前端开发的脚本语言，其中函数是代码重用的关键部分。缺省参数是Javascript中有趣的特性之一，它使代码更简洁且易于读取。制定函数时，您可以指定参数的默认值。这意味着，如果执行函数时没有提供该参数，则会使用默认值。默认参数的使用很简单，而且可以减少源代码的数量，让您的代码更具可读性。来看下面的例子：

function greet(name = 'World') {
console.log('Hello, ' + name + '!');
}
greet(); //输出 "Hello, World!"
greet('Walter'); //输出 "Hello, Walter!"

在上面的代码中，如果调用函数时没有提供name参数，则参数将会被设为"default"。这种情况下，"World"是默认参数。当有许多函数参数时，您可以提供默认值以便更容易处理一组可选参数。以下代码示例展示了这一点：

function logDetails(name, age = 25, gender = 'male', profession = 'unemployed') {
console.log('Name:', name);
console.log('Age:', age);
console.log('Gender:', gender);
console.log('Profession:', profession);
}
logDetails('John'); //输出 Name: John Age: 25 Gender: male Profession: unemployed
logDetails('Lisa', 30, 'female', 'designer'); 
//输出 Name: Lisa Age: 30 Gender: female Profession: designer

在上面的代码中，第一个参数name是必需的，但是对于其他参数，如果不进行传递，将会使用默认的25岁、男性、无业。这些默认值只在调用函数时使用。在ES5中，模拟默认参数值是通过检查undefined值来完成的。以下代码示例展示了这一点：

function add(a, b) {
if (typeof b === 'undefined') {
b = 0;
}
return a + b;
}
add(1, 2); //输出 3
add(1); //输出 1

但是，在ES6中，通过提供默认值语法使其变得更加简单：

function add(a, b = 0) {
return a + b;
}
add(1, 2); //输出 3
add(1); //输出 1

使用默认名称的缺省参数也是可行的。以下代码示例展示了这一点：

function greet(name = 'World', salutation = `Hello,`) {
console.log(`${salutation} ${name}!`);
}
greet(); //输出 "Hello, World!"
greet('Louisa', 'Hi,'); //输出 "Hi, Louisa!"

由于在第一个函数调用中不提供salutation参数，所以将会使用默认值“Hello,”，而在第二个函数调用中使用了新的值“Hi，”。默认参数名可以引用前一个参数。以下代码示例展示了这一点：

function argUsage(a, b = a + 1) {
console.log(`a is ${a}, b is ${b}`);
}
argUsage(0); //输出 "a is 0, b is 1"
argUsage(3, 4); //输出 "a is 3, b is 4"
argUsage(); //输出 "a is undefined, b is NaN"

代码中，如果调用函数时没有传递参数a，则a保持为undefined，b作为根据a的默认值计算而来的 NaN。在ES6之前，制定默认参数的主要方法是使用 || 或三元运算符。以下代码示例演示了这一点：

function multiply(a, b) {
a = a || 1;
b = b || 1;
return a * b;
}
multiply(2, 3); //返回 6
multiply(2); //返回 2
multiply(); //返回 1

如果未提供参数，则 || 运算符使用默认值。在上面的例子中， || 运算符仅在未传递任何参数时与0值参数混淆。此外，因为0是一个有效的数字，所以我不能使用它作为默认值。同样的限制适用于空字符串和布尔值false。三元运算符可以使用单行表达式更紧凑地完成默认参数。以下代码示例展示了这一点：

function multiply(a, b) {
a = (typeof a !== 'undefined') ? a : 1;
b = (typeof b !== 'undefined') ? b : 1;
return a * b;
}
multiply(2, 3); //返回 6
multiply(2); //返回 2
multiply(); //返回 1

使用默认名称的缺省参数也是可行的。以下代码示例展示了这一点：

function greet(name = 'World', salutation = `Hello,`) {
console.log(`${salutation} ${name}!`);
}
greet(); //输出 "Hello, World!"
greet('Louisa', 'Hi,'); //输出 "Hi, Louisa!"

由于在第一个函数调用中不提供salutation参数，所以将会使用默认值“Hello，”，而在第二个函数调用中使用了新的值“Hi，”。在编写函数时使用默认参数，可以使得代码更加简洁且易于维护。无需将代码复杂化只是为了处理可选参数，使用默认参数的方式非常便捷且直观。通过控制参数的默认值，您可以更好地掌控如何使用自己的函数，也让其他人更易于阅读和调用函数。

javascript 函数 默认 参数

javascript 函数默认参数