默认函数参数不起作用答案

【问题标题】：The default function argument does not work默认函数参数不起作用
【发布时间】：2021-08-17 13:30:27
【问题描述】：

有一个函数具有默认参数值

const range = (start = 0, stop, step = 1) => {
  console.log('start', start)
  console.log('stop', stop)
  console.log('step', step)
}

range(4)

请解释为什么控制台显示

start 4
stop undefined
step 1

虽然我认为它应该出来

start 0
stop 4
step 1

因为我为 start 参数传递了一个默认值。如何纠正这种行为？谢谢

【问题讨论】：

“虽然我认为它应该出来” - 为什么？你只传入了第一个参数。 --- 如果您不想关心参数顺序，请使用对象。
参数顺序很重要。 Javascript 不会自动将参数值分配给您没有为其提供默认值的参数。将range(4) 更改为range(undefined, 4, undefined)
或者，使用单个对象作为参数...const range = ({start = 0, stop, step = 1}) => { 和range({stop:4})
@AdilBimzagh 不是假的。只有未定义。 fn = (a = 'hello') => a; fn(null); fn(false); // null and false
@AdilBimzagh "...仅当该参数的值是假的时" - 不。如果值为undefined

标签： javascript function default-arguments

【解决方案1】：

将第一个参数作为未定义传递 - 因为函数的参数是“位置”的，即第一个参数获取调用中的第一个值，第二个获取第二个等

如果您将undefined 作为参数传递，则会分配“默认值”（如果存在）

const range = (start = 0, stop, step = 1) => {
  console.log('start', start)
  console.log('stop', stop)
  console.log('step', step)
}

range(undefined, 4)

或者使用单个对象作为参数，具有启动、停止步骤的属性

也称其为自我记录

const range = ({start = 0, stop, step = 1}) => {
  console.log('start', start)
  console.log('stop', stop)
  console.log('step', step)
}

range({stop:4})

【讨论】：

【解决方案2】：

正如 cmets 所说，您没有为第二个参数传递任何值。因此它仍然是隐含的undefined。

如果你想要的东西和你期望的一样，你需要

function range(start = undefined, stop = undefined, step = 1) {
  if (stop === undefined && start !== undefined) {
    stop = start;
    start = 0;
  }
  console.log("start", start);
  console.log("stop", stop);
  console.log("step", step);
}

range(4);

改为。

【讨论】：

start = undefined, stop = undefined - 未定义的默认值是多余的，不是吗？
是的，但它们向读者表明这些参数被认为是可选的。
但是，它们不是可选的 :p 不是两者兼而有之 - 哦，对 .. 嗯……虽然不是很明显 :p

【解决方案3】：

您传递的 4 参数用于 start 参数。 JavaScript 中的参数和参数位置是完全有序的，分配4 的位置的决定不是基于传递的参数总数，纯粹是在哪里 传递了参数。由于它在第一个位置，它被分配给第一个参数，start。

如果你想要你的结果，你可以将undefined 传递给start：

range(undefined, 4)

现场示例：

const range = (start = 0, stop, step = 1) => {
  console.log('start', start)
  console.log('stop', stop)
  console.log('step', step)
}

range(undefined, 4)

您可以改为根据接收到的参数数量来分配值，尽管这可能并不理想（这并不常见，因此可能令人惊讶）。但是您可以通过接受一个休息参数并从那里开始工作来做到这一点......我不推荐它。

另一种方法是接受一个选项对象：

const range = ({start = 0, stop, step = 1}) => {
    if (typeof stop === "undefined") {
        throw new Error(`The 'stop' option is required`);
    }
    console.log(`start = ${start}, stop = ${stop}, step = ${step}`);
}

现场示例：

const range = ({start = 0, stop, step = 1}) => {
    if (typeof stop === "undefined") {
        throw new Error(`The 'stop' option is required`);
    }
    console.log(`start = ${start}, stop = ${stop}, step = ${step}`);
}

range({stop: 4});
range({start: 1, stop: 5});
range({start: 1, stop: 5, step: 2});

【讨论】：