Prototype chain in Javascript - Time & Space Complexity
When we use the prototype chain in JavaScript, the computer looks up properties step by step along linked objects.
We want to know how the time to find a property changes as the chain gets longer.
Analyze the time complexity of the following code snippet.
const grandparent = { a: 1 };
const parent = Object.create(grandparent);
parent.b = 2;
const child = Object.create(parent);
child.c = 3;
console.log(child.a); // looks up prototype chain
console.log(child.b);
console.log(child.c);
This code creates a chain of objects and accesses properties that may be on the object or its prototypes.
Identify the loops, recursion, array traversals that repeat.
- Primary operation: Searching for a property by checking each object in the prototype chain one by one.
- How many times: At most, the number of objects in the chain until the property is found or the chain ends.
As the prototype chain gets longer, the time to find a property grows roughly in a straight line with the chain length.
| Input Size (chain length) | Approx. Operations (property checks) |
|---|---|
| 10 | Up to 10 checks |
| 100 | Up to 100 checks |
| 1000 | Up to 1000 checks |
Pattern observation: The time grows linearly as the chain length increases.
Time Complexity: O(n)
This means the time to find a property grows directly with the number of objects in the prototype chain.
[X] Wrong: "Looking up a property is always instant, no matter how long the chain is."
[OK] Correct: The computer checks each object one by one until it finds the property, so longer chains take more time.
Understanding how prototype chains affect lookup time helps you write efficient code and explain how JavaScript works under the hood.
"What if the property is always found on the first object in the chain? How would the time complexity change?"
Practice
Solution
Step 1: Understand prototype chain purpose
The prototype chain allows objects to share properties and methods by linking them.Step 2: Identify correct description
Sharing properties and methods matches the prototype chain's role, unlike other options.Final Answer:
Sharing properties and methods between objects -> Option AQuick Check:
Prototype chain = Sharing properties and methods [OK]
- Thinking it creates variables
- Assuming it speeds up code
- Believing it stops code
Solution
Step 1: Recall Object.create syntax
Object.create(prototypeObj) creates a new object with prototypeObj as its prototype.Step 2: Check other options
Other options use incorrect syntax or methods that don't exist.Final Answer:
let obj = Object.create(prototypeObj); -> Option BQuick Check:
Object.create() creates object with prototype [OK]
- Using new Object() with prototype argument
- Calling create() on prototype object
- Trying to call Object.prototype as a function
const parent = { greet() { return 'Hello'; } };
const child = Object.create(parent);
console.log(child.greet());Solution
Step 1: Understand prototype lookup
child has no greet method, so JavaScript looks up to parent where greet exists.Step 2: Call greet method from parent
Calling child.greet() runs parent.greet(), returning 'Hello'.Final Answer:
'Hello' -> Option DQuick Check:
Prototype lookup finds greet() = 'Hello' [OK]
- Expecting undefined because child lacks greet
- Thinking it causes error
- Assuming null is returned
const animal = { eats: true };
const rabbit = Object.create(animal);
rabbit.eats = false;
console.log(rabbit.eats);
console.log(animal.eats);Solution
Step 1: Understand property shadowing
Setting rabbit.eats creates a new property on rabbit, shadowing animal.eats.Step 2: Check outputs
rabbit.eats logs false; animal.eats remains true. This is expected behavior.Final Answer:
No error; output is as expected -> Option AQuick Check:
Property shadowing works correctly [OK]
- Thinking parent's property changes
- Believing Object.create is wrong here
- Expecting error from property override
child inherits from parent, and parent inherits from grandparent. Which code correctly sets this prototype chain?Solution
Step 1: Set parent prototype to grandparent
Using Object.create(grandparent) for parent sets grandparent as prototype.Step 2: Set child prototype to parent
Using Object.create(parent) for child sets parent as prototype, completing chain.Step 3: Check other options
B incorrectly overrides child's prototype to grandparent using __proto__, skipping parent; C creates a circular reference (child not defined when creating parent); D sets child directly to grandparent, skipping parent.Final Answer:
const grandparent = {}; const parent = Object.create(grandparent); const child = Object.create(parent); -> Option CQuick Check:
Prototype chain: child -> parent -> grandparent [OK]
- Setting child prototype to grandparent directly
- Reversing prototype chain order
- Using __proto__ instead of Object.create
Ready to prove it?
Pass the test and this pattern moves unknown
