Comprehensive Introduction to TypeScript: Types, Enums, Interfaces, and Functions

TypeScript is a superset of JavaScript that adds static typing and other language features, and it compiles to plain JavaScript for execution in browsers or Node.js environments.

Its three major advantages are full ES6 support, powerful IDE assistance, and being the primary language for Angular development.

Built‑in data types include boolean, number, string, Array, Tuple, Function, Object, void, Symbol, undefined, null, any, and never, each with specific usage rules.

Enum types are categorized as numeric enums (auto‑incremented values with bidirectional mapping), string enums (no reverse mapping), heterogeneous enums (mixing numbers and strings, generally discouraged), const enums (removed at compile time), and computed enums (evaluated at runtime).

Interfaces describe object shapes, function signatures, index signatures, and readonly properties. Examples include:

interface List {
  id: number;
  name: string;
}

interface Result {
  data: List[];
}

function getResult(result: Result) {
  result.data.forEach(item => {
    console.log(item.id, item.name);
  });
}

let myResult = {
  data: [
    { id: 1, name: 'Bob', score: 98 },
    { id: 2, name: 'Carl', score: 87 }
  ]
};

getResult(myResult);

Interfaces can also extend other interfaces, combine multiple inheritance, and be used to model class contracts, as shown by ClockInterface and its implementing class.

interface ClockInterface {
  currentTime: Date;
}

class Clock implements ClockInterface {
  currentTime: Date;
  constructor(h: number, m: number) {}
}

Function definitions can be named, anonymous, typed via type aliases, or declared through interfaces. Parameter handling includes required, optional (using ? ), default values, rest parameters, and overload signatures.

// Named function
function add1(x: number, y: number): number {
  return x + y;
}

// Optional parameter
function add(x: number, y?: number) {
  return y ? x + y : x;
}

// Default parameter
function addDefault(a: number, b = 1, c: number, d = 2) {
  return a + b + c + d;
}

// Rest parameters
function addRest(x: number, ...restParams: number[]) {
  return x + restParams.reduce((pre, cur) => pre + cur);
}

// Overloads
function overload(...restParams: number[]): number;
function overload(...restParams: string[]): string;
function overload(...restParams: any[]) {
  const first = restParams[0];
  if (typeof first === 'number') {
    return restParams.reduce((p, c) => p + c);
  }
  if (typeof first === 'string') {
    return restParams.join('');
  }
}

The article concludes that TypeScript’s compile‑time checks dramatically reduce runtime bugs, promote maintainable code, and facilitate team collaboration, especially in large front‑end projects.