Functions Returning Functions Lab
Objectives
- Practice writing functions that return other functions
- Practice passing a function to another function
- Practice calling a function returned by another function
Introduction
Functions are a very important part of JavaScript, and you will use them pretty much all of the time. Without functions, we wouldn't get anything done! There is a lot more to functions than meets the eye, which we will discover together throughout this unit. In this lab, we'll take a look at how we can use first-class functions to pass around functions, or return them.
Exercise 1 — The final countdown
Dudududuuuuuu. Dudududu.
The band, Europe, has been struggling to keep in rhythm with each other. When the keyboard tunes stop, the vocals should kick in after two seconds — for dramatic effect, naturally! Unfortunately, the lead singer has been missing the mark lately. Let's help him out!
We'll start things off by creating a countdown()
function. This function takes one argument, callback
, which is a
function. Using window.setTimeout()
, we will wait two seconds before calling the callback
function that was
passed into the countdown()
function. This exercise demonstrates the use of callbacks for async operations. If we
didn't use a callback, our program would continue right away instead of waiting for the callback to be called.
Exercise 2 — Playing Scrabble
Let's say we're trying to recreate Scrabble in JavaScript. Some board tiles can give us double or triple letter score.
Let's create a helper function that takes a number (let's call it the multiplierValue
). This function then returns a
function that multiplies a given value by the multiplierValue
. In your code, do the following:
- Create a
createMultiplier()
function. Make sure it returns the right thing! - Create a
doubler
variable that uses thecreateMultiplier()
function to create a function that doubles any given number. - Create a
tripler
variable that does the same thing as thedoubler
, but it triples the value instead.
Exercise 3 — It's part(y)(ial) time
Instead of a function returning another function (like we did in the previous exercise), we can also write a function
that takes two values right away: the multiplierValue
and the value
. However, we can't create the doubler
and
tripler
functions by just calling this new function with two arguments! The trick is to partially apply the function.
We can do this using .bind()
.
Quick hint: you can forget about .bind()
's first argument (the this
context) for now — you can use null
as its value.
To pass all tests, do the following:
- Create a
multiplier()
function that takes two arguments and multiplies them together. - Create a
doublerWithBind
variable that partially applies themultiplier()
function by passing in2
as its first argument. - Create a
triplerWithBind
variable that partially applies themultiplier()
function by passing in3
as its first argument.
Resources
View First Class Functions Lab on Learn.co and start learning to code for free.