Learn TypeScript

// Explicit type annotations
let name: string = "Alice";
let age: number = 25;
let isStudent: boolean = true;

// TypeScript infers the type from the value
let city = "Cape Town";   // inferred: string
let score = 95;           // inferred: number

// Union types — can be one OR the other
let id: string | number = "user_123";
id = 456;   // also valid!

// Function with typed parameters
function greet(name: string, age: number): string {
  return `Hello ${name}, you are ${age} years old.`;
}

console.log(greet("Alice", 25));

Hello Alice, you are 25 years old.

interface User {
  id: number;
  name: string;
  email: string;
  age?: number;        // optional
  readonly role: string; // cannot be changed
}

function displayUser(user: User): void {
  console.log(`[${user.role}] ${user.name}`);
  console.log(`Email: ${user.email}`);
  if (user.age) {
    console.log(`Age: ${user.age}`);
  }
}

const alice: User = {
  id: 1,
  name: "Alice",
  email: "alice@example.com",
  age: 25,
  role: "admin",
};

displayUser(alice);

[admin] Alice
Email: alice@example.com
Age: 25

// Generic function — works with any type
function firstItem<T>(arr: T[]): T | undefined {
  return arr[0];
}

const firstNum = firstItem([10, 20, 30]);
const firstStr = firstItem(["apple", "banana"]);

console.log(firstNum);  // 10
console.log(firstStr);  // "apple"

// Generic interface
interface ApiResponse<T> {
  data: T;
  success: boolean;
  message: string;
}

const response: ApiResponse<User> = {
  data: { id: 1, name: "Bob", email: "b@b.com", role: "user" },
  success: true,
  message: "User fetched",
};

console.log(response.data.name);

10
apple
Bob