Typeof operator in type context in Typescript - Time & Space Complexity

Time Complexity: typeof operator in runtime context

O(n)

Understanding Time Complexity

We want to understand how the time needed to check types using the typeof operator grows as the code runs.

Specifically, how does using typeof in a runtime context affect performance when the input size changes?

Scenario Under Consideration

Analyze the time complexity of the following code snippet.

const data = [1, 'two', true, 4, 'five'];

function countStrings(arr: unknown[]): number {
  let count = 0;
  for (const item of arr) {
    if (typeof item === 'string') {
      count++;
    }
  }
  return count;
}

countStrings(data);
    

This code counts how many string items are in an array using typeof in a type check.

Identify Repeating Operations

Identify the loops, recursion, array traversals that repeat.

• Primary operation: Looping through each item in the array and checking its type with typeof.
• How many times: Once for every item in the array (n times, where n is the array length).

How Execution Grows With Input

Each new item adds one more type check, so the work grows steadily as the array grows.

Input Size (n)	Approx. Operations
10	10 type checks
100	100 type checks
1000	1000 type checks

Pattern observation: The number of operations grows directly in step with the input size.

Final Time Complexity

Time Complexity: O(n)

This means the time to finish grows in a straight line as the input gets bigger.

Common Mistake

[X] Wrong: "Using typeof in a runtime context is slow and adds extra loops."

[OK] Correct: The typeof check happens inside the existing loop and does not add extra loops or nested checks, so it does not increase the overall time complexity beyond the loop itself.

Interview Connect

Understanding how simple type checks scale with input size helps you reason about performance in real code, showing you can think clearly about how your code behaves as data grows.

Self-Check

"What if we replaced the single loop with nested loops that check types inside each other? How would the time complexity change?"

Practice

1. What does the typeof operator do when used in a type context in TypeScript?

easy

A. It returns the runtime value of a variable.

B. It gets the type of a variable or value.

C. It converts a type to a string.

D. It creates a new variable.

Solution

1. Step 1: Understand typeof in type context

   In TypeScript, typeof used in a type context extracts the type of a variable or value, not its runtime value.

2. Step 2: Differentiate from runtime typeof

   Unlike JavaScript's runtime typeof that returns a string, TypeScript's typeof in type context returns the type itself.

3. Final Answer:

   It gets the type of a variable or value. -> Option B

4. Quick Check:

   typeof in type context = type extraction [OK]

Hint: Remember: typeof in types gets the variable's type [OK]

Common Mistakes:

• Confusing runtime typeof with type context typeof
• Thinking it returns a string type
• Assuming it creates new variables

2. Which of the following is the correct syntax to create a new type based on the type of variable user using typeof in TypeScript?

easy

A. type UserType = typeof(user);

B. type UserType = type of user;

C. type UserType = typeof user;

D. type UserType = type(user);

Solution

1. Step 1: Recall correct typeof syntax in type context

   The correct syntax is type NewType = typeof variableName; without parentheses.

2. Step 2: Check each option

   type UserType = typeof user; uses correct syntax. type UserType = type of user; has spaces and is invalid. type UserType = typeof(user); uses parentheses which is invalid in type context. type UserType = type(user); uses incorrect keyword.

3. Final Answer:

   type UserType = typeof user; -> Option C

4. Quick Check:

   Correct syntax = typeof variable without parentheses [OK]

Hint: Use typeof variable without parentheses for types [OK]

Common Mistakes:

• Adding parentheses after typeof
• Writing type of instead of typeof
• Using runtime syntax in type context

3. Consider the following TypeScript code:

const age = 30;
type AgeType = typeof age;

const myAge: AgeType = 25;

What is the type of myAge?

medium

A. number

B. string

C. boolean

D. any

Solution

1. Step 1: Identify the type of age

   The variable age is assigned the number 30, so its type is number.

2. Step 2: Understand AgeType = typeof age

   This means AgeType is the type of age, which is number. So myAge must be a number.

3. Final Answer:

   number -> Option A

4. Quick Check:

   typeof age = number [OK]

Hint: Check the original variable's type to know the new type [OK]

Common Mistakes:

• Confusing value with type
• Assuming typeof returns string
• Using wrong type for myAge

4. Identify the error in this TypeScript code using typeof in type context:

const name = "Alice";
type NameType = typeof(name);
const userName: NameType = "Bob";

medium

A. Parentheses are not allowed after typeof in type context.

B. Variable name is not declared.

C. Type alias cannot be assigned a string.

D. Missing semicolon after const declaration.

Solution

1. Step 1: Check typeof usage in type context

   In type context, typeof must be used without parentheses. Using parentheses causes a syntax error.

2. Step 2: Verify other parts

   Variable name is declared, assigning string is valid, and semicolons are optional in TypeScript.

3. Final Answer:

   Parentheses are not allowed after typeof in type context. -> Option A

4. Quick Check:

   No parentheses after typeof in types [OK]

Hint: Avoid parentheses after typeof in type declarations [OK]

Common Mistakes:

• Adding parentheses after typeof
• Thinking semicolons are mandatory
• Confusing runtime and type syntax

5. Given the code below, what is the type of configCopy?

const config = {
  url: "https://example.com",
  timeout: 5000,
  debug: true
};

type ConfigType = typeof config;
const configCopy: ConfigType = {
  url: "https://test.com",
  timeout: 3000,
  debug: false
};

Choose the best description of configCopy's type.

hard

A. An array of strings.

B. An object with only string properties.

C. A function returning an object.

D. An object with properties url (string), timeout (number), and debug (boolean).

Solution

1. Step 1: Analyze the original config object

   The config object has three properties: url (string), timeout (number), and debug (boolean).

2. Step 2: Understand ConfigType = typeof config

   This creates a type matching the shape and types of config.

3. Step 3: Check configCopy assignment

   configCopy must match the same property types as config, which it does.

4. Final Answer:

   An object with properties url (string), timeout (number), and debug (boolean). -> Option D

5. Quick Check:

   typeof config = object with matching properties [OK]

Hint: Use typeof to copy object shape and types exactly [OK]

Common Mistakes:

• Assuming typeof returns array or function
• Ignoring property types in object
• Confusing object with array