CS 1 - Lab 8

For this lab you will write several string processing functions.

• Create an HTML file for this lab assignment called lab8.html (See the instructions for Lab 2 if you are unsure how to do this.)

String Copy

• We will be writing a number of functions today that use loops to process strings.
• To get you started, here is the code for a string copy function:

  function CopyString( str ) {
    var copy = "";
    var i = 0;
    while( i < str.length ) {
      copy = copy + str.charAt( i );
      i = i + 1;
    }
    return copy;
  }
                    

• A few things to note about this code:
  • In the loop condition, str.length refers to the number of characters in the string.
  • In the body of the loop, str.charAt( i ), refers to the character at position i in the string.
  • The first character in the string str is at position 0, which is why we initialize i to 0.
  • The last character in the string str is at position str.length - 1 which is why our loop condition is

    i < str.length

  • We use the concatenation operator + to add each character of str to copy.
• Put this code in a script tag in the head of your html document, and add the following:
  • A text box to input a string
  • A button labelled Copy
  • A text box to output the result of copying the string
• In the onclick attribute of your button, or in a seperate function, write the code to read from the input text box, call the CopyString function, and store the result in the output text box.

String Reverse

• You may have notice that our CopyString function doesn't do anything very interesting.
• Write a function called Reverse that will take a string as an argument and return the reverse of the string.
• For example: Reverse( "Evian" ) should return the string "naivE".
• Hint: this function is very similar to CopyString, except for the concatenation part.
• Add a new button labelled Reverse that reverses the string in your input text box and stores the result in the output text box

Stripping out Spaces and Punctuation

• The following code will strip out all of the spaces and punctuation from a string called phrase:

  index = phrase.search( /[ !?.,;:='"]/ );
  while( index != -1 ) {
    phrase = phrase.substring( 0, index ) +
             phrase.substring( index + 1, phrase.length );
    index = phrase.search( /[ !?.,;:='"]/ );
  }
                    

• Some things to note about this code:
  • The first line uses the search function to find the first space or punctuation mark in the phrase.
  • The jumble of characters between the slashes is called a regular expression, and indicates which characters to look for.
  • The index variable is used to store the position of the first space or punctuation mark.
  • The first line in the body of the loop uses the substring function to make a new string without the character at index.
  • It does this by concatenating all of the characters before the index to all of the characters after the index.
  • The second line of the loop finds the position of the next space or punctuation mark
  • The loop continues until index is -1, which means that no more spaces or punctuation marks have been found.
• Write a function called Strip that uses the above code to strip the spaces from a string.
• Add a new button labelled Strip that strips the spaces and punctuation marks from the string in your input text box and stores the result in your output text box.

Palindromes

• A palindrome is a word or phrase that reads the same backward and forward:
  • Bob
  • Madam, I'm Adam
  • Able was I ere I saw Elba.
  • A man; a plan; a canal: Panama!
• Write a function called IsPalindrome that checks to see if a string is a palindrome.
• For any of the examples above this function should return true.
• For any non-palindrome this function should return false.
• Hint: Reverse, Strip, and toLowerCase will be very helpful here.
• Add a new button labelled Check Palindrome that checks if the string in the input box is a palindrome.
• If it is a palindrome, put the string "yes" the output box.
• If not put the string "no" in the output box.
• Hint: you can use a function call to your IsPalindrome function as the Boolean test of an if statement:

  if( IsPalindrome( str ) ) {
    ...
  }
                    

When you are done, upload the lab8.html file to the CS server using FileZilla. (See the instructions for Lab 1 if you are unsure how to do this)