Data Types In Typescript

 

Basic Types

In this article, you’ll discover Typescript types. Most of these you should already be familiar with. But we’ll be covering a few of the basics:

  • Boolean
  • Number
  • String
  • Array
  • Tuple

Boolean

Booleans represents either a true or false value.


let complete: boolean = false;
complete = true; // no error
complete = 1; // error, cannot convert type boolean to number

Number

JavaScript’s use of numbers is floating point values. Using the number type in Typescript, we can use decimals, hexadecimals, binary values and octal values.


let someDecimal: number = 123;
let hexadecimal: number = 0xff22aa;
let binary: number = 0b1010;
let octal: number = 0o744;

String

Using single or double quotes, you can create a string to store textual data.


let string1: string = ‘the blue fox’;
let string2: string = ‘dashes into the hedge’;

You can use one inside the other without ending the string assignment.


let bothStrings: string = “Do you ‘really’ want to proceed?”;

Using multiple lines, and embed expressions is easily done using a backpack or backquote. You can use the embedded expression with ${ expression }


let name: string = “John”;
let age: number = 31;
let fullString: string = `Welcome, ${ name }. 
You will be ${ age +1 } next month.`;

Bonus – You can use this approach to dynamically build sentences. Like greeting a user if it’s morning, afternoon or evening.


private sayHello(name: string, time?: Date = new Date()): string {
    let curHour: number = time.getHours();

    // work out if we should say morning, afternoon or evening
    let greet: string;
    if(curHour < 12) {
        greet = "Good morning”;
    } else if (curHour < 18) {
        greet = "Good afternoon”;
    } else {
        greet = "Good evening”;
    }

    let message: string = `${ greet }, ${ name }`;
    return message;
}

sayHello(‘John', new Date()); // will use the date passed to the function
sayHello(‘John’); // if no date is passed, will use the date created in the function header

It’s worth noting, that the standard practice seems to be to use double quotes strings, as adhered to by tslint.

Arrays

 

There are two ways declare typeof array in Typescript. Either appending the element type with [], or generic array type Array.


let array1: number[] = [0, 1, 2];
let array2: Array = [“Bob”, “John”, “Smith”];

If you are using tslint, or curious about best practices, You should generally use the former ([]) for anything that has a predefined type. Interfaces {https://sprite-storm.com/tutorial/typescript/typescript-interfaces-part-2/}, and any of the types on this page. Leaving the generic array types for ‘complex’ types.


let array1: number[] = [0, 1, 2]; // simple
let array2: Array<{x: number, y: number> = [{x: 0, y: 1}, {x: 12, y: 24}]; // complex

Tuple

Using a tuple, you can type a specific data set.


let person: [string, number];
person [“John”, 31];

Stay tuned for some more of the data-types such as enum, never and function.

Twitter

Error code 89: Invalid or expired token.

Stay Updated