Last Updated : 23 Jul, 2025
JavaScript handles variables in different ways when passing them to functions. Variables in JavaScript can either be passed by value or passed by reference, depending on the type of data they hold.
"Pass by Value" in JavaScriptWhen a variable is passed by value, a copy of the actual value is passed to the function. Any changes made to the parameter inside the function do not affect the original variable.
In JavaScript, primitive data types are passed by value. These include:
JavaScript
let n = 10;
function modify(x) {
x = 20;
console.log("Inside function: ", x);
}
modify(n);
console.log("Outside function: ", n);
Inside function: 20 Outside function: 10
In this example
n
(10) is copied to x
.x
inside the function does not affect n
because x
is a separate copy.When a variable is passed by reference, a reference to the actual data is passed. This means changes made to the parameter inside the function affect the original variable.
In JavaScript, non-primitive data types (such as objects and arrays) are passed by reference.
JavaScript
let obj = { name: "Ravi" };
function modify(o) {
o.name = "Arun";
console.log("Inside function: ", o.name);
}
modify(obj);
console.log("Outside function: ", obj.name);
Inside function: Arun Outside function: Arun
In this example the obj reference is passed to the function, allowing changes to the original object.
Difference between Pass by Value and Pass by Reference Feature Pass by Value Pass by Reference Applies To Primitive data types Non-primitive data types (objects, arrays) Data Copy Creates a copy of the actual value Passes a reference to the original data Effect of Changes Changes inside the function do not affect the original variable Changes inside the function affect the original variable Use Cases Numbers, strings, booleans, etc. Arrays, objects, functions Important Clarification: Does JavaScript Truly Support "Pass by Reference"?JavaScript does not have "true pass by reference." Instead:
let obj = { name: "Ravi" };
function reassignReference(o) {
// Reassigning the reference
o = { name: "Arun" };
console.log("Inside function: ", o.name);
}
reassignReference(obj);
console.log("Outside function: ", obj.name);
Inside function: Arun Outside function: Ravi
In this example
Thus, JavaScript passes reference values for objects but not "by reference" as in languages like C++.
Common Pitfalls 1. Unexpected Side EffectsWhen working with objects or arrays, be cautious of unintended changes to the original data.
JavaScript
let config = { theme: "dark" };
function updateTheme(c) {
c.theme = "light";
}
updateTheme(config);
console.log(config.theme);
2. Cloning to Avoid Reference Issues
To avoid modifying the original object, create a shallow or deep copy.
JavaScript
let original = { name: "Ravi" };
let copy = { ...original };
copy.name = "Arun";
console.log(original.name);
Deep Copy
JavaScript
let original = { name: "Ravi", details: { age: 25 } };
let deepCopy = JSON.parse(JSON.stringify(original));
deepCopy.details.age = 30;
console.log(original.details.age);
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4