Type annotation on variables in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this TypeScript code with variable type annotations?

Consider the following TypeScript code snippet. What will be logged to the console?

Typescript

let count: number = 5;
let message: string = "Hello";
count = count + 10;
console.log(message + " " + count);

A "Hello 15"

B "Hello 5"

C TypeError at runtime

D Compilation error due to type mismatch

💡 Hint

Look at how the variables are typed and how their values change before logging.

The variable 'count' is typed as number and initialized to 5. It is then incremented by 10, making it 15. The variable 'message' is a string 'Hello'. Concatenating them with a space results in 'Hello 15'.

❓ Predict Output

intermediate

What error occurs when assigning wrong type to a typed variable?

What happens when you run this TypeScript code?

Typescript

let isActive: boolean = true;
isActive = "yes";

A No error, isActive becomes 'yes'

B Runtime error: Cannot assign string to boolean.

C Output: true

D Compilation error: Type 'string' is not assignable to type 'boolean'.

💡 Hint

Check the type of the variable and the assigned value.

TypeScript enforces types at compile time. Assigning a string to a boolean variable causes a compilation error.

🔧 Debug

advanced

Why does this TypeScript code cause a compilation error?

Identify the cause of the error in this code snippet.

Typescript

let data: number;
data = 10;
data = "twenty";

A Error because 'data' is not initialized at declaration.

B Error because 'data' is declared as number but assigned a string.

C No error, TypeScript allows changing types.

D Error because 'data' is declared with let instead of const.

💡 Hint

Look at the type annotation and the assigned values.

The variable 'data' is typed as number. Assigning a string 'twenty' violates the type annotation, causing a compilation error.

🧠 Conceptual

advanced

What is the purpose of type annotation on variables in TypeScript?

Choose the best explanation for why we use type annotations on variables.

A To allow variables to change types dynamically during runtime.

B To make the code run faster by specifying types explicitly.

C To tell the compiler what type a variable should hold, enabling type checking and preventing errors.

D To automatically convert variables to strings when needed.

💡 Hint

Think about how TypeScript helps catch mistakes before running the code.

Type annotations help the compiler check that variables are used correctly, catching errors early and improving code quality.

❓ Predict Output

expert

What is the output of this TypeScript code with union type annotation?

Analyze the following code and select the correct console output.

Typescript

let value: number | string;
value = 42;
console.log(typeof value);
value = "forty-two";
console.log(typeof value);

A "number" followed by "string"

B Compilation error due to union type usage

C "string" followed by "number"

D "number" twice

💡 Hint

Check the type of 'value' after each assignment.

The variable 'value' can hold either a number or a string. First it holds 42 (number), then 'forty-two' (string). The typeof operator reflects these types.