Objects are References in JavaScript

In JavaScript, objects are not simple values like strings, numbers, and booleans. Instead, they are complex data structures that consist of properties and methods. However, unlike simple values, objects are references in JavaScript.

What are References in JavaScript?

In JavaScript, references are pointers to memory locations where values are stored. When you assign an object to a variable, you are actually assigning a reference to the memory location where the object is stored, not the object itself.

For example, let's consider the following code snippet:

let obj1 = { name: "John" };
let obj2 = obj1;
obj2.name = "Jane";
console.log(obj1.name); // "Jane"

In this code snippet, we have an object obj1 with a property name set to "John". We then assign obj1 to obj2 using the = operator. This means that obj2 now refers to the same memory location as obj1. We then change the value of name property on obj2 to "Jane". Since both obj1 and obj2 refer to the same memory location, the value of name property on obj1 is also changed to "Jane".

Passing Objects as Arguments

When you pass an object as an argument to a function, you are actually passing a reference to the memory location where the object is stored, not the object itself. This means that any changes made to the object inside the function will affect the original object outside the function.

For example, let's consider the following code snippet:

let obj = { name: "John" };
function changeName(obj) {
  obj.name = "Jane";
}
changeName(obj);
console.log(obj.name); // "Jane"

In this code snippet, we have an object obj with a property name set to "John". We then pass obj as an argument to the changeName() function. Inside the function, we change the value of name property to "Jane". Since obj is a reference to the memory location where the object is stored, any changes made to the object inside the function affect the original object outside the function.

Copying Objects

If you want to create a new object that is a copy of an existing object in JavaScript, you cannot simply assign one object to another using the = operator. This will only copy the reference to the memory location where the object is stored, not the object itself. Instead, you need to create a new object and copy the properties of the existing object to the new object.

For example, let's consider the following code snippet:

let obj1 = { name: "John" };
let obj2 = Object.assign({}, obj1);
obj2.name = "Jane";
console.log(obj1.name); // "John"
console.log(obj2.name); // "Jane"

In this code snippet, we have an object obj1 with a property name set to "John". We then create a new object obj2 using the Object.assign() method and copy the properties of obj1 to obj2. This creates a new object with the same properties as obj1. We then change the value of name property on obj2 to "Jane". Since obj2 is a new object, any changes made to it do not affect the original object obj1.

In summary, objects are references in JavaScript, which means that assigning an object to a variable or passing an object as an argument to a function