1. Array Methods © Copyright 2014, Fred McClurg All Rights Reserved

2. Manipulating Arrays Examples: var city = [ "Santa Fe", "Cedar Rapids" ]; // overwrite first element city[0] = "Des Moines"; // append element to array end city[city.length] = "Iowa City"; // display entire array console.log( city ); 2 manipArray.html

3. Array Method: pop() Discussion: Array method “pop()” removes the last element from the array. Example: var marx = [ "Chico", "Harpo", "Groucho", "Gummo", "Zeppo" ]; console.log( "Array before pop: " + marx ); // remove last element from array var youngest = marx.pop(); // "Zeppo" console.log( "Returned from pop(): " + youngest ); console.log( "Array after pop(): " + marx ); 3 arrayPop.html

4. Array Method: push() Discussion: The method “push()” appends an element to the end of an array. Example: var marx = [ "Chico", "Harpo" ]; console.log( "Original array: " + marx ); // append element to array end marx.push( "Grocho" ); console.log( "After push(): " + marx ); 4 arrayPush.html

5. Discussion: The method “shift()” removes the first element from an array. Example: var bears = [ "Goldilocks", "Mama", "Papa" ]; console.log( "Original array: " + bears ); // remove first element from array var girl = bears.shift(); // "Goldilocks" console.log( "Returned from shift(): " + girl ); console.log( "Array after shift(): " + bears ); Array Method: shift() 5 arrayShift.html

6. Array Method: unshift() Discussion: The method “unshift()” adds an element to the beginning of the array. Example: var bears = [ "Mama", "Papa" ]; console.log( "Original array: " + bears ); // insert first element into array bears.unshift( "Baby" ); console.log( "After unshift(): " + bears ); 6 arrayUnshift.html

7. Array Method: splice() Discussion: This method adds or removes elements from an array. Example: var taylor = [ "Andy", "Barney", "Gomer", "Aunt Bee", "Opie", ]; console.log( "Original array: " + taylor ); // starting at taylor[1] remove two elements deputy = taylor.splice( 1, 2 ); console.log( "Array after splice(1, 2): " + taylor ); console.log( "Returned by splice(1, 2): " + deputy ); 7 arraySplice.html

8. Array Method: slice() Discussion: Selects elements from an the array but does not modify the original array. Example: var hecks = [ "Mike", "Frankie", "Axl", "Sue", "Brick" ]; // copy "Axl" and "Sue" var oldestKids = hecks.slice(2, 4); console.log( "hecks: " + hecks ); console.log( "oldestKids: " + oldestKids ); 8 arraySort.html

9. Array Method: sort() Discussion: This method sorts the elements of the array. Example: var dwarfs = [ "Doc", "Grumpy", "Happy", "Sleepy", "Bashful", "Sneezy", "Dopey" ]; console.log( "Original array: " + dwarfs ); dwarfs.sort(); console.log( "Array after sort(): " + dwarfs ); 9 arraySort.html

10. Array “Copy by Reference” Discussion: Array assignment performs a “copy by reference”. The array values are not copied. The new array reference is actually just a pointer to the original array. In addition, the two arrays point to the same location in memory. This means that modifying reference copy is the same as modifying the original array. 10

11. Array “Copy by Reference” Example Example: var brady = [ "Mike", "Greg", "Peter", "Bobby", "Carol", "Marcia", "Jan", "Cindy" ]; var twins = brady; // copy the array reference console.log( "brady before sort(): " + brady ); console.log( "twins before sort(): " + twins ); brady.sort(); // sort the original array console.log( "brady after sort(): " + brady ); console.log( "twins after sort(): " + twins ); 11 arrayCopyByRef.html

12. Array “Copy by Value” Discussion: In order to preserve the content of an original array, a “copy by value” operation should be performed on the duplicate array. This will result in two identical arrays being created that are in two different locations in memory. 12

13. Array “Copy by Value” Example Example: var brady = [ "Mike", "Greg", "Peter", "Bobby", "Carol", "Marcia", "Jan", "Cindy" ]; var clones = brady.slice(0); // copy array values console.log( "brady before sort(): " + brady ); console.log( "clones before sort(): " + clones ); brady.sort(); // sort the original array console.log( "brady after sort(): " + brady ); console.log( "clones after sort(): " + clones ); 13 arrayCopyByValue.html

14. Discussion: Split breaks an string into array elements. Reverse changes the array order. Join combines array elements back into a string. Example (convert string to backwards): var word = "stressed"; console.log( "Original word: " + word ); var letters = word.split( "" ); // convert string to array console.log( "Array after split(): " + letters ); letters.reverse(); // reverse array order console.log( "Array after reverse(): " + letters ); var backward = letters.join( "" ); // convert array to str console.log( "Word after join(): " + backward ); Array Methods: split(), reverse(), join() 14 arraySplitRevJoin.html