Book Image

The TypeScript Workshop

By : Ben Grynhaus, Jordan Hudgens, Rayon Hunte, Matt Morgan, Vekoslav Stefanovski
5 (1)
Book Image

The TypeScript Workshop

5 (1)
By: Ben Grynhaus, Jordan Hudgens, Rayon Hunte, Matt Morgan, Vekoslav Stefanovski

Overview of this book

By learning TypeScript, you can start writing cleaner, more readable code that’s easier to understand and less likely to contain bugs. What’s not to like? It’s certainly an appealing prospect, but learning a new language can be challenging, and it’s not always easy to know where to begin. This book is the perfect place to start. It provides the ideal platform for JavaScript programmers to practice writing eloquent, productive TypeScript code. Unlike many theory-heavy books, The TypeScript Workshop balances clear explanations with opportunities for hands-on practice. You’ll quickly be up and running building functional websites, without having to wade through pages and pages of history and dull, dry fluff. Guided exercises clearly demonstrate how key concepts are used in the real world, and each chapter is rounded off with an activity that challenges you to apply your new knowledge in the context of a realistic scenario. Whether you’re a hobbyist eager to get cracking on your next project, or a professional developer looking to unlock your next promotion, pick up a copy and make a start! Whatever your motivation, by the end of this book, you’ll have the confidence and understanding to make it happen with TypeScript.
Table of Contents (16 chapters)
Preface

Callbacks

Callbacks are functions that we pass into other functions, which, in turn, will be invoked when they are needed. For example, in the client, if you want to listen to clicks on a specific DOM element, you attach an event handler via addEventListener. The function you pass in is then called when clicks on that element occur:

const btnElement = document.querySelector<HTMLButtonElement>('.my-button');
function handleButtonClick(event: MouseEvent) {
  console.log('.my-button was clicked!');
}
btnElement.addEventListener('click', handleButtonClick);

In this example, handleButtonClick is a callback function given to addEventListener. It will be called whenever someone clicks the .my-button element.

Note

You can also inline the handleButtonClick function, but you won't be able to call removeEventListener later, which is required in certain cases, to avoid memory leaks.

On the server, callbacks are widely used...