TypeScript Overview

TypeScript has gained popularity for it’s ability to add type system to Javascript. Typescript code will be transpiled to Javascript code which can be run in any browser.

Few things I like about TypeScript are

• Static Typing: TypeScript provides static typing which helps in catching errors at compile time.
• Strong Tooling: TypeScript has strong tooling support with features like code completion, refactoring, etc.
• Community: TypeScript has a large and active community that provides support, libraries, and tools.

Few things I dislike about TypeScript are

• Learning Curve: TypeScript has a learning curve, especially for developers who are new to static typing.
• Compilation: TypeScript code needs to be compiled to JavaScript before it can be run in the browser.
• Integration: TypeScript may require additional configuration and setup to integrate with existing JavaScript projects.

Variables

In TypeScript, variables are declared using the let keyword. TypeScript also supports constants using the const keyword.

Syntax and Example:

let a: number = 10; // Explicit type declaration
let b: number = 20,
  c: number = 30; // Multiple variables

const Pi: number = 3.14; // Constants
const World: string = "Hello, World";

let x = 42; // type inferred as number
let y = "Hello, TypeScript"; // type inferred as string

Control Statements

Control statements in TypeScript include if, else, switch, and looping constructs like for.

Syntax and Example:

// If statement
if (x > 0) {
  console.log("x is positive");
} else {
  console.log("x is negative");
}

// For loop
for (let i = 0; i < 10; i++) {
  console.log(i);
}

// Switch statement
switch (x) {
  case 1:
    console.log("x is 1");
    break;
  case 2:
    console.log("x is 2");
    break;
  default:
    console.log("x is neither 1 nor 2");
}

Functions

Functions in TypeScript are similar to JavaScript functions but with optional static typing for parameters and return types.

Syntax and Example:

// Function declaration
function add(x: number, y: number): number {
  return x + y;
}

// Function call
console.log(add(42, 13));

// Anonymous Functions
const add = function (x: number, y: number): number {
  return x + y;
};

console.log(add(1, 1));

Data Structures

In Typescript we can use type or interface to define custom data structures.

Syntax and Example:

// Type
type Person = {
  name: string;
  age: number;
};

const person: Person = {
  name: "Alice",
  age: 30,
};

// Interface
interface Animal {
  name: string;
  type: string;
}

const dog: Animal = {
  name: "Buddy",
  type: "Dog",
};

Collection Manipulation

TypeScript provides built-in support for arrays and objects. We can use array methods like map, filter, reduce, etc., to manipulate collections.

Syntax and Example:

// Array
const numbers: number[] = [1, 2, 3, 4, 5];

// Iterating over array
for (let num of numbers) {
  console.log(num);
}

numbers.forEach((num) => console.log(num));

// Object
const person = {
  name: "Alice",
  age: 30,
};

// Iterating over object
for (let key in person) {
  console.log(key, person[key]);
}

// Array methods
const doubledNumbers = numbers.map((num) => num * 2);

const evenNumbers = numbers.filter((num) => num % 2 === 0);

const sum = numbers.reduce((acc, num) => acc + num, 0);

// Object methods
const keys = Object.keys(person);

const values = Object.values(person);

Error Handling

TypeScript provides support for error handling using try, catch, and finally blocks.

Syntax and Example:

try {
  // Code that may throw an error
  throw new Error("Something went wrong");
} catch (error) {
  // Handle the error
  console.error(error.message);
} finally {
  // Cleanup code
}

EcoSystem

TypeScript or Javascript needs a Javascript runtime to run. There are different runtimes available such as,

• Bun
• Deno
• Nodejs

Install one of them

brew install bun

Hello World

Create a file hello.ts with the following content

console.log("Hello, TypeScript!");

Run the file using the following command

bun hello.ts

Package Management

There is also different choices for package management such as,

• bun
• npm (nodejs)
• yarn (nodejs)
• pnpm (nodejs)