01219245/javascript1/tutorial3/2
Your current JavaScript program in the script block probably look like this:
var numSticks = 21;
function pickSticks() {
var num = parseInt( $( "#pickNum" ).val() );
numSticks -= num;
$( "#numSticks" ).text( numSticks );
}
$(function(){
$("#pickButton").click(pickSticks);
});
เนื้อหา
Valid number of sticks
Let's add the code that check that the number of sticks the player want to take is valid, i.e., it is between 1 to 3 and is no larger than the current number of sticks. Let's assume that the input is an integer for now (i.e., that the user won't enter 1.5). If the amount is invalid, let's throw an alert for now.
function pickSticks() {
var num = parseInt( $( "#pickNum" ).val() );
if ( ( num >= 1 ) && ( num <= 3 ) && ( num <= numSticks ) ) {
numSticks -= num;
$( "#numSticks" ).text( numSticks );
} else {
alert( "Invalid amount. Please try again" );
}
}
The code is getting harder to read, so let's try to clean it up a bit. To make it clearer, we shall extract the code for validating conditions to a new function. Function pickStick and the new function is shown below:
function isValidPickNum( num, numSticks ) {
return ( num >= 1 ) && ( num <= 3 ) && ( num <= numSticks );
}
function pickSticks() {
var num = parseInt( $( "#pickNum" ).val() );
if ( isValidPickNum( num, numSticks ) ) {
numSticks -= num;
$( "#numSticks" ).text( numSticks );
} else {
alert( "Invalid amount. Please try again" );
}
}
A randomized computer player
It is time to introduce the computer player. At this point we just want something that plays, so let's write a simple player that only random a number between 1 to 3. We shall write that as a function and call it in pickSticks
EXERCISE Write function computerPickAmount.
function computerPickAmount() {
// EXERCISE: write this function
}
function pickSticks() {
var num = parseInt( $( "#pickNum" ).val() );
if ( isValidPickNum( num, numSticks ) ) {
numSticks -= num;
$( "#numSticks" ).text( numSticks );
numSticks -= computerPickAmount();
$( "#numSticks" ).text( numSticks );
} else {
alert( "Invalid amount. Please try again" );
}
}
Try it to see if the number of sticks decreases more than the number you enter. While this should indicate that computerPickAmount does something. How can we be sure that function computerPickAmount works fine?