Learn
Arrays
Spread Syntax

Like the finest wines and cheeses, TypeScript’s tuples pair beautifully with JavaScript’s spread syntax. This is most useful for function calls that use lots of arguments, like this:

function gpsNavigate(startLatitudeDegrees:number, startLatitudeMinutes:number, startNorthOrSouth:string, startLongitudeDegrees: number, startLongitudeMinutes: number, startEastOrWest:string, endLatitudeDegrees:number, endLatitudeMinutes:number , endNorthOrSouth:string, endLongitudeDegrees: number, endLongitudeMinutes: number, endEastOrWest:string) { /* navigation subroutine here */ }

The function call gpsNavigate(40, 43.2, 'N', 73, 59.8, 'W', 25, 0, 'N', 71, 0, 'W') calculates a route from the Codecademy offices in New York City (40 degrees 43.2 minutes north, 73 degrees 59.8 minutes west) to selected coordinates in the Bermuda Triangle. We all agree that this function call is awkward to read.

Instead, we can use tuple variables that represent the starting and ending coordinates:

let codecademyCoordinates: [number, number, string, number, number, string] = [40, 43.2, 'N', 73, 59.8, 'W']; let bermudaTCoordinates: [number, number, string, number, number, string] = [25, 0 , 'N' , 71, 0, 'W'];

These tuple type annotations guarantee that the types of the elements will be valid function parameters for gpsNavigate().

Now, we use JavaScript’s spread syntax to write a very readable function call:

gpsNavigate(...codecademyCoordinates, ...bermudaTCoordinates); // And by the way, this makes the return trip really convenient to compute too: gpsNavigate(...bermudaTCoordinates, ...codecademyCoordinates); // If there is a return trip . . .


Now, you practice:

Instructions

1.

An array of tuples could be a convenient way to store the arguments for many recurring function calls. In the code editor, we have defined the array danceMoves, every element of which is a tuple that contains arguments for the performDanceMove() function.

Please provide a type annotation for the danceMoves array that will ensure compatibility with the performDanceMove() function.

2.

Perform the whole dance from start to finish by looping over the danceMoves array in whatever way you like, but make sure to use JavaScript’s spread syntax within performDanceMove().

It’s time to see the results of the dance! Run tsc to transpile the code to JavaScript and then run it with node index.js.

Folder Icon

Take this course for free

Already have an account?