This page looks best with JavaScript enabled

The Different Types of Typescript

 ·   ·  ☕ 4 min read

With ‘type’ in its name, Typescript lives up to its reputation of being a typed language. But, what exactly are the supported types?

At a high-level we can classify types as built-in (basic & special ) and additional types including user-defined types.

Built-in Types (Basic)

Similar to Javascript implicit types, we have number, string, boolean to form the three core built-in types.

1
2
3
4
5
let num: number = 1;

let planet: string = "earth";

let isHappy: boolean = true;

We also have null, and undefined as additional basic built-in types.

1
2
3
let nothing: null = null;

let undef: undefined = undefined;

You could technically do this..

1
2
3
4
const fruit: any = null;
const flower: any = undefined;

// we'll deal with any in a bit

.. and also this (when a flag called --strictNullChecks is not specified during compilation) -

1
2
const fruit: string = null;
const num: number = undefined;

Oh, and symbol is also a valid type.

1
let sup: symbol;

Built-in Types (Special)

There are four types that have special function within Typescript.

any

any represents any type. It gives super powers to Typescript and makes it play well with Javascript. any tells Typescript to do a type inference on a variable.

For e.g. ,

1
2
3
4
5
6
const fruit: any = "apple";
// or simply, const fruit = "apple"
console.log(typeof fruit); // string

const num: any = 123;
console.log(typeof num); // number

any can be your best friend. You can convert your entire Javascript to Typescript by simply changing extension and continue using it as before. You could then incrementally add Typescript powers to the script.

Since any variable without a type is assumed as type any, Typescript can also interact Javascript without a hitch.

unknown

unknown was introduced in Typescript v3. It is type safe any - a variable with type unknown can be assigned value of any type.

1
2
3
const x: unknown = 1;
console.log(typeof x);
// number

But, unknown cannot be assigned to any other type other than unknown.

1
2
3
const x: unknown = 1;
let y: number = x;
// Error: Type 'unknown' is not assignable to type 'number'.

.. and, no operations are allowed for unknown data type against a known type.

1
2
console.log(x + 1);
// Error: Operator '+' cannot be applied to types 'unknown' and '1'.
void

As you expect, void has its duty cut out with functions - it primarily means no type.

1
2
3
4
5
function printThis(msg): void {
  console.log(msg);
}

printThis("hello");

void can also be used against mere variables, but you would have to answer to yourself whether you are addressing a galaxy-level problem doing that. These variables are not assignable to valid values thereon.

1
2
3
4
5
const a: void = null;
// the above will throw compile error when --strictNullChecks flag is used

const b: void = undefined;
// ok, but to what effect?
never

never signifies values that never occur. That can be confusing if you’re not into quantum mechanics, but let me explain.

Consider a function that always throws error - it does not need to return anything.

1
2
3
function thrower:never(){
    throw "I throw stuff"
}

So, how can it distinguish itself from void?

void is for functions where you can reach the end of function. While never is for functions where end of function is never reached.

1
2
3
function whatAManWants:never() {
    return gobble(resources)
}

Additional Types

‘Additional type’ is just a bucket to include all the other types other than the primitive types defined above. Typescript supports other types including user-defined types like those described below.

Collections

Collections can include arrays and tuples. Each of those collections can have elements with a specific type or a mix of types using any.

1
2
3
4
5
6
7
8
const fruits: Array<string> = ["apple", "orange", "pear"];
const primes: Array<number> = [1, 2, 3, 5];

// any

const universe: Array<any> = ["life", 42];
console.log(universe);
// [ 'life', 42 ]

A tuple with fixed number of elements has those elements with specific types.

1
2
3
4
let everything: [string, number];
everything = ["life", 42];
console.log(everything);
// [ 'life', 42 ]
Special data type: enum

enum is not like anything that you have seen so far.

  1. you define enum
  2. a variable of the defined enum type can be assigned to a value within the enum

Consider the below example -

1
2
3
4
5
6
7
8
9
enum Planets {
  mercury = 1,
  venus = 2,
  earth = 3
}

const earthPos: Planets = Planets.earth;
console.log("earthPos: ", earthPos);
// 3
Object

As in Javascript, anything that is not primitive is an object.

The following code is valid..

1
2
3
const apple: Object = { name: "apple", color: "red" };
console.log(apple);
// { name: 'apple', color: 'red' }

But, depending on your situation, may not be useful for type assertion against the object’s props (like a Array for example).

Stay in touch!
Share on

Prashanth Krishnamurthy
WRITTEN BY
Prashanth Krishnamurthy
Technologist | Creator of Things