Why type annotations are needed in Typescript - See It in Action

Why type annotations are needed

📖 Scenario: Imagine you are building a simple calculator app that adds two numbers. You want to make sure the inputs are always numbers to avoid mistakes.

🎯 Goal: Learn how to use type annotations in TypeScript to make your code safer and easier to understand.

📋 What You'll Learn

Create variables with explicit type annotations

Use type annotations in function parameters and return type

See how TypeScript catches errors when types don't match

💡 Why This Matters

🌍 Real World

Type annotations are used in real apps to avoid bugs caused by wrong data types, like adding numbers and strings by mistake.

💼 Career

Many programming jobs require writing clear and safe code using TypeScript's type system to improve code quality and teamwork.

1

Create variables with type annotations

Create two variables called num1 and num2 with type number. Assign 5 to num1 and 10 to num2.

Typescript

// Create variables num1 and num2 with type number and assign values
// Your code here

Need a hint?

Use let variableName: type = value; to declare variables with types.

2

Add a function with type annotations

Create a function called add that takes two parameters a and b both of type number. The function should return a number which is the sum of a and b.

Typescript

let num1: number = 5;
let num2: number = 10;

// Create function add with parameters a and b of type number and return type number
// Your code here

Need a hint?

Write the function with parameter types and return type like function add(a: number, b: number): number.

3

Use the function with the variables

Create a variable called result with type number and assign it the value returned by calling add with num1 and num2.

Typescript

let num1: number = 5;
let num2: number = 10;

function add(a: number, b: number): number {
    return a + b;
}

// Create variable result with type number and assign add(num1, num2)
// Your code here

Need a hint?

Call the function and store the result in a typed variable.

4

Print the result

Use console.log to print the value of result.

Typescript

let num1: number = 5;
let num2: number = 10;

function add(a: number, b: number): number {
    return a + b;
}

let result: number = add(num1, num2);

// Print the result
// Your code here

Need a hint?

Use console.log(result); to show the sum in the console.