Home | | Internet & World Wide Web HOW TO PROGRAM | | Internet Programming | | Web Programming | Passing Arrays to Functions - JavaScript(JS)

Chapter: Internet & World Wide Web HOW TO PROGRAM - The Ajax Client - JavaScript: Arrays

| Study Material, Lecturing Notes, Assignment, Reference, Wiki description explanation, brief detail |

Passing Arrays to Functions - JavaScript(JS)

To pass an array argument to a function, specify the name of the array (a reference to the array) without brackets.

Passing Arrays to Functions

 

To pass an array argument to a function, specify the name of the array (a reference to the array) without brackets. For example, if array hourlyTemperatures has been declared as

 

var hourlyTemperatures = new Array( 24 );

 

then the function call

 

modifyArray( hourlyTemperatures );

 

passes array hourlyTemperatures to function modifyArray. As stated in Section 10.2, every array object in JavaScript knows its own size (via the length attribute). Thus, when we pass an array object into a function, we do not pass the size of the array separately as an argument. Figure 10.3 illustrated this concept when we passed Arrays n1 and n2 to func-tion outputArray to display each Array’s contents.

 

Although entire arrays are passed by reference, individual numeric and boolean array elements are passed by value exactly as simple numeric and boolean variables are passed (the objects referred to by individual elements of an Array of objects are still passed by refer-ence). Such simple single pieces of data are called scalars, or scalar quantities. To pass an array element to a function, use the subscripted name of the element as an argument in the function call.

      <?xml version = "1.0" encoding = "utf-8"?>

 

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

 

      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

 

      <!-- Fig. 10.8: PassArray.html -->

 

      <!-- Passing arrays and individual array elements to functions. -->

 

      <html xmlns = "http://www.w3.org/1999/xhtml">

 

      <head>

 

      <title>Passing arrays and individual array

 

        elements to functions</title>

 

        <script type = "text/javascript">

        <!--

        var a = [ 1, 2, 3, 4, 5 ];

 document.writeln( "<h2>Effects of passing entire " +

        "array by reference</h2>" );

 

outputArray( "Original array: ", a );

modifyArray( a );  // array a passed by reference                       

                       

outputArray( "Modified array: ", a );

                       

document.writeln( "<h2>Effects of passing array " +

"element by value</h2>" +

"a[3] before modifyElement: " + a[ 3 ] );

                       

modifyElement( a[ 3 ] ); // array element a[3] passed by value

                       

document.writeln( "<br />a[3] after modifyElement: " + a[ 3 ] );

        // outputs heading followed by the contents of "theArray"

 

        function outputArray( heading, theArray )

{

document.writeln(

heading +      theArray.join( " " )     + "<br />" );

} // end function outputArray

        // function that modifies the elements of an array

 

        function modifyArray( theArray )

{

for (     var j in            theArray )      

theArray[ j      ] *= 2; 

} // end            function modifyArray

        // function that modifies the value passed

 

        function modifyElement( e )

{

e *= 2; //          scales element e only for the duration of the

//          function

        document.writeln( "<br />value in modifyElement: " + e );

 

        } // end function modifyElement

        // -->

 

</script>

      </head><body></body>

 

</html>


Fig. 10.8 | Passing arrays and individual array elements to functions.

 

For a function to receive an Array through a function call, the function’s parameter list must specify a parameter that will refer to the Array in the body of the function. Unlike other programming languages, JavaScript does not provide a special syntax for this pur-pose. JavaScript simply requires that the identifier for the Array be specified in the param-eter list. For example, the function header for function modifyArray might be written as

 

function modifyArray( b )

 

indicating that modifyArray expects to receive a parameter named b (the argument sup-plied in the calling function must be an Array). Arrays are passed by reference, and there-fore when the called function uses the array name b, it refers to the actual array in the caller (array hourlyTemperatures in the preceding call). The script in Fig. 10.8 demonstrates the difference between passing an entire array and passing an array element.

The statement in line 17 invokes function outputArray to display the contents of array a before it is modified. Function outputArray (defined in lines 32–36) receives a string to output and the array to output. The statement in lines 34–35 uses Array method join to create a string containing all the elements in theArray. Method join takes as its argument a string containing the separator that should be used to separate the elements of the array in the string that is returned. If the argument is not specified, the empty string is used as the separator.

 

Line 19 invokes function modifyArray (lines 39–43) and passes it array a. The modifyArray function multiplies each element by 2. To illustrate that array a’s elements were modified, the statement in line 21 invokes function outputArray again to display the contents of array a after it is modified. As the screen capture shows, the elements of a are indeed modified by modifyArray.

 

To show the value of a[ 3 ] before the call to modifyElement, line 25 outputs the value of a[ 3 ]. Line 27 invokes modifyElement (lines 46–51) and passes a[ 3 ] as the argument. Remember that a[ 3 ] actually is one integer value in the array a. Also remember that numeric values and boolean values are always passed to functions by value. Therefore, a copy of a[ 3 ] is passed. Function modifyElement multiplies its argument by 2 and stores the result in its parameter e. The parameter of function modifyElement is a local variable in that function, so when the function terminates, the local variable is no longer accessible. Thus, when control is returned to the main script, the unmodified value of a[ 3 ] is displayed by the statement in line 29.

 

Study Material, Lecturing Notes, Assignment, Reference, Wiki description explanation, brief detail


Copyright © 2018-2020 BrainKart.com; All Rights Reserved. Developed by Therithal info, Chennai.