You're not testing for the difference between pass-by-reference and pass-by-value in your examples. You are actually testing the scoping of variables.
For a good answer to your question about Javascript pass-by-value VS pass-by-reference, here is an answer on stack already.
Explanation for the behaviour of your code examples
Variables declared (created) inside a function are local to that function. This applies to any variable declared with the var keyword inside a function and any parameters that a function takes.
Variables declared outside a function are accessible inside a function if it hasn't got a got a variable declared by the same name.
Example 1:
var arr = [2,4,6]; ------------------
|
function checkArr(arr){ |
// paramter means that a local |
// variable 'arr' created inside |
// function, so refers to value |
// passed as argument or undefined |
|
arr = [3,3,3]; |
} |---- you're loggin this variable,
| the one inside the funciton is
var check = checkArr(arr); |
| function and eny enclosing child functions
console.log(arr) <------------------ (for the life of the function)
The behaviour becomes more obvious if we change the argument name to be something else:
var arr = [2,4,6];
function checkArr(ref){
ref = [3,3,3];
}
checkArr(arr);
When the function is called a local value ref gets created and set
to the REFERENCE of arr.
The following line, then overwrites the value of ref NOT the
actual value of arr with the array literal [3,3,3].
function checkArr(){
var ref = REFERENCE_TO_ARRAY_PASSED_IN;
ref = [3,3,3]; // REFERENCE to 'arr' OVERWRITTEN by Array literal
// global 'arr' remains unaffected
}
Example 2:
var arr = [2,4,6];
function checkArr(arr){
arr = [3,3,3];
return arr;
}
console.log(arr);
// this should log out [2, 4, 6] since you're not even invoking checkArr...
Example 3:
var arr = [2,4,6];
function checkArr(arr){
// same as first example
// a local variable 'arr' is created
// from the parameter 'arr'
// this for loop won't even run
// if 'arr' isn't passed in as an argument
// it'll fail on the first condition
for(var i = 0; i<arr.length; i++){
arr[i] = 3
}
}
// the arr variable INSIDE the function is not available here
console.log(arr) // logs out [2, 4, 6]
// this function refers to the variable declared above the function definition, again you haven't even invoked the funciton 'checkArr'
// thought even if you did, it would not change the console.lout ouptput
Getting the function to affect the global variable:
Remove the parameter from the function defintion
var arr = [2,4,6];
function checkArr(){
// no local variable or parameter is defined here
// but function has access to it's enclosing scope
// where there IS a variable 'arr'
arr = [3,3,3]
}
var check = checkArr();
console.log(arr);
// logs out [3,3,3]
When invoking the function now, you will then be mutating the array because the function will look for the variable 'arr' locally, when it doesn't find it it'll look in it's enclosing scope which in this case is the global scope where it'll find the variable arr and mutate that.
