Type 'void' is not assignable to type in TypeScript

avatar

Borislav Hadzhiev

Last updated: Jul 25, 2022

banner

Photo from Unsplash

Type 'void' is not assignable to type in TypeScript #

The "Type 'void' is not assignable to type" TypeScript error occurs when we forget to return a value from a function, so the function gets an implicit return type of void. To solve the error, make sure you return a value of the correct type from your functions before the assignment.

Here is an example of how the error occurs.

index.ts
// 👇️ const sum: (a: number, b: number) => void const sum = (a: number, b: number) => { const result = a + b; // 👉️ function doesn't return anything }; // Error: ⛔️ Type 'void' is not // assignable to type 'number'.ts(2322) const num: number = sum(50, 50);

We forgot to return a value from the sum function, so it implicitly has a return type of void.

The void type represents the return value of a function which doesn't return a value.

When you don't return a value from a function, you implicitly return undefined and the function's return type is inferred to be void.

The error message "Type 'void' is not assignable to type 'number'" means that we have a value that expects an assignment of type number and we're trying to assign a value of type void to it.

To solve the error, make sure to return a value from your function.

index.ts
const sum = (a: number, b: number) => { const result = a + b; return result; // 👈️ explicitly return }; const num: number = sum(50, 50); console.log(num); // 👉️ 100

Now the sum function has a return type of number.

Note that the return type of the function has to be compatible with the type of the num variable.

A helpful way to debug this is to explicitly set the function's return type.

index.ts
// ⛔️ Error: A function whose declared type // is neither 'void' nor 'any' must return a value.ts(2355) const sum = (a: number, b: number): number => { const result = a + b; };

We explicitly set the function's return type to number but forgot to return a value, so TypeScript informs us that we must return a value from the function.

If you have an implicit return in an arrow function, make sure the function returns the expected value.

index.ts
// 👇️ implicit return with objects const getObj = () => ({ name: 'Tom', country: 'Chile', }); // 👇️ implicit return with primitives const getNum = (a: number, b: number) => a + b;

The same error also occurs when working with class methods.

index.ts
class DoMath { sum(a: number, b: number) { const result = a + b; } } const m = new DoMath(); // ⛔️ Error: Type 'void' is not // assignable to type 'number'.ts(2322) const num: number = m.sum(10, 15);

The solution is the same - make sure that the class method returns a value of the expected type.

You might also be using callback functions that expect that you return a value of a specific type. Hover over the function and make sure to return a value of the correct type.

Sometimes you have complex functions with many conditionals and different code paths. Note that all of the function's code paths have to return a value.

Conclusion #

The "Type 'void' is not assignable to type" TypeScript error occurs when we forget to return a value from a function, so the function gets an implicit return type of void. To solve the error, make sure you return a value of the correct type from your functions before the assignment.

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.