具有多个参数的函数中的 Javascript 默认参数

Posted 2023-04-14

【中文标题】具有多个参数的函数中的 Javascript 默认参数

【英文标题】：Javascript default parameters in functions with multiple arguments

【发布时间】：2015-11-14 12:28:25

【问题描述】：

我有一个带有多个可选参数的函数。目前该函数没有按照我期望的方式分配默认值。

var test1 = function(arg1, arg2, arg3, arg4) 

    arg1 = arg1 || "arg1";
    arg2 = arg2 || "arg2";

    var obj = 
      arg1: arg1,
      arg2: arg2,
      arg3: arg3,
      arg4: arg4
    ;

    return(obj);

;

var obj1 = test1(arg3 = "notarg1", arg4 = "notarg2"); // Why are these values assigned to arg1 & arg2 instead of 3 & 4?

console.log(obj1);

我不明白这一点。 javascript 似乎忽略了我的 (arg3 = "notarg1", arg4 = "notarg2") 分配，而是表现得好像 (arg1 = "notarg1", arg2 = "notarg2", arg3 = undefined, arg4 = undefined) 是我的输入。

  var test2 = function(arg1, arg2, arg3, arg4) 

    if (arg1 === null) 
      arg1 = "arg1";
    
    if (arg2 === null || arg2 === "undefined") 
      arg2 = "arg2";
    

    var obj = 
      arg1: arg1,
      arg2: arg2,
      arg3: arg3,
      arg4: arg4
    ;

    return(obj);

  ;

  var obj2 = test2(arg3 = "notarg1", arg4 = "notarg2")

  console.log(obj2);

我不确定这是否值得包括在内。情况没有改变。

【问题讨论】：

在 MDN 上有一篇关于 default parameters 的好文章。请注意，它是 ECMAScript 2015 的一项功能。

您正在向函数发送两个参数，因此将值分配给返回对象的前两个属性

这些不是默认参数。您只是将分配作为该调用的参数。 JavaScript 没有命名参数！

【参考方案1】：

JavaScript 没有在 调用 函数时为您指定的参数命名的功能，所以这一行：

var obj1 = test1(arg3 = "notarg1", arg4 = "notarg2");

...没有做你认为它做的事。它这样做：

arg3 = "notarg1";
arg4 = "notarg2";
var obj1 = test1("notarg1", "notarg2");

例如，函数调用中的 arg3 = "notarg1" 只是对变量的赋值（在这种情况下，可能是 implicit global），赋值运算符的工作方式是它分配值和结果operation 是分配的值。

要使用您的代码获取参数 1 和 2 的默认值，您必须指定 undefined：

var obj1 = test1(undefined, undefined, arg3, arg4);

在那里，您正在指定 args 1 和 2，但您给它们的值是错误的，因此您的函数的 arg1 = arg1 || "arg1" 将采用 "arg1"（同样适用于 arg2）。

如果你有超过三个参数，你可能会考虑使用选项对象：

function test1(options) 
    var arg1 = options.arg1 || "arg1";
    var arg2 = options.arg2 || "arg2";
    var arg3 = options.arg3 || "arg3";
    var arg4 = options.arg4 || "arg4";

    console.log(arg1, arg2, arg3, arg4)


test(arg3: "notarg1", arg4: "notarg2");

输出：

arg1、arg2、notarg1、notarg2

---

为了完整起见，ES2015（又名 ES6）添加了默认参数值，但您仍然不能调用您在问题中显示的函数。不过，ES2015 语法确实简化了函数中的代码。

// ES2015+
function test1(arg1 = "arg1", arg2 = "arg2", arg3, arg4) 
    // ....

同样，调用时的操作是一样的，仍然没有像某些语言那样特殊的“匹配名称”功能。

【讨论】：

所以没有办法让参数被忽略？

@GeeBrownit：不是那样，不，但你可以传递一个选项对象。我只是补充了一点。

【参考方案2】：

更好的方法是将对象传递给函数。这样您就不必担心缺少参数。

var test1 = function(options) 

    var arg1 = options.arg1 || "arg1";
    var arg2 = options.arg2 || "arg2";
    ...
;

var obj1 = test1( arg1: "notarg3", arg2: "notarg1" );