String type behavior in Typescript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to declare a string variable with the value 'hello'.

Typescript

let greeting: string = [1];

Drag options to blanks, or click blank then click option'

A`hello`

Bhello

C'hello'

D"hello"

Attempts:

3 left

💡 Hint

Common Mistakes

Forgetting to use quotes around the string value.

Using backticks when not needed.

In TypeScript, string values must be enclosed in quotes. Single quotes 'hello' or double quotes "hello" correctly define a string literal.

2fill in blank

medium

Complete the code to get the length of the string stored in variable 'name'.

Typescript

let length: number = name[1];

Drag options to blanks, or click blank then click option'

A.count

B.length

C.size

D.length()

Attempts:

3 left

💡 Hint

Common Mistakes

Using parentheses like a function call (e.g., length()).

Using .size or .count which are not string properties.

In TypeScript, strings have a length property (without parentheses) to get their length.

3fill in blank

hard

Fix the error in the code to convert the string 'text' to uppercase.

Typescript

let upper = text[1];

Drag options to blanks, or click blank then click option'

A.toUpperCase()

B.toUppercase()

C.uppercase()

D.upperCase()

Attempts:

3 left

💡 Hint

Common Mistakes

Using lowercase 'c' in toUppercase().

Using methods that don't exist like uppercase() or upperCase().

The correct method to convert a string to uppercase in TypeScript is toUpperCase() with a capital C.

4fill in blank

hard

Fill both blanks to create a string that repeats 'ha' 3 times.

Typescript

let laugh = [1].repeat([2]);

Drag options to blanks, or click blank then click option'

A"ha"

B3

C2

D'ha'

Attempts:

3 left

💡 Hint

Common Mistakes

Using single quotes inconsistently.

Repeating the string the wrong number of times.

The repeat method repeats a string a given number of times. Use the string "ha" and repeat it 3 times.

5fill in blank

hard

Fill all three blanks to create a new string with the first letter capitalized and the rest lowercase.

Typescript

let newStr = str[1](0, 1).[2]() + str[3](1).toLowerCase();

Drag options to blanks, or click blank then click option'

A.slice

B.toUpperCase

C.substring

D.substr

Attempts:

3 left

💡 Hint

Common Mistakes

Using slice instead of substring (both work but here substring is expected).

Forgetting parentheses after toUpperCase.

Using substr which is deprecated.

Use substring(0, 1) to get the first letter, then toUpperCase() to capitalize it. Use substring(1) to get the rest of the string.

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