In JavaScript, Pass By Value And Pass By Reference

Introduction

Given that we are already familiar with functions and the many methods to call them, we will talk about pass by value and pass by reference in this article while discussing Javascript programming.

The primitive data types, such as Number, Boolean, String, etc., are all pass by values, but objects can be passed by value or reference.

However, if the primitive/own object’s parameter is altered, the primitive/object does not change in response.

However, it also functions as pass by reference, meaning that if the internal structure of the object is altered, the resulting object will also reflect the altered internal structure.

function too(x, y, z) {
    x = x + 5;
    y.name = "chocolate cookie";
    z = {name: "coffee doughnut"};
}

A function that modifies the values of three arguments (x, y, and z) has been defined. Its operations include the following:

1. Change x’s value to x+5
2. Change object “y”name” “‘s attribute to “chocolate cookie”
3. Update z, convert z’s value to an object with the field “name,” and give the name property the value “coffee doughnut”

Declare three distinct variables, a, b, and c, and then call the function on them.

function cox(x, y, z) {
    x = x + 5;
    y.name = "chocolate cookie";
    z = {
        name: "coffee doughnut"
    };
}
var p = 2;
var q = {
    name: "plain cookie"
};
var r = {
    name: "plain doughnut"
};
foo(p, b, c);
console.log(p);
console.log(q.name);
console.log(r.name);

You’ll discover the result,

2
chocolate cookie
plain doughnut

Pass-by-value is always the case for basic data types. The value outside the function will remain its original value and be unaffected by the function, even if we change the value of any primitive inside any function. Furthermore, objects have two different pass-by-value and pass-by-reference behaviours. An object operates as a pass by value if its whole internal structure is altered. However, if an object’s own parameter is altered, it will act like a pass by reference.

“a”, “b”, and “c” are references in the function. The value of the “name” property, which was initially set to “plain cookie,” is changed when the object referenced by “b”name” “‘s property is modified. By altering the reference to “c” to “name: “coffee doughnut,” you are referencing a new object (which immediately goes out of scope when the function exits). As a result, “c” keeps its original value but “b” loses it.

If we were to conclude what we’ve learnt into three clear ideas, we’d say:

1. JavaScript only supports custom types like objects and arrays by passing references rather than values for all of the primitive data types.
2. A variable’s value can only point to a new primitive, object, or array; it never affects the underlying primitive, object, or array.
3. A variable’s “value” is a reference to the object or array it refers to when it contains an object or array reference.
4. When a variable references an object or array, the property in the referenced object or array is also changed.