Beginner's TypeScript Tutorial (18 exercises)
Problem

Typing Functions

Now we'll move on to typing functions.

We have an addListener function here:

const addListener = (onFocusChange: unknown) => {
  window.addEventListener("focus", () => {
    onFocusChange(true);
  });

  window.addEventListener("blur", () => {
    onFocusChange(false);
  });
};

The type of onFocusChange that is passed in is currently unknown.

What we want it to be is a function that will take in a single boolean argument.

Challenge

Your challenge is to visit the TypeScript Docs and work out how to appropriately type the onFocusChange function.

Code

logo-github

beginners-typescript-tutorial

/src/17-function-types.problem.ts

Transcript

Now, we come onto typing functions. We've got an addListener function here that we've created. What we're saying is we want to say onFocusChange. OnFocusChange is currently unknown. What we want it to be is a function which takes in a single argument, which is going to be a Boolean.

Now, what we really need to do is to be able to somehow work out how to type this to express our function for us. That's your challenge. It's to go into the TypeScript docs, work out how you type functions, and what this unknown should actually be typed as.