Passing Parameters by Value or by Reference

This section provides a tutorial example showing that primitive parameters are passed by value and object parameters are passed by reference.

As I mentioned in a previous section, JavaScript documentation says that primitive parameters are passed by value and object parameters are passed by reference. I want to test these rules using the following JavaScript tutorial example:

<html>
<!-- Swap_Values_and_Arrays.html
   Copyright (c) 2013 by Dr. Herong Yang, herongyang.com
-->
<head><title>Swap Values and Arrays</title></head>
<body>
<pre>
<script type="text/javascript">
// Defining a function to swap values
function swap_values(left, right) {
   var temp;
   temp = left;
   left = right;
   right = temp;
}

// Defining a function to swap arrays
function swap_arrays(left, right) {
   var temp;
   for (var i=0; i<left.length; i++) {
      temp = left[i];
      left[i] = right[i];
      right[i] = temp;
   }
}

   var first = "Black";
   var second = "White";
   document.write("\nTest 1: Swapping two string variables\n");
   document.write("   Before call: "+first+" | "+second+"\n");
   swap_values(first,second);
   document.write("   After call: "+first+" | "+second+"\n");

   var colors = new Array("Red", "Green", "Blue", "Yellow");
   var animals = new Array("Dog", "Cat", "Fish", "Bird");
   document.write("\nTest 2: Swapping two array objects\n");
   document.write("   Before call: "+colors+"\n");
   swap_arrays(colors,animals);
   document.write("   After call: "+colors+"\n");
</script>
</pre>
</body>
</html>

Here is the output of this tutorial example:

Test 1: Swapping two string variables
   Before call: Black | White
   After call: Black | White

Test 2: Swapping two array objects
   Before call: Red,Green,Blue,Yellow
   After call: Dog,Cat,Fish,Bird

The output shows no surprises. When statement "swap_values(first,second);" is executed, Copies of values stored in "first" and "second" are passed into the swap_values() function. The swap operation inside swap_values() is performed on copied values. Not on original values in "first" and "second". This is why "first" still contains "Blank" after the function call.

When statement "swap_arrays(colors,animals);" is executed, References to arrays stored in "colors" and "animals" are passed into the swap_arrays() function. The swap operation inside swap_arrays() is performed on original arrays. This is why the "colors" array contains animals now.

Table of Contents

 About This Book

 Introduction to JavaScript

 ECMAScript Language Specification and JavaScript Dialects

 Data Types, Variables and Expressions

 Flow Control Statements

 Creating, Accessing, and Manipulating Arrays

Defining and Calling Functions

 Defining Your Own Functions

 Defining Your Own Functions - Example

 Calling Your Own Functions - Example

Passing Parameters by Value or by Reference

 Function Parameters Are Passed as Local Copies

 Function Parameters Are Passed as Local Copies - Example

 Global and Local Variables - Scope Rules

 Global Variables - Examples

 Local Variables - Examples

 Collision of Global and Local Variables - Examples

 "return" Statement and Return Value

 Web Browser Supporting JavaScript

 Server-Side and Client-Side Web Scripting

 Introduction to Objects

 Defining Your Own Object Types

 Inheritance of Properties and Methods through the Prototype Object Chain

 'jrunscript' - JavaScript Shell Command from JDK

 Using Functions as "Function" Objects

 Introduction to Built-in Object Types

 W3C's Document Object Model (DOM) Specifications

 References

 PDF Printing Version