String type behavior in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this string concatenation?

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

Typescript

const a: string = 'Hello';
const b: string = 'World';
console.log(a + ' ' + b);

A "Hello World"

B "HelloWorld"

C "Hello+World"

D "Hello World!"

💡 Hint

Think about how the + operator works with strings.

The + operator concatenates strings. Adding a space between the two strings results in "Hello World".

❓ Predict Output

intermediate

What is the output of this template literal?

What will this TypeScript code print to the console?

Typescript

const name: string = 'Alice';
const age: number = 30;
console.log(`Name: ${name}, Age: ${age}`);

A "Name: Alice, Age: 30"

B "Name: ${name}, Age: ${age}"

C "Name: Alice, Age: "

D "Name: Alice Age: 30"

💡 Hint

Look at how template literals insert variables.

Template literals replace ${variable} with the variable's value inside the string.

❓ Predict Output

advanced

What is the output of this string indexing?

What will this TypeScript code print to the console?

Typescript

const str: string = 'TypeScript';
console.log(str[4]);

A "r"

B "S"

C undefined

D "c"

💡 Hint

Remember that string indexing starts at 0.

Index 4 in 'TypeScript' is the fifth character, which is 'c'.

❓ Predict Output

advanced

What error does this code raise?

What happens when you try to assign a number to a string variable in TypeScript?

Typescript

let greeting: string = 'Hi';
greeting = 123;

A No error, greeting becomes '123'.

B Type 'number' is not assignable to type 'string'.

C Runtime error: Cannot assign number to string.

D SyntaxError: Invalid assignment.

💡 Hint

TypeScript checks types at compile time.

TypeScript does not allow assigning a number to a variable declared as string, causing a compile-time error.

🧠 Conceptual

expert

How many characters are in this string?

Consider the string with Unicode characters: const s = '👩👩👧👦'; How many characters does s.length report in TypeScript?

A 7

B 1

C 11

D 4

💡 Hint

Think about how JavaScript counts characters in strings with emoji and zero-width joiners.

The string contains multiple Unicode code units including zero-width joiners, so length counts code units, not user-perceived characters.

Practice

1. Which of the following is the correct way to declare a string variable in TypeScript?

easy

A. let name: string = "Alice";

B. let name = 123;

C. let name: number = "Alice";

D. let name: boolean = true;

Solution

1. Step 1: Understand TypeScript string type declaration

   In TypeScript, to declare a string variable, use let variableName: string = value; where value is text in quotes.

2. Step 2: Check each option's type and value

   let name: string = "Alice"; uses string type and assigns a text value "Alice" correctly. Others assign wrong types or values.

3. Final Answer:

   let name: string = "Alice"; -> Option A

4. Quick Check:

   Correct string declaration = let name: string = "Alice"; [OK]

Hint: String variables use : string and quotes [OK]

Common Mistakes:

• Assigning number or boolean to string type
• Missing type annotation when required
• Using wrong quotes for strings

2. Which of the following is the correct syntax to create a template string in TypeScript?

easy

A. let greeting = `Hello, ${name}!`;

B. let greeting = Hello, ${name}!;

C. let greeting = "Hello, ${name}!";

D. let greeting = 'Hello, ${name}!';

Solution

1. Step 1: Identify template string syntax

   Template strings use backticks ` and allow embedding variables with ${variable}.

2. Step 2: Check each option's quotes and variable embedding

   let greeting = `Hello, ${name}!`; correctly uses backticks and ${name} syntax. Options A and C use single or double quotes which do not support variable embedding. let greeting = Hello, ${name}!; misses quotes entirely.

3. Final Answer:

   let greeting = `Hello, ${name}!`; -> Option A

4. Quick Check:

   Template strings use backticks = let greeting = `Hello, ${name}!`; [OK]

Hint: Use backticks ` for template strings with ${} [OK]

Common Mistakes:

• Using single or double quotes for templates
• Forgetting backticks
• Not wrapping string in quotes

3. What is the output of the following TypeScript code?

const text: string = "Hello World";
console.log(text.length);

medium

A. 10

B. 11

C. 12

D. Error

Solution

1. Step 1: Understand string length property

   The length property returns the number of characters in the string, including spaces.

2. Step 2: Count characters in "Hello World"

   "Hello World" has 11 characters: 5 letters + 1 space + 5 letters.

3. Final Answer:

   11 -> Option B

4. Quick Check:

   "Hello World" length = 11 [OK]

Hint: Count all characters including spaces for length [OK]

Common Mistakes:

• Ignoring spaces in length count
• Confusing length with last index
• Expecting syntax error

4. Identify the error in this TypeScript code snippet:

let message: string = 'Hello';
message.toUppercase();

medium

A. Strings do not have toUpperCase method

B. No error, outputs 'HELLO'

C. Method name should be toUpperCase() with capital C

D. Missing semicolon after string declaration

Solution

1. Step 1: Check method name spelling

   The correct method to convert string to uppercase is toUpperCase() with capital 'C'.

2. Step 2: Identify error cause

   Using toUppercase() (lowercase 'c') causes a runtime error because the method does not exist.

3. Final Answer:

   Method name should be toUpperCase() with capital C -> Option C

4. Quick Check:

   Correct method spelling = Method name should be toUpperCase() with capital C [OK]

Hint: Remember uppercase C in toUpperCase() method [OK]

Common Mistakes:

• Using wrong case in method names
• Assuming strings lack case methods
• Ignoring runtime errors

5. Given the following code, what does this code check?

const name: string = "Anna";
const reversed = name.split("").reverse().join("");
console.log(reversed === name);

hard

A. If the string length is even

B. If the string is empty

C. If the string contains only letters

D. If the string is a palindrome (same forwards and backwards)

Solution

1. Step 1: Understand string reversal steps

   The code splits the string into characters, reverses the array, then joins back to a string.

2. Step 2: Compare reversed string with original

   It checks if the reversed string equals the original string, which means the string reads the same forwards and backwards.

3. Final Answer:

   If the string is a palindrome (same forwards and backwards) -> Option D

4. Quick Check:

   Reversed equals original means palindrome = If the string is a palindrome (same forwards and backwards) [OK]

Hint: Reversing and comparing checks palindrome [OK]

Common Mistakes:

• Confusing palindrome with empty string
• Thinking it checks string length or letters
• Missing split-reverse-join logic