# Modes of passing variables

When a function is invoked in JavaScript the arguments in the function can either be **passed by value** or **passed by reference.** 

#### Pass By Value

Primitive data types like number, boolean, string, null, undefined are passed by value. 

This means that a **copy of the actual parameter’s value is made in memory**, i.e. the caller and callee have two independent variables with the same value. If the callee modifies the parameter value, the effect is not visible to the caller.

```javascript
let number = 10;

function increase(x) {
  x = x + 1;
}

increase(number);
console.log(number); // 10
```

#### Pass By Reference

On the other hand, complex data types like Arrays and Objects are passed by reference.

Pass by reference means to **pass the reference of an argument in the calling function** to the corresponding formal parameter of the called function so that **a copy of the address of the actual parameter is made in memory**, i.e. the caller and the callee use the same variable for the parameter. **If the callee modifies the parameter variable, the effect is visible to the caller’s variable.**

```javascript
let counts = { kittens: 0, puppies: 0 };

function addKitten(countObj) {
  countObj.kittens = countObj.kittens + 1;
}

function addPuppy(countObj) {
  const newCounts = countObj;
  newCounts.puppies = newCounts.puppies + 1;
}

console.log(counts);
addKitten(counts);

const otherCounts = counts;
console.log(otherCounts);
addPuppy(otherCounts);
console.log(otherCounts);
console.log(counts);
```

{% hint style="info" %}
Can you try seeing if the same thing happens with Arrays?
{% endhint %}

#### References

* <https://www.scaler.com/topics/javascript/pass-by-value-and-pass-by-reference/>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ga0-2.gitbook.io/seifxr10anz-content/week-5/day-3-form-events-css-transitions-and-modes-of-passing-variables/modes-of-passing-variables.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.