If you can use the spread operator to_spread_an array into multiple elements, then certainly there should be a way to bundle multiple elements back into an array, right?

In fact, there is! It’s called therest parameter, and it’s another new addition in ES6.

Rest parameter

Therest parameter, also written with three consecutive dots (...), allows you to represent an indefinite number of elements as an array. This can be helpful in a couple of different situations.

One situation is when assigning the values of an array to variables. For example,

const order = [20.17, 18.67, 1.50, "cheese", "eggs", "milk", "bread"];
const [total, subtotal, tax, ...items] = order;
console.log(total, subtotal, tax, items);

Prints:20.17 18.67 1.5 ["cheese", "eggs", "milk", "bread"]

This code takes the values of theorderarray and assigns them to individual variables usingdestructuring.total,subtotal, andtaxare assigned the first three values in the array, however,itemsis where you want to pay the most attention.

By using the rest parameter,itemsis assigned the_rest_of the values in the array (as an array).

const myPackage = ["eggs", "bacon", "milk", "cheese"];
console.log(...myPackage); // eggs, bacon, milk, cheese

printPackageContents("eggs", "bacon", "milk", "cheese");
function printPackageContents(...items) {
    for (const item of items) {
        console.log(item);
    }
}

You can think of the rest parameter like the opposite of the spread operator; if the spread operator is like unboxing all of the contents of a package, then the rest parameter is like taking all the contents and putting them back into the package.

Variadic functions

Another use case for the rest parameter is when you’re working with variadic functions.Variadic functions are functions that take an indefinite number of arguments.

For example, let’s say we have a function calledsum()which calculates the sum of an indefinite amount of numbers. How might thesum()function be called during execution?

sum(1, 2);
sum(10, 36, 7, 84, 90, 110);
sum(-23, 3000, 575000);

There’s literally an endless number of ways thesum()function could be called. Regardless of the amount of numbers passed to the function, it should always return the total sum of the numbers.

Using the arguments object

In previous versions of JavaScript, this type of function would be handled using thearguments object. Thearguments objectis an array-like object that is available as a local variable inside all functions. It contains a value for each argument being passed to the function starting at 0 for the first argument, 1 for the second argument, and so on.

If we look at the implementation of oursum()function, then you’ll see how the arguments object could be used to handle the variable amount of numbers being passed to it.

function sum() {
  let total = 0;  
  for(const argument of arguments) {
    total += argument;
  }
  return total;
}

Now this works fine, but it does have its issues:

1. If you look at the definition for the sum() function, it doesn’t have any parameters.
   • This is misleading because we know the sum() function can handle an indefinite amount of arguments.
2. It can be hard to understand.
   • If you’ve never used the arguments object before, then you would most likely look at this code and wonder where the arguments object is even coming from. Did it appear out of thin air? It certainly looks that way.

Using the rest parameter

Fortunately, with the addition of the rest parameter, you can rewrite thesum()function to read more clearly.

function sum(...nums) {
  let total = 0;  
  for(const num of nums) {
    total += num;
  }
  return total;
}

This version of thesum()function is bothmore conciseand iseasier to read. Also, notice thefor...inloop has been replaced with the newfor...of loop.

Directions:

Use the rest parameter to create anaverage()function that calculates the average of an _unlimited _amount of numbers.

TIP:Make sure to test your code with different values. For example,

average(2, 6)should return4
average(2, 3, 3, 5, 7, 10)should return5
average(7, 1432, 12, 13, 100)should return312.8
average()should return0

/*
 * Programming Quiz: Using the Rest Parameter (1-5)
 */

// your code goes here

function average() {

}

console.log(average(2, 6));
console.log(average(2, 3, 3, 5, 7, 10));
console.log(average(7, 1432, 12, 13, 100));
console.log(average());