Typescript Rest and Spread Operator

Ole Ersoy
2 min readMay 14, 2022


Image by Bellezza87 from Pixabay


We wish to have a function where we can pass in any number of arguments and add them together. So for example:




Also we want another function where we can subtract the first argument from the sum of the rest. Like this:

addThenSubtract(1,2,3) // Result would be 4addThenSubtract(1,2,3,4) // Result would be 8

The SPREAD operator is also expressed as ... . We will see this used when we implement addThenSubtract .



We implement sum like this.

function sum(...arr: number[]): number {
let sum = 0;
arr.forEach((v) => {
sum += v;
return sum;

The REST operator collects all the arguments into an an array arr for us, and we then calculate the sum.


Here we can subtract the first argument from the sum of the rest.

* @param subtract Subract this number from the numbers added
* @param add Add tese numbers together
function addThenSubtract(subtract: number, ...add: number[]) {
console.log(`subtract ${subtract}`);
console.log(`add ${add}`);
const total = sum(...add);
return total - subtract;

Note that when we call add we use an operator that looks like the REST operator ... . In this context it’s a SPREAD operator. It takes the values in the array and spreads them out. So if we pass in [1,2,3] it will become 1,2,3 .




Ole Ersoy

Founder of Firefly Semantics Corporation