Branding, UI Design Programming / 05 February 2024 / by Md Shahidul Islam

TypeScript's Type System

Chapter 2: TypeScript’s Type System

In the previous chapter, you learned about the basics of TypeScript and how to get started. In this chapter, we’ll explore TypeScript’s powerful type system in more detail.

Basic Types

TypeScript supports the same set of basic data types as JavaScript, including:

  • Number: Represents both integers and floating-point numbers.
  • String: Represents textual data.
  • Boolean: Represents a logical value, either true or false.
  • Null: Represents the intentional absence of any object value.
  • Undefined: Represents a variable that has been declared but has not yet been assigned a value.

In addition to these basic types, TypeScript also introduces a few new types, such as:

  • Any: Represents a value of any data type.
  • Void: Represents the absence of a value, typically used for functions that don’t return anything.
  • Never: Represents a value that never occurs, typically used for functions that never return or always throw an error.

Type Annotations

In TypeScript, you can explicitly define the type of a variable, function parameter, or return value using type annotations. This is done by appending a colon (:) followed by the type name after the variable or parameter name. For example:

let age: number = 30;
function greet(name: string): void {
  console.log(`Hello, ${name}!`);
}

In the above example, age is declared as a number type, and the greet function takes a string parameter and has a void return type.

Interfaces

TypeScript’s interface feature allows you to define custom data types that describe the shape of an object. Interfaces are a powerful way to enforce type-checking and improve code maintainability. Here’s an example:

interface Person {
  name: string;
  age: number;
  occupation?: string;
}

function printPersonInfo(person: Person) {
  console.log(`Name: ${person.name}, Age: ${person.age}, Occupation: ${person.occupation || 'N/A'}`);
}

const john: Person = { name: 'John', age: 35, occupation: 'Software Engineer' };
printPersonInfo(john);

In this example, the Person interface defines the structure of a person object, with required name and age properties, and an optional occupation property.

Union and Intersection Types

TypeScript also supports more advanced type constructs, such as union and intersection types. Union types allow you to represent a value that can be one of several types, while intersection types allow you to combine multiple types into a single type.

// Union type
type Shape = Circle | Rectangle;

interface Circle {
  kind: 'circle';
  radius: number;
}

interface Rectangle {
  kind: 'rectangle';
  width: number;
  height: number;
}

// Intersection type
type PersonWithAddress = Person & {
  address: string;
};

In this chapter, you’ve learned about the core concepts of TypeScript’s type system, including basic types, type annotations, interfaces, and more advanced type constructs like unions and intersections. Understanding these fundamental type features will be crucial as you continue your TypeScript journey.

In the next chapter, we’ll explore how to work with functions and classes in TypeScript.

Tags:
Comments