Post cover

unknown vs any in TypeScript

Posted September 8, 2021

A variable of type any can be assigned with anything:

ts
let myVar: any = 0;
myVar = '1';
myVar = false;

Many TypeScript guides discourage the use of any because using it throws away the type restrictions — the first reason why you use TypeScript!

TypeScript (version 3.0 and above) also provides a special type unknown that is similar to any. You can assign any value to an unknown type variable as well:

ts
let myVar: unknown = 0;
myVar = '1';
myVar = false;

Now... the big question is: what is the difference between using any and unknown?

Let's find out in this post.

1. unknown vs any

To better understand the difference between unknown and any, let's start with writing a function that wants to invoke its only argument.

Let's make the only parameter of invokeAnything() as any type:

ts
function invokeAnything(callback: any) {
callback();
}
 
invokeAnything(1);

Because callback param is of any type, the statement callback() won't trigger type errors. You can do anything with a variable of type any.

But running the script throws a runtime error: TypeError: callback is not a function. 1 is a number and cannot be invoked as a function — and TypeScript hasn't protected you from this error!

How to allow invokeAnything() function to accept any kind of argument, but force a type check on that argument, for example, if invoking it as a function?

Welcome unknown!

An unknown type variable, same as any, accepts any value. But when trying to use the unknown variable, TypeScript enforces a type check. Exactly what you need!

Let's change the type of callback param from any to unknown, and see what happens:

ts
function invokeAnything(callback: unknown) {
callback();
Object is of type 'unknown'.2571Object is of type 'unknown'.
}
 
invokeAnything(1);

Because the callback argument is of type unknown, the statement callback() has a type error Object is of type 'unknown'. Now, contrary to any, TypeScript protects you from invoking something that might not be a function!

You need to perform type checking before using a variable of type unknown. In the example, you would simply need to check if callback is a function type:

ts
function invokeAnything(callback: unknown) {
if (typeof callback === 'function') {
callback();
(parameter) callback: Function
}
}
 
invokeAnything(1);

Having added typeof callback === 'function' check, you can safely invoke callback() because unknown has narrowed to Function type. No type errors and no runtime errors! Great!

2. The mental model of unknown vs any

To be honest, I had difficulties understanding unknown when I had been learning it. How does it differ from any, since both types accept any value?

Here's the rule that had helped me understand the difference:

  • You can assign anything to unknown type but you have to do a type check or type assertion to operate on unknown
  • You can assign anything to any type and you can perform any operation on any

The example above has demonstrated exactly the similarity and difference between unknown and any.

The case of unknown:

ts
function invokeAnything(callback: unknown) {
if (typeof callback === 'function') {
callback();
}
}
 
invokeAnything(1);

Requires a type check

The type check here is typeof callback === 'function' — checking whether the callback is a function. The type of callback narrows to function type.

The case of any:

ts
function invokeAnything(callback: any) {
callback();
}
 
invokeAnything(1);

Any operation is allowed

callback being any, TypeScript doesn't enforce any type checking for the statement callback().

3. Conclusion

unknown and any are 2 special types that can hold any value.

unknown is recommended over any because it provides safer typing — you have to use type assertion or narrow to a specific type if you want to perform operations on unknown.

Challenge: can you write a utility type IsUnknown<T> which evaluates to true if T is unknown and false otherwise?

Like the post? Please share!

Quality posts into your inbox

I regularly publish posts containing:

  • Important JavaScript concepts explained in simple words
  • Overview of new JavaScript features
  • How to use TypeScript and typing
  • Software design and good coding practices

Subscribe to my newsletter to get them right into your inbox.

Join 4716 other subscribers.
Dmitri Pavlutin

About Dmitri Pavlutin

Tech writer and coach. My daily routine consists of (but not limited to) drinking coffee, coding, writing, coaching, overcoming boredom 😉.
Email addressTwitter profileFacebook pageLinkedIn profile