Add New Property To Const Object Javascript

MUAZHAN

4 min read

·

Jun 22, 2024

43

Share

Adding New Properties to a Const Object in JavaScript

In JavaScript, using const to declare an object does not prevent you from modifying its properties. It only prevents you from reassigning the variable itself. This might seem confusing at first, but it makes sense when you consider how objects work in JavaScript.

Understanding Object References

When you declare an object with const, you're not creating a copy of the object. Instead, you're creating a reference to the object in memory. This reference is what the const keyword prevents you from re-assigning.

Here's an example:

const myObject = {
  name: "John",
  age: 30
};

// This will not work, as you are trying to reassign the variable myObject
myObject = {
  name: "Jane",
  age: 25
}; 

// This will work, as you are modifying the properties of the object
myObject.name = "Jane";
myObject.age = 25; 

Adding New Properties

You can easily add new properties to a const object using dot notation:

const myObject = {
  name: "John",
  age: 30
};

myObject.occupation = "Software Engineer";

console.log(myObject); // Output: { name: 'John', age: 30, occupation: 'Software Engineer' }

You can also add new properties using bracket notation:

const myObject = {
  name: "John",
  age: 30
};

myObject['city'] = "New York";

console.log(myObject); // Output: { name: 'John', age: 30, city: 'New York' }

Why Use Const?

Even though you can modify the properties of a const object, there are still benefits to using const:

• Immutability: Using const signals that the object should not be reassigned, making your code more predictable and less prone to errors.
• Readability: const makes it clear that the variable should be treated as a constant, improving code readability.
• Performance: const can help optimize your code, as it may allow the JavaScript engine to make certain optimizations.

When to Avoid Const

While using const is generally recommended, there are situations where it might not be suitable:

• Nested Objects: If you are working with deeply nested objects, using const might become cumbersome. In such cases, using let might be more practical.
• Mutability: If you explicitly need to modify the entire object itself, let is the better choice.

By understanding the difference between object references and object properties, you can leverage the benefits of const while maintaining the flexibility needed for your JavaScript applications.