如何为JavaScript函数的capacity参数传值并保留name默认值？

问题场景 #

你定义了带默认参数的函数：

function Js(name = 'Mango' , capacity = 40){
  console.log(`${name} with a capacity ${capacity} will be delivered !!!`)
}

调用Js()或Js("Something", 40)都能正常工作，但需要只给capacity传值，同时让name保持默认值，期望输出：Mango with a capacity 55 will be delivered !!!

解决方案 #

方法1：显式传递undefined

在JavaScript中，当参数传入undefined时，会触发该参数的默认值逻辑。直接这样调用即可：

Js(undefined, 55)

执行后会输出预期结果：Mango with a capacity 55 will be delivered !!!

方法2：改用对象作为参数（推荐）

如果参数数量较多，传递undefined容易造成混淆，推荐将参数改为对象形式，通过解构赋值设置默认值：

function Js({ name = 'Mango', capacity = 40 } = {}){
  console.log(`${name} with a capacity ${capacity} will be delivered !!!`)
}

此时可以单独指定需要修改的参数，未指定的参数自动使用默认值：

Js({ capacity: 55 })

这种方式代码可读性更高，后续扩展参数也更方便。

方法3：调整参数顺序（不推荐）

如果可以修改函数定义，可将带默认值的前置参数移到后面，但这会破坏原有调用逻辑：

function Js(capacity = 40, name = 'Mango'){
  console.log(`${name} with a capacity ${capacity} will be delivered !!!`)
}
// 直接传递capacity的值
Js(55)

注意：这种方法会让原有的Js("Something", 40)调用逻辑改变（"Something"会被赋值给capacity），仅适用于无旧调用依赖的场景。

内容的提问来源于stack exchange，提问作者Web Host