Adding and removing properties in Javascript - Time & Space Complexity
We want to understand how the time it takes to add or remove properties from an object changes as the object grows.
How does the number of properties affect the speed of these operations?
Analyze the time complexity of the following code snippet.
const obj = {};
// Adding properties
for (let i = 0; i < n; i++) {
obj['key' + i] = i;
}
// Removing properties
for (let i = 0; i < n; i++) {
delete obj['key' + i];
}
This code adds n properties to an object, then removes those n properties one by one.
- Primary operation: Adding and deleting properties inside loops.
- How many times: Each loop runs n times, performing one add or delete per iteration.
As n grows, the number of add and delete operations grows directly with n.
| Input Size (n) | Approx. Operations |
|---|---|
| 10 | About 20 (10 adds + 10 deletes) |
| 100 | About 200 (100 adds + 100 deletes) |
| 1000 | About 2000 (1000 adds + 1000 deletes) |
Pattern observation: The total work grows in a straight line as n increases.
Time Complexity: O(n)
This means the time to add and remove properties grows directly in proportion to the number of properties.
[X] Wrong: "Adding or removing a property takes the same time no matter how many properties the object has."
[OK] Correct: While each add or delete is fast, doing many of them adds up, so total time grows with the number of operations.
Understanding how simple operations like adding or removing properties scale helps you reason about object manipulation performance in real projects.
"What if we added properties in a nested loop instead? How would the time complexity change?"
Practice
Which of the following is the correct way to add a new property age with value 25 to an existing object person?
Solution
Step 1: Understand how to add properties in JavaScript objects
Properties are added by assigning a value toobject.property.Step 2: Check each option's syntax
Onlyperson.age = 25;uses correct JavaScript syntax to add a property.Final Answer:
person.age = 25; -> Option AQuick Check:
Adding property = person.age = 25 [OK]
- Using invalid syntax like 'add' keyword
- Using arrow or parentheses incorrectly
- Trying to call property as a function
Which of the following lines correctly removes the property color from the object car?
Solution
Step 1: Recall how to remove properties in JavaScript
Thedeletekeyword removes a property from an object.Step 2: Verify each option
Onlydelete car.color;correctly removes the property.Final Answer:
delete car.color; -> Option DQuick Check:
Remove property = delete object.property [OK]
- Using 'remove' keyword which doesn't exist
- Assigning null instead of deleting
- Calling delete as a method
What will be the output of the following code?
const obj = {a: 1};
obj.b = 2;
delete obj.a;
console.log(obj);Solution
Step 1: Add property 'b' to object
Afterobj.b = 2;, object is{a:1, b:2}.Step 2: Delete property 'a'
delete obj.a;removes property 'a', so object becomes{b:2}.Final Answer:
{b: 2} -> Option BQuick Check:
Delete removes property completely [OK]
- Thinking delete sets property to undefined
- Expecting original property to remain
- Confusing object output format
Find the error in the following code that tries to remove the name property from user:
const user = {name: 'Alice', age: 30};
remove user.name;Solution
Step 1: Check the keyword used for deletion
JavaScript usesdelete, notremove, to delete properties.Step 2: Confirm object and property validity
useris defined andnameis a valid property.Final Answer:
The keywordremoveis invalid in JavaScript. -> Option AQuick Check:
Use 'delete' keyword, not 'remove' [OK]
- Using 'remove' instead of 'delete'
- Trying to set property to null to delete
- Assuming property can't be deleted
You have an object settings with properties {theme: 'dark', fontSize: 14, showSidebar: true}. You want to remove showSidebar only if it exists, then add a new property language with value 'en'. Which code correctly does this?
Solution
Step 1: Check if property exists before deleting
Using'showSidebar' in settingsensures property exists before deletion.Step 2: Add new property correctly
settings.language = 'en';adds the new property properly.Step 3: Verify other options
delete settings.showSidebar; settings.language == 'en';
uses wrong comparison operator==instead of assignment=.settings.showSidebar = undefined; settings.language = 'en';
sets property to undefined but does not remove it.if (settings.showSidebar) { settings.showSidebar = null; } settings.language = 'en';sets property to null but does not remove it.Final Answer:
if ('showSidebar' in settings) { delete settings.showSidebar; } settings.language = 'en'; -> Option CQuick Check:
Check existence, delete, then add property [OK]
- Using '==' instead of '=' for assignment
- Setting property to undefined or null instead of deleting
- Not checking if property exists before deleting
Ready to prove it?
Pass the test and this pattern moves unknown
