Is it possible to provide default parameters with rest operator

user_7109092 0
Viewed 151

I was learning from an ES6 essential course and trying default parameters and rest operator for functions. I have defined a function sayHi as below with default parameters and then rest operator which does not gives the desired output.

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

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

}

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

The above snippet works as desired. but when I tried to set a default parameter value for greetings variable it works but gives unwanted result i.e. value 'Ahsan' is taken by the greetings variable.

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

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

}

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

Is there a way I can set default parameters in function like above before rest operator?

ecmascript-6 parameters javascript
2 Answers

You can't, no. The rest parameter only picks up the "rest" of the parameters not consumed by any previous formal parameters, so greeting will always receive the first argument's value.

Separately, since both the names and the greeting have the same type, you can't provide a default at all if you want to accept the names that way.

A couple of options for you:

A curried function

You could have a function that accepts the greeting and returns a function that uses it with whatever you pass it:

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

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

Note how we called that:

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

greet() creates the function using the default greeting. Then we call that function by using ("Ahsan", "Awais", "Haseeb") on it. greet("Hello") creates a function that uses the greeting "Hello" (and then we call it).

(I also took the liberty of using for..of rather than forEach, but it's a matter of style.)

Take names as an array

Another option is to accept the names as an array. That way, we can tell inside the function whether we got a greeting or not:

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"]);

user_1572470

you just have to pass undefined in the 1st parameter to skip optional arg
think of it like this greetings = typeof greetings != 'undefined' ? greetings : "hi" which means that check the value of greetings and if it's undefined (not provided) use the default value
edit: here is the code snippet

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

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

}

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