【问题标题】:Passing in undefined as a parameter in a function (ES6)在函数中将 undefined 作为参数传入(ES6)
【发布时间】:2017-01-17 06:06:41
【问题描述】:

我有一个关于使用具有默认参数的 es6 函数的问题。

这是一个例子:

const add = (a = 1, b = 2) => a + b;

如您所见,ab 分别默认为 12

使用默认值,我可以在没有任何参数的情况下调用函数,如下所示:

add(); // 3

我也可以省略参数b

add(2); // 4

要省略参数a,我可以传入undefined

add(undefined, 3); // 4

我的问题:

undefined 作为第一个参数传入以便使用默认的第一个参数(在本例中为1)调用函数是不好的做法吗?

【问题讨论】:

  • 这就是预定义变量的目的。在我看来,它完全没问题。
  • 除非不给它一个默认值更有意义(即,让它默认为undefined

标签: javascript ecmascript-6


【解决方案1】:

感谢JonathanMitchell 建议对象参数。

const add = (args = {}) => {
    const a = args.a || 1;
    const b = args.b || 2;
    return a + b;
}

例子:

add(); // 3
add({a: 2}) // 4
add({b: 3}); // 5

编辑:

loganfsmyth 提供了更好的解决方案。

使用 ||是不好的形式,因为如果你传递 0 它也会使用默认值。

更好更紧凑的解决方案:

const add = ({a = 1, b = 2} = {}) => a + b

Logan 使用 ES6 的 deconstruction assignment(参见“默认”值)分配 ab 默认值,以防这些参数评估为 undefined

【讨论】:

  • 很好的答案,使用 OR 操作绝对是明智的,以确保您不会出错,如 args.a || 1 在这个实现中。
  • 如果你想要默认值,你可以使用({a = 1, b = 2} = {}) => a + b,使用|| 是不好的形式,因为如果你传递0,它也会使用默认值。
  • @loganfsmyth 效果更好,而且更紧凑。想解释一下{a = 1, b = 2} = {}?我熟悉 es6 中的解构,但我正在努力解决这个问题。或者这不是解构?
  • @loganfsmyth 哦,没关系!我找到了here(在“默认值”下)。感谢您提供解决方案。
【解决方案2】:

在实践中,更好的选择是创建一个提要字典以传递给函数。这样,您可以设置您喜欢的值,而让其他值保持原样或其他值。

feed_dict = {x: 1, y: 2}

然后你应该构造一个函数来接收字典并对其值执行加法

const add = (dict) => {
 for (var keys in dict) {
  sum += dict[keys]
}
return sum

add(feed_dict)

【讨论】:

  • 谢谢!我发布了这个实现的答案。
  • 如果您对这么多重构持开放态度,那么当您可以只使用数组时,几乎没有理由使用对象。这个答案也没有在任何地方声明keys,并且使用for...in 是一个坏主意,因为原型链中的可枚举道具可能会导致问题。
【解决方案3】:

这通常不是最好的选择——默认参数的结构应该使得第二个仅在第一个也被使用时使用,第三个仅在前两个被使用时使用,依此类推,所以你不要'没有传入undefined的问题。

似乎没有一种标准方法可以只为第二个参数设置一个值,例如add({b: 5}) 除非你重新定义函数来获取一个对象,所以传入 undefined 似乎是唯一的选择。

MDN 在他们的文档 here 中这样做了,请参阅“示例/传递未定义”。

【讨论】:

  • 是的,我明白为什么它不是最佳选择。在我的实际代码中,我有一个函数const showPrompt = (duration = 0.667, timeout = 0) => ...。它实际上是一个 Redux 动作创建器,它调度一个函数来显示我的部分 UI,并为 timeout 设置了一个 setTimeout。大多数时候我发现自己在相同的持续时间内传递,所以我只想跳过第一个参数。
猜你喜欢
  • 2022-11-24
  • 2017-07-17
  • 2015-12-19
  • 2018-09-28
  • 1970-01-01
  • 2013-03-01
  • 2011-02-13
  • 2013-08-25
  • 2016-02-16
相关资源
最近更新 更多