TYPES in TypeScript

2021.06.29

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

Introduction

TypeScript is a superset of JavaScript language, but unlike JavaScript, TypeScript promotes us to write cleaner code, with a static type checking mechanism. Here, based TypeScript has an additional feature of adding types to our variables which allows them to store and process only the On the value or type being assigned, the compiler determines which is an error and which is not even before execution. In this way we are constraining our code not to produce faulty errors like type mismatch during the runtime.

This blog aims at talking about TYPES in TypeScript. Primitive types include string, number and boolean. This list also includes object, array, tuple, enum, any, union type, literal type and type alias. Now let's learn more about these types.

String:

As the name suggests this type corresponds to a string. It can be indicated in the following ways. Ie'hi', “hi”, `hi`.` hi`: this is a special type of syntax that allows us to write a template literals which can dynamically inject some data into them.

Variable name3, provided being told as string type is assigned to a boolean value, hence it is marked as an error.

Number:

This type indicates the usage for numbers which includes integer and float. Ex: 1, 2.5, -10.

The function shows number declaration and takes in two parameters which are specifically told to be type as number (type assignment), and typescript marks it as an error if anything apart number is sent.

Boolean:

This includes true and false.

Note: The core primitive types in TypeScript are all lowercase!

Object:

Object is simply an key-pair value enclosed in a Curly-bracket. e.g: {age: 20}.

Here the object person holds various types of attributes ie, string, number, array and nested object. Similarly any value of the object can be accessed and accessing wrong or un-existing types will end up as an error.

Array

The snippets show it all, array is a set of data that belong to the same data type. Here in the example hobby is a string array type, where you see it can be initiallyised statically, or one can assign or replace using the index It continues with looping modes available to retrieve the data.

Tuple:

Tuple allows users to store data in the array format which has fixed length and type. While assigning the Tuple, it detects the error if there is type mismatch or parameter count mismatch.

But there is a flaw in tuples when associated with push function as shown below. It doesn't adhere to fixed length or fixed type because push exceptionally considers the allowed 'types' specification as an 'OR' operator among the accepted types and accepts any value among those types. But apart the included 'types', let's say a boolean value is sent then push pops an error.

Enum

Enum provides a means to enumerate values. Generally Enum keywords are started off by an uppercase and enumeration starts from 0 or can also be assigned any number or unique value to any values. We can also create string type enum or even heterogeneous enum that includes integers or string.

In the second example north is set to 1, south is set to 4, east and west are assigned a continuous number of the previous value (south = 4) hence east and west would be 5,6 respectively. As in the other example we can also set for any explicit unique values.

Any

Any is the most flexible type and doesn't restrict to any type as specific but by using this you are over ruling the advantages of TypeScript over JavaScript where the typescript compiler can't check for any type. It is highly recommended to use only in the scenario where we just don't know about the type of the value and maybe cover it up with runtime checks.

Union type

This feature allows multiple types to be handled in the single prototype. Let's see it clearly in the following example. Here is a simple function that can add two numbers or concat two strings. different types (number or string) acting like a “or” operator when accepting the parameter. This way you promote a single prototype to do more than one task.  Rather using “any” (which would accept all type of values), give in the required alternative type separated with a “|” operator.

Literal type

To put it in simple terms literal types allows the user to set the expected value as a parameter, here in the below example 'key' has been set to string literals to accept either “add” or “sub”. Any other value or no-parameter will be detected as an error.

Type Alias

Type aliasing is a convenient way to encode anything from variable names, union type declaration, object, function declaration and so on. Below is a simple example that describes type aliasing for a union type (number | string) and literal type (“” add ”|“ Sub ”) and the same is being replaced in the required places.

Happy Learning!