Practice Questions

With explicit annotations:

const name: string = "Ali";
const age: number = 30;
const active: boolean = true;
const scores: number[] = [90, 85, 100];

Without annotations:

const name = "Ali";
const age = 30;
const active = true;
const scores = [90, 85, 100];

TypeScript infers the types from the assigned values. When you initialize a variable with a value, TypeScript automatically determines the type, so explicit annotations are unnecessary in these cases.

function formatId(id: string | number): string {
  if (typeof id === "string") {
    return id.toUpperCase();
  }
  return `#${id}`;
}

formatId("abc");  // "ABC"
formatId(42);  // "#42"

The typeof check is a type guard that narrows the union type. Inside the if block, TypeScript knows id is a string; in the else branch, it knows id is a number.

Use interface when defining the shape of objects and classes (especially if you want declaration merging or implements). Use type when you need unions, intersections, tuples, or when aliasing primitives. When describing a plain object shape where either would work, both are fine.

interface Product {
  name: string;
  price: number;
  description?: string;
}

// (a) All properties optional
type PartialProduct = Partial<Product>;
// { name?: string; price?: number; description?: string }

// (b) Only name and price
type ProductSummary = Pick<Product, "name" | "price">;
// { name: string; price: number }

Partial<T> makes every property optional. Pick<T, K> selects specific properties. You could also use Omit<Product, "description"> for (b).

function firstElement<T>(arr: T[]): T | undefined {
  return arr[0];
}

// Explicit type parameter
const a = firstElement<string>(["hello", "world"]);  // "hello"

// Inferred type parameter
const b = firstElement([1, 2, 3]);  // 1 — TypeScript infers T as number
const c = firstElement([]);  // undefined

The generic <T> acts as a placeholder. When you call the function, TypeScript either uses the type you explicitly provide or infers it from the argument.

class Employee {
  public name: string;
  protected department: string;
  private salary: number;

  constructor(name: string, department: string, salary: number) {
    this.name = name;
    this.department = department;
    this.salary = salary;
  }

  getSalary(): number {
    return this.salary;
  }
}

const emp = new Employee("Ali", "Engineering", 90000);
console.log(emp.name);  // OK — public
// emp.department;            // Error — protected
// emp.salary;                // Error — private
console.log(emp.getSalary());  // OK — public method accessing private field

Interfaces (and type aliases) are erased during compilation — they produce no JavaScript output. At runtime, there is no User object to check against, so value instanceof User causes a compile error.

interface User {
  name: string;
  age: number;
}

// This does NOT work:
// value instanceof User
// Error: 'User' only refers to a type, but is being used as a value here

Instead, write runtime checks using typeof, in, or custom type predicate functions:

function isUser(value: unknown): value is User {
  if (typeof value !== "object" || value === null) {
    return false;
  }
  const candidate = value as { name?: unknown; age?: unknown };
  return (
    typeof candidate.name === "string" && typeof candidate.age === "number"
  );
}

The value is User return type is a type predicate that tells TypeScript the value can be safely treated as User when the function returns true.

The any type disables all type checking. If data is not an object with a name property, or if name is not a string, this will crash at runtime with no warning from the compiler.

Rewritten with unknown:

function processData(data: unknown): string {
  if (
    typeof data === "object" &&
    data !== null &&
    "name" in data &&
    typeof (data as { name: unknown }).name === "string"
  ) {
    return (data as { name: string }).name.toUpperCase();
  }
  throw new Error("Invalid data: expected an object with a string 'name'");
}

Using unknown forces you to check the shape of the data before you access any property. The compiler will not let the unchecked access through, so the function reports a bad input instead of failing at runtime.

The as const assertion tells TypeScript to infer the narrowest (most literal) type possible and makes all properties readonly.

// Without as const
const config = { api: "https://api.example.com", retries: 3 };
// Type: { api: string; retries: number }

// With as const
const configNarrow = { api: "https://api.example.com", retries: 3 } as const;
// Type: { readonly api: "https://api.example.com"; readonly retries: 3 }

// Without as const
const point = [10, 20];
// Type: number[]

// With as const
const pointNarrow = [10, 20] as const;
// Type: readonly [10, 20]

Without as const, TypeScript widens the types (string, number, number[]). With as const, it preserves the exact literal values and treats arrays as readonly tuples. This is useful when you need TypeScript to know the exact values, such as when passing literal strings to functions that expect specific string unions.

• target: The JavaScript version to compile to. ES2020 means the output will use ES2020 features.
• module: The module system for the output code (e.g., ES2020 modules with import/export, or CommonJS with require).
• strict: Enables all strict type-checking options, including strictNullChecks (prevents using null/undefined where a value is expected) and other safety checks. Always recommended for new projects.
• outDir: The directory where compiled .js files are placed (./dist in this case).
• esModuleInterop: Allows default imports from CommonJS modules (e.g., import express from "express" instead of import * as express).
• include: Specifies which files to compile — here, all .ts files under the src directory.