JavaScript Pass by Value and Pass by Reference - Simplified
2 min read
Based upon Datatype, JavaScript passes a value of a variable using two ways:
Using Pass by Value
Using Pass by Reference
Pass by Value
When you pass primitive data types (such as numbers, strings, or booleans) to a function, a copy of the actual value is passed. Changes made to that variable inside the function do not affect the original variable outside the function. These values are like locked boxes – you can't change what's inside. If you modify the value inside a function, it won't change the original value outside the function because you're working with a separate copy.
In simple terms, Pass by Value is like making a photocopy of a document: changing the copy doesn't affect the original document.
function modifyValue(x) {
x = 10;
}
let num = 5;
modifyValue(num);
console.log(num); // Output: 5
In the example above, the value num remains unchanged because it's a primitive type.
Pass by Reference
When you pass an object (like an array or custom object) to a function, a reference to that object is sent to the function. Changes made inside the function affect the original object outside the function.
When you work with non-primitive types like objects or arrays, they are passed in a way that they share the same underlying data. Imagine it like two people holding a balloon. If one person changes the balloon's colour, the other person sees the change because they both have a grip on the same balloon. Similarly, if you modify an object or array inside a function, those changes are reflected outside the function because they both refer to the same object or array in memory.
function modifyObject(obj) {
obj.prop = "new value";
}
let myObject = { prop: "old value" };
modifyObject(myObject);
console.log(myObject.prop); // Output: "new value"
In this case, the object myObject is passed by reference, so changes made to its property prop inside the function are reflected in the original object.
Do you know how many types of hackers are there?