Introduction

Typechecking

Typechecking is a simple method to avoid potential errors in an application. We’ve already talked about basic principles to avoid potential errors. One of the most important is the existence of pure components, meaning components that do not have side effects.The non-existence of side effects describes the situation in which the **same input parameters **(in the case of React, we are talking about props and state) should always render the same output.

We should foresee and be clear about which props are passed into a component and how they are being processed. To achieve this, we can employ typechecking to make the process easier. JavaScript is slightly unusual in the sense that a variable that used to be a string can easily be converted into a number or even an object without the JavaScript interpreter complaining.

Even if this sounds useful for development, it opens doors for errors and forces us to manually check for the correct types. When we want to access nested properties such as user.settings.notifications.newMessages, we have to check if the user is actually an object and not null, subsequently perform the same check for settings, and so on. Otherwise, we might run into type errors such as: