In: Computer Science
2. The HTML document on the following page consists of JavaScript code executed when the document is loaded. It prompts the user for his/her name (first and last names) then outputs the greeting “Hello Mr. _____!” or “Hello Ms. _____!” (where _____ is the user’s last name) depending on whether the first name is recognized as a male name. (In the code, only three male names are checked; a realistic program would check many more names.) We allow for the case where the user has entered his/her middle name(s) as well (despite being prompted only for first and last names). So, when the full name is converted to an array of strings, the important elements are the one at index 0 and the last element (at index 1 or greater). Function start, invoked when the document is loaded, does most of the work. The other function, maleName, returns true if the name passed to it is recognized as a male name.
Note that, in JavaScript, strings are compared by value not by reference (as in C or C++). Thus, if str1 and str2 are strings, then
str1 == str2
compares them for equality while
str1 != str2
compares them for inequality.
In the following listing, missing code is identified by letters. These letters are repeated on the next page; you there supply the missing code.
<html>
<head>
<title>Quiz 2</title>
<script>
var maleNames = ["Albert", "John", "Chris"];
function start()
{
var name, nameArray,
greeting = "Hello ";
name = _a_____________________________________________
"John Doe" );
nameArray = _b_______________;
if ( maleName( nameArray[0] ) )
greeting = _g_______________________;
else
greeting = _d_______________________;
greeting =
greeting.concat( _e______________________________ );
greeting = greeting.concat( "!" );
window.alert( greeting );
}
function maleName( name )
{
var i = 0;
while ( _h__________________________________________ )
i ++;
if ( i == maleNames.length )
return false;
else
return true;
}
</script>
</head>
<body onload = "start()">
</body>
</html>
a Open a prompt dialog box that has the prompt
Enter your name (first and last)
and has the default value
John Doe
b Convert the string assigned to name to an array of its substrings delimited by spaces.
g Concatenate “Mr. “ to the current value of greeting (viz., “Hello “).
d Concatenate “Ms. “ to the current value of greeting (viz., “Hello “).
e The last element of array nameArray
h The condition that index i hasn’t gone beyond the end of the array maleNames and name is different from maleNames[i].
Solution:
<html>
<head>
<title>Quiz 2</title>
<script>
var maleNames = ["Albert", "John", "Chris"];
function start()
{
var name, nameArray,
greeting = "Hello ";
//
name = prompt("Enter your name (first and last): ", "John Doe");
// b
nameArray = name.split(" ");
if ( maleName( nameArray[0] ) )
// g
greeting = greeting.concat("Mr. ");
else
//d
greeting = greeting.concat("Ms. ");
// e
greeting = greeting.concat( nameArray[nameArray.length - 1] );
greeting = greeting.concat( "!" );
window.alert( greeting );
}
function maleName( name )
{
var i = 0;
// h
while ( i < maleNames.length && maleNames[i] != name )
i ++;
if ( i == maleNames.length )
return false;
else
return true;
}
</script>
</head>
<body onload="start()">
</body>
</html>
Output:
case 1: Male name entered
Case 2: Female name entered:
Code Screenshot: