TypeScript Data Types Tutorial

In this TypeScript tutorial we learn about the different types of data that can be stored in data containers.

We learn the basic types in TypeScript like numbers, booleans, strings, void, null, undefined and any.

Here's a table of contents of what you'll learn in this lesson:
(click on a link to skip to its section)

Let's jump right in.

What are data types

Data types are the different types of values that can be stored by TypeScript.

The type of a value is checked before the data is stored or manipulated, ensuring that the code will behave as we would exprect it to.

Note that although explicit data type declaration is optional in TypeScript, we recommend it in most cases.

TypeScript provides us with the following data types.

  • Generics
  • Decorators
  • Static types
    • Built-in types
      • Number
      • String
      • Boolean
      • Void
      • Null
      • Undefined
      • Never
      • Any
    • User defined
      • Array
      • Tuple
      • Enumeration (enum)
      • Class
      • Interface

In this tutorial lesson we will briefly discuss some of the built-in static data types in TypeScript.

The number data type (int/float)

The number type represents both integers and fractions. That’s to say, whole numbers like 83 or -514 as well as floating point numbers like 3.14 or -781.1.

The number type uses the keyword number .

Example:
// integer number
var num1 : number = 83;

// floating point number
var num2 : number = 3.14;

console.log("int:", num1);
console.log("float:", num2);

The number type also supports hexadecimalOpens up in a new page , octalOpens up in a new page and binaryOpens up in a new page values.

The boolean data type

A boolean is a named constant that represents the logical values true and false.

Booleans are technically numbers themselves because the values true and false map to 1 and 0 respectively.

The boolean type uses the keyword boolean .

Example:
var auth : boolean = false;

// if auth = false / 0
if (!auth) {

  console.log("Sorry, you are not allowed in the member area");
} else {

  console.log("Welcome to the member area");
}

If you come from another programming language like C#, please remember that in TypeScript we write the full word and not just bool.

The string data type

A string is an array of Unicode characters combined to form words or sentences. Strings can be wrapped in single or double quotes.

The string type uses the keyword string .

Example:
// double quotes
var msg1 : string = "Hello there";

// single quotes
var msg2 : string = 'General Kenobi';

console.log("Kenobi:", msg1);
console.log("Grievous:", msg2);

If we wrap our strings in double quotes, we can use single quotes inside strings where we need them.

Example:
// no escaping needed
console.log("I don't like debugging");

// escape with slash
console.log('I don\'t like debugging');

Otherwise we would need to escape them with the slash symbol.

The void return type

The void type is used as a function return type and represents functions that do not return a value.

The void type uses the keyword void .

Example:
function logger():void {

  console.log("Hello, World!");
}

Our function doesn’t return anything, it just prints a message to the console. We give it the void type in the function header to explicitly state that the function doesn’t return a value.

The null data type

Null represents the intentional absense of value.

We typically assign null as value during the coding process when we write code that doesn’t exist yet, but will later.

The null type uses the keyword null .

Example:
// fill in later
var maxDamage = null;

As an example, let’s consider we’re developing a game but it hasn’t been decided yet what the actual number is for the maximum damage a player can do.

The programmer will set up the value right now as null and fill in the real value later when the number has been decided.

The undefined data type

When we declare empty variables, the undefined type is assigned to them until we assign a value to them.

The undefined type uses the keyword undefined .

Example:
// when we do this
var x : number;

// the compiler does this
var x : number = undefined;

The any data type

The any type is given when we don’t know what the value will be at runtime.

When we assign any as a type we essentially opt-out of type checking and let the value pass through compile-time checks.

It’s especially useful when working with collection types if we know part of the type, but not all of it. It also makes working with existing Javascript easier.

The any type uses the keyword any .

Example:
 var visitorDetails : any[];

Summary: Points to remember

  • Data types represent the types of data that can be stored.
  • The number type can store integers, hexadecimal, octal, binary and floating point numbers.
  • The boolean type is a named constant that contains two values, true and false.
    • The true and false values also map to 1 and 0 respectively.
  • Strings are made up of multiple unicode characters to form words or sentences.
    • A string is always wrapped in either double or single quotes.
    • When a string is wrapped in single quotes, special characters must be escaped with a slash operator.
  • When a function doesn’t return any values, its return type is set to void.
  • Null is the intentional absense of a value.
  • Undefined is the default value when a data container is declared but not assigned a value immediately (initialized).
  • The any type will allow values to pass through compile-time type checks.