Address Book: Sorting

Jason Atkins, Alyce Brady, Pamela Cutter, R.C. McDowell, Kelly Schultz and Nathan Sprague 1997, 1999, 2002, 2009, 2015
Kalamazoo College, Kalamazoo, MI

In previous mini-labs we have been developing an Address Book web page. A useful feature is the ability to sort the people alphabetically by name. In today's lab, we will develop a sorting function and then integrate it into the address book project.

Sorting Numbers and Strings

Start by implementing a simple selection sort that works on numbers and strings, similar to the one we discussed in class, taking advantage of the swap and findMinimum functions from the previous mini-lab. If you developed those functions in a scratch pad or another web page, copy them into the HEAD of your Address Book web page.

Exercise 1 - Selection Sort
  1. Complete the following selection sort function, using the swap and findMinimum functions. You should not copy code from the body of those functions into this function; instead, this function should include calls to swap and findMinimum.
    
    //-------------
    // selectionSort - sort an array of items
    function selectionSort(theArray) 
    {
        // REPLACE THE FOLLOWING PSEUDO-CODE WITH ACTUAL CODE
        // For each item in the array,
        //    find the smallest item in the array starting at that index and
        //    swap the current item with that smallest item. 
    }
    
    
  2. Test your function. Since the comparison operators "<" and ">" work for both strings and numbers, your sort function should work for arrays containing either. For example:

    
    var numbers = [0, -3, 22, 8];
    selectionSort(numbers);
    alert(numbers);    // Expected results: "-3,0,8,22"
    
    var strings = ["Tom", "Dick", "Harry", "Adama"];
    selectionSort(strings);
    alert(strings);    // Expected results: "Adama,Dick,Harry,Tom"
    
    

Sorting Address Objects

As it stands, the sort function you developed above will not work on an array of address records. This is because the comparison operators "<" and ">" are not able to correctly compare two address objects. What would it mean for one address object to be "less than" another? Alphabetical order of the names? Numerical order of the Zip codes? JavaScript has no way of knowing which we want. Fortunately, this is easily addressed.

Exercise 2 - Sorting Addresses
  1. Rename the function findMinimum to findMinimumName and selectionSort to sortByName. Modify the sortByName function so that it calls findMinimumName, and modify findMinimumName so that wherever it was directly comparing two array entries, it will now compare the name attributes of those two entries. For example, if your previous code included the statement:
          ...
          if (array[i] < minValue)
          ... 
    
    the new version of your code should look like:
          ...
          if (array[i].name < minValue)
          ... 
    
    Also, everyplace where you were storing a minimum value in a variable, you should now store the name attribute. For example,
          var minValue = array[startIndex];
    
    becomes
          var minValue = array[startIndex].name;
    
  2. Add a Sort button to your page. This button should have the attribute
    onclick="sortByName(AddressBookArray); buildTable('TABLE_ID', AddressBookArray)"
    
    as well as appropriate name, id and value attributes (where AddressBookArray should be the name of your array of address objects, and 'TABLE_ID'should be the id of your table element).
  3. Test your sort button. If everything is working as it should, clicking the button should cause the table of addresses to be sorted alphabetically by the name field.

If you have time...

If you have time, you can get a head-start on one of the tasks in Programming Project #2: sorting by zip code. Define a function similar to sortByName that sorts address book entries by zip code rather than by name, and create a second sorting button so that a user has the option to sort the address book by name or by zip code.