Bird
Raised Fist0
Typescriptprogramming~5 mins

Pattern matching with template literals in Typescript - Time & Space Complexity

Choose your learning style10 modes available
LearnWhyDeepVisualTryChallengeProjectRecallTime
Time Complexity: Pattern matching with template literals
O(1)
Understanding Time Complexity

We want to understand how the time it takes to match patterns using template literals changes as the input grows.

How does the matching process scale when the input string gets longer?

Scenario Under Consideration

Analyze the time complexity of the following code snippet.


const input = "user_1234";

function matchUser(input: string): boolean {
  return input.startsWith("user_");
}

console.log(matchUser(input));

This code checks if the input string starts with "user_" using a fixed prefix.

Identify Repeating Operations
  • Primary operation: Checking each character of the prefix "user_" against the input string.
  • How many times: Once per character in the prefix, which is a fixed length (5 characters).
How Execution Grows With Input

The check only looks at the first few characters, so even if the input grows, the work stays the same.

Input Size (n)Approx. Operations
105 (fixed prefix length)
1005 (still just prefix length)
10005 (no change)

Pattern observation: The number of operations does not grow with input size because only the fixed prefix is checked.

Final Time Complexity

Time Complexity: O(1)

This means the time to check the pattern stays the same no matter how long the input string is.

Common Mistake

[X] Wrong: "Matching a pattern with template literals always takes longer as the input grows."

[OK] Correct: Here, only the fixed part of the pattern is checked, so the input length does not affect the time.

Interview Connect

Understanding how pattern matching scales helps you explain your code's efficiency clearly and confidently in interviews.

Self-Check

"What if the pattern included a variable-length part that must be fully checked? How would the time complexity change?"

Practice

(1/5)
1. What does pattern matching with template literals in TypeScript primarily help you do?
easy
A. Create new variables dynamically
B. Automatically generate functions from strings
C. Change the type of a variable at runtime
D. Check if a string fits a specific shape or format

Solution

  1. Step 1: Understand the purpose of pattern matching

    Pattern matching with template literals is used to verify if strings follow a certain pattern or format.

  2. Step 2: Relate to template literals usage

    Template literals allow embedding expressions and patterns to check string shapes easily.

  3. Final Answer:

    Check if a string fits a specific shape or format -> Option D

  4. Quick Check:

    Pattern matching = Check string shape [OK]
Hint: Pattern matching checks string shapes, not variable types [OK]
Common Mistakes:
  • Confusing pattern matching with variable creation
  • Thinking it changes variable types
  • Assuming it generates functions automatically
2. Which of the following is the correct syntax to use a template literal pattern in a TypeScript type check?
easy
A. type ID = `${string}-${number}`;
B. type ID = '${string}-${number}';
C. ;`}rebmun{$-}gnirts{$` = DI epyt
D. type ID = `${string}-${number}`

Solution

  1. Step 1: Identify correct template literal syntax

    Template literals use backticks (`) and embed types inside ${} without quotes.

  2. Step 2: Check for correct punctuation

    type ID = `${string}-${number}`; correctly uses backticks and ${} with no extra quotes.

  3. Final Answer:

    type ID = `${string}-${number}`; -> Option A

  4. Quick Check:

    Backticks + ${} = correct syntax [OK]
Hint: Use backticks and ${} without quotes for template types [OK]
Common Mistakes:
  • Using single or double quotes instead of backticks
  • Putting quotes inside ${} expressions
  • Missing backticks around the pattern
3. What will be the result of this TypeScript code snippet?
type Email = `${string}@${string}.com`;

function isEmail(value: string): value is Email {
  return /.+@.+\.com$/.test(value);
}

console.log(isEmail('user@example.com'));
console.log(isEmail('user@example.org'));
medium
A. true\ntrue
B. false\ntrue
C. true\nfalse
D. false\nfalse

Solution

  1. Step 1: Understand the Email type pattern

    The Email type expects strings like 'something@something.com'.

  2. Step 2: Analyze the isEmail function

    The regex checks if the string ends with '.com' after an '@' symbol.

  3. Step 3: Check the console.log outputs

    'user@example.com' matches the regex, so true; 'user@example.org' does not, so false.

  4. Final Answer:

    true false -> Option C

  5. Quick Check:

    Regex matches .com only = true, false [OK]
Hint: Regex matches only .com emails, others return false [OK]
Common Mistakes:
  • Assuming .org matches .com pattern
  • Ignoring regex anchors
  • Confusing true/false order in output
4. Identify the error in this TypeScript code using template literal pattern matching:
type Phone = `${number}-${number}-${number}`;

function isPhone(value: string): value is Phone {
  return /^\d{3}-\d{3}-\d{4}$/.test(value);
}
medium
A. The Phone type pattern does not match the regex format
B. The regex pattern is missing anchors
C. Template literals cannot use number types inside ${}
D. The function should return a boolean, not a type predicate

Solution

  1. Step 1: Compare Phone type and regex pattern

    Phone type expects three numbers separated by dashes, but each ${number} matches any number, not fixed digits.

  2. Step 2: Check regex pattern details

    The regex expects exactly 3 digits, then 3 digits, then 4 digits, which doesn't align with the Phone type's generic number placeholders.

  3. Final Answer:

    The Phone type pattern does not match the regex format -> Option A

  4. Quick Check:

    Type pattern and regex must align [OK]
Hint: Match template literal types exactly with regex patterns [OK]
Common Mistakes:
  • Assuming ${number} matches fixed digit counts
  • Ignoring regex anchors (though present here)
  • Confusing return type of type predicate functions
5. Given this TypeScript code, what will be the output?
type UserID = `user_${number}`;

function parseUserID(id: string): UserID | null {
  if (id.match(/^user_\d+$/)) {
    return id as UserID;
  }
  return null;
}

console.log(parseUserID('user_123'));
console.log(parseUserID('admin_123'));
hard
A. null\nnull
B. 'user_123'\nnull
C. 'user_123'\n'user_123'
D. null\n'user_123'

Solution

  1. Step 1: Understand UserID type pattern

    UserID must start with 'user_' followed by a number.

  2. Step 2: Analyze parseUserID function

    The function returns the id cast as UserID if it matches the regex /^user_\d+$/, else returns null.

  3. Step 3: Evaluate console.log outputs

    'user_123' matches regex, so returns 'user_123'; 'admin_123' does not, so returns null.

  4. Final Answer:

    'user_123' null -> Option B

  5. Quick Check:

    Regex match returns id, else null [OK]
Hint: Regex match controls return; unmatched returns null [OK]
Common Mistakes:
  • Assuming 'admin_123' matches user pattern
  • Confusing return types with casting
  • Ignoring regex anchors and pattern
Recommended

Ready to prove it?

Pass the test and this pattern moves unknown strong while earning +1 Grip toward your certificate.

10 questions~5 mineasy hard