是否可以使用 rest 运算符提供默认参数

Question

我正在学习 ES6 基础课程并尝试函数的默认参数和剩余运算符。 我已经定义了一个函数sayHi，如下所示，带有默认参数，然后是没有给出所需输出的rest运算符。

const sayHi = (greetings, ...names) => {

    names.forEach(item => {
        console.log(`${greetings} ${item}`);
    });

}

sayHi('Hi', 'Ahsan', 'Awais', 'Haseeb');

上面的 sn-p 可以按需要工作。但是当我尝试为greetings 变量设置默认参数值时，它可以工作，但会给出不需要的结果，即'Ahsan' 的值被greetings 变量采用。

const sayHi = (greetings = ' Hi', ...names) => {

  names.forEach(item => {
    console.log(`${greetings} ${item}`);
  });

}

sayHi('Ahsan', 'Awais', 'Haseeb');

有没有办法在休息运算符之前像上面一样在函数中设置默认参数？

Answer 1

你不能，不。剩余参数仅获取未被任何先前形式参数消耗的参数的“剩余”参数，因此greeting 将始终接收第一个参数的值。

另外，由于名称和问候语具有相同的类型，因此如果您想以这种方式接受名称，则根本无法提供默认值。

几个选项供您选择：

柯里化函数

你可以有一个函数来接受问候并返回一个函数，该函数与你传递的任何内容一起使用：

const greet = (greeting = "Hi") => (...names) => {
    for (const name of names) {
        console.log(`${greeting} ${name}`);
    }
};

greet()("Ahsan", "Awais", "Haseeb");
greet("Hello")("Ahsan", "Awais", "Haseeb");

注意我们如何称呼它：

greet()("Ahsan", "Awais", "Haseeb");

greet() 使用默认问候语创建函数。然后我们通过在其上使用("Ahsan", "Awais", "Haseeb") 来调用该函数。 greet("Hello") 创建一个使用问候 "Hello" 的函数（然后我们调用它）。

（我也冒昧地使用for..of 而不是forEach，但这是风格问题。）

把名字当作数组

另一种选择是将名称作为数组接受。这样，我们就可以在函数内部判断我们是否收到了问候：

const greet = (greeting, names) => {
    if (Array.isArray(greeting)) {
        names = greeting;
        greeting = "Hi";
    }
    for (const name of names) {
        console.log(`${greeting} ${name}`);
    }
};

greet(["Ahsan", "Awais", "Haseeb"]);
greet("Hello", ["Ahsan", "Awais", "Haseeb"]);

Answer 2

您只需在第一个参数中传递 undefined 即可跳过可选参数
像这样想greetings = typeof greetings != 'undefined' ? greetings : "hi" 这意味着检查greetings 的值，如果它未定义（未提供）使用默认值
编辑：这里是代码 sn-p

const sayHi = (greetings = ' Hi', ...names) => {

  names.forEach(item => {
    console.log(`${greetings} ${item}`);
  });

}

sayHi(undefined, 'Ahsan', 'Awais', 'Haseeb');