Object use cases in Javascript - Time & Space Complexity

Time Complexity: Object use cases

O(n)

Understanding Time Complexity

When using objects in JavaScript, it's important to know how fast operations like adding, accessing, or checking properties happen.

We want to understand how the time to do these tasks changes as the object grows bigger.

Scenario Under Consideration

Analyze the time complexity of the following code snippet.

const obj = {};
for (let i = 0; i < n; i++) {
  obj[`key${i}`] = i;
}

const value = obj['key500'];
const hasKey = 'key500' in obj;
    

This code adds n properties to an object, then accesses and checks one property.

Identify Repeating Operations

• Primary operation: Adding properties inside a loop.
• How many times: n times, once per loop iteration.
• Accessing and checking a property happens once each, outside the loop.

How Execution Grows With Input

Adding properties grows with the number of items n, but accessing or checking a property stays quick no matter the size.

Input Size (n)	Approx. Operations
10	10 additions, 1 access, 1 check
100	100 additions, 1 access, 1 check
1000	1000 additions, 1 access, 1 check

Pattern observation: Adding properties grows linearly with n, but accessing or checking a property stays constant time.

Final Time Complexity

Time Complexity: O(n)

This means adding n properties takes time proportional to n, but accessing or checking a property is very fast and does not depend on n.

Common Mistake

[X] Wrong: "Accessing a property in an object takes longer as the object gets bigger."

[OK] Correct: Objects use a special way to find properties quickly, so access time stays about the same no matter how many properties there are.

Interview Connect

Understanding how objects work behind the scenes helps you write faster code and answer questions about efficiency with confidence.

Self-Check

"What if we used an array instead of an object to store these key-value pairs? How would the time complexity change?"

Practice

1. Which of the following best describes a JavaScript object?

easy

A. A list of values without labels

B. A type of loop for repeating actions

C. A function that returns a number

D. A collection of key-value pairs to store related data

Solution

1. Step 1: Understand what an object stores

   Objects store data as pairs of keys (labels) and values, grouping related information.

2. Step 2: Compare options to definition

   A collection of key-value pairs to store related data matches this definition exactly, while others describe different concepts.

3. Final Answer:

   A collection of key-value pairs to store related data -> Option D

4. Quick Check:

   Object = key-value pairs [OK]

Hint: Objects always use keys to label their stored values [OK]

Common Mistakes:

• Confusing objects with arrays (which are ordered lists)
• Thinking objects are only functions
• Mixing up objects with loops or other structures

2. Which syntax correctly creates an object with a key 'name' and value 'Alice'?

easy

A. let obj = (name = 'Alice');

B. let obj = {name: 'Alice'};

C. let obj = ['name' => 'Alice'];

D. let obj = name: 'Alice';

Solution

1. Step 1: Recall object literal syntax

   Objects use curly braces with key: value pairs, like {key: value}.

2. Step 2: Check each option's syntax

   let obj = {name: 'Alice'}; uses correct curly braces and colon. Others use invalid syntax for JavaScript objects.

3. Final Answer:

   let obj = {name: 'Alice'}; -> Option B

4. Quick Check:

   Object syntax = {key: value} [OK]

Hint: Use curly braces and colon for object keys and values [OK]

Common Mistakes:

• Using parentheses instead of braces
• Using arrow => which is not valid in JS objects
• Omitting braces entirely

3. What will be the output of this code?

const car = { brand: 'Toyota', year: 2020 };
console.log(car.brand);

medium

A. Toyota

B. brand

C. undefined

D. 2020

Solution

1. Step 1: Access the 'brand' property of the object

   car.brand accesses the value stored under the key 'brand', which is 'Toyota'.

2. Step 2: Understand console.log output

   console.log prints the value Toyota to the console.

3. Final Answer:

   Toyota -> Option A

4. Quick Check:

   car.brand = Toyota [OK]

Hint: Access object values with dot notation: object.key [OK]

Common Mistakes:

• Printing the key name instead of the value
• Using wrong property name causing undefined
• Confusing object with array indexing

4. Find the error in this code snippet:

const person = { name: 'Bob', age: 25 };
console.log(person['age']);
console.log(person.age());

medium

A. person.age() is incorrect because age is not a function

B. person['age'] should be person.age()

C. Missing semicolon after object declaration

D. person.name is undefined

Solution

1. Step 1: Identify property types in the object

   person has keys 'name' and 'age' with values 'Bob' and 25 (a number), not functions.

2. Step 2: Check method call usage

   person.age() tries to call age as a function, but age is a number, causing an error.

3. Final Answer:

   person.age() is incorrect because age is not a function -> Option A

4. Quick Check:

   Only functions can be called with () [OK]

Hint: Only call functions with () not plain values [OK]

Common Mistakes:

• Calling a number or string as a function
• Confusing bracket and dot notation usage
• Assuming missing semicolons cause runtime errors

5. You want to store a list of students with their scores and add a method to calculate the average score. Which object structure is best?

hard

A. const students = { 'Anna': 90, 'Ben': 80 };

B. const students = ['Anna', 90, 'Ben', 80];

C. const students = { list: [{name: 'Anna', score: 90}, {name: 'Ben', score: 80}], average: function() { /* calculate average */ } };

D. const students = function() { return ['Anna', 90, 'Ben', 80]; };

Solution

1. Step 1: Identify need for data and method together

   We want to store multiple students with scores and a method to calculate average, so an object with a list and a function is suitable.

2. Step 2: Evaluate each option

   const students = { list: [{name: 'Anna', score: 90}, {name: 'Ben', score: 80}], average: function() { /* calculate average */ } }; uses an object with a list of student objects and a method for average calculation. const students = ['Anna', 90, 'Ben', 80]; is a flat array without structure. const students = { 'Anna': 90, 'Ben': 80 }; lacks a method. const students = function() { return ['Anna', 90, 'Ben', 80]; }; is a function, not an object with data and method.

3. Final Answer:

   const students = { list: [{name: 'Anna', score: 90}, {name: 'Ben', score: 80}], average: function() { /* calculate average */ } }; -> Option C

4. Quick Check:

   Object with data + method = const students = { list: [{name: 'Anna', score: 90}, {name: 'Ben', score: 80}], average: function() { /* calculate average */ } }; [OK]

Hint: Use objects with arrays and methods for grouped data and actions [OK]

Common Mistakes:

• Using arrays without methods for complex data
• Not grouping related data in objects
• Confusing functions with data containers