Deep Dive into TypeScript: Arrays, Unions, Tuples, Enums, and Interfaces

Arrays in TypeScript:

Arrays are used to store multiple values of the same type in a sequential order.

Example 1:

const names: string[] = [];
names.push("Dylan"); // No error
// names.push(3); // Error: Argument of type 'number' is not assignable to parameter of type 'string'

Example 2:

const names: Array<string> = [];
names.push("Dylan"); // No error
// names.push(3); // Error: Argument of type 'number' is not assignable to parameter of type 'string'

Union Types:

In TypeScript, union types are untagged, allowing for a combination of two or more types of data.

Example 1:

let variable: string | number | boolean;
variable = 2;    // No error
variable = 'a';  // No error
variable = true;  // No error

Example 2:

let arr: (string | number)[] = [1, 2, "3"];

Example 3:

function getValue(val: number | string) {
    return val.toLowerCase();
    // Error: Property 'toLowerCase' does not exist on type 'number | string'.
}

Solution: Use generic templates or check typeof val inside the function.

Literal Types:

Literal types allow specific strings or numbers in type positions.

Example 1:

let changingString = "Hello World"; // Type: string
let constantString = "Hello World"; // Type: "Hello World"

Example 2:

function printText(s: string, alignment: "left" | "right" | "center") {
  // ...
}

printText("Hello, world", "left");
// Error: Argument of type '"bottom"' is not assignable to parameter of type '"left" | "right" | "center"'.

Tuples:

Tuples are specialized arrays with a fixed order, providing precise element types.

Example 1:

type StringNumberPair = [string, number];

Example 2:

function doSomething(pair: [string, number]) {
  const a = pair[0]; // Type: string
  const b = pair[1]; // Type: number
}

Destructuring Tuples:

function doSomething(stringHash: [string, number]) {
  const [inputString, hash] = stringHash;
  console.log(inputString); // Type: string
  console.log(hash);        // Type: number
}

Enums:

Enums define named constants, making it easier to document intent or restrict user choices.

Example 1:

enum SeatChoice {
  AISLE,
  MIDDLE,
  WINDOW
}

const seat1 = SeatChoice.AISLE;   // 0
const seat2 = SeatChoice.MIDDLE;  // 1
const seat3 = SeatChoice.WINDOW;  // 2

Example 2:

enum SeatChoice {
  AISLE = 6,
  MIDDLE,
  WINDOW
}

const seat1 = SeatChoice.AISLE;   // 6
const seat2 = SeatChoice.MIDDLE;  // 7
const seat3 = SeatChoice.WINDOW;  // 8

Interfaces:

Interfaces define the structure without implementing properties and methods.

Example 1:

interface User {
  email: string;
  userId: number;
  getUser: () => string;
}

const person: User = { email: 'abc@gmail.com', userId: 8, getUser: () => 'user' };

Reopening Interfaces:

interface User {
  name: string;
}

const person: User = { email: 'abc@gmail.com', name: 'abdul', userId: 8, getUser: () => 'user' };

Stay tuned for the next chapter: Interface vs Type in TypeScript: Unraveling the Differences. There's more to explore!