1 Java Script Functions Ahmad Al Kawam 2

2 Introduction • Programs that solve real-world programs ▫ More complex than programs from

3 Program Modules in Java. Script • functions – Java. Script modules • Java.

4 Program Modules in Java. Script • Programmer-defined functions ▫ Written by programmer to

5 Programmer-Defined Functions • Functions allow program modularization • Variables declared in function are

6 Programmer-Defined Functions • Motives for modularizing a program with functions 1. Makes program

7 Programmer-Defined Functions • Naming functions ▫ Choose concise names which describe what function

8 Function Definitions • Function-definition format function-name ( parameter-list ) { Declarations and Statements

11 Function Definitions • Method Math. max( y, z ) ▫ Returns larger of

30 31 32 33 34 35 </HEAD> <BODY> <P>Click Refresh (or Reload) to run

15 Random Number Generation • Commonly used in simulations and gaming • Method Math.

18 Example: A Game of Chance • Program can also receive input from user

19 Example: A Game of Chance • GUI Setup: ▫ GUI is enclosed inside

20 Example: A Game of Chance ▫ Output data to form elements Within a

21 Example: A Game of Chance • Rules of “craps” ▫ Player rolls 2

34 35 36 37 38 39 40 41 42 43 44 45 46 47

67 var die 1, die 2, work. Sum; 68 69 die 1 = Math.

25 Script Output 1 (player wins first roll)

26 Script Output 2 (player loses first roll)

27 Script Output 3 (player wins on second roll) Roll 1 Roll 2

28 Script Output 4 (player loses on second roll) Roll 1 Roll 2

Slides: 28

Download presentation

1 Java. Script: Functions Ahmad Al Kawam

2 Introduction • Programs that solve real-world programs ▫ More complex than programs from previous chapters • Best way to develop & maintain large program: ▫ Construct from small, simple pieces called modules ▫ Technique called divide and conquer

3 Program Modules in Java. Script • functions – Java. Script modules • Java. Script programs written by combining ▫ Functions programmer writes ▫ “prepackaged” functions and objects in Java. Script These functions often called methods Implies function belongs to particular object • Java. Script provides several rich objects for performing ▫ ▫ Common mathematical operations String manipulation Date and time manipulation Manipulations of arrays

4 Program Modules in Java. Script • Programmer-defined functions ▫ Written by programmer to define specific tasks ▫ Statements defining functions written once ▫ Statements are hidden from other functions • Function is invoked by a function call ▫ Specifies function name ▫ Provides information (or arguments) function needs for execution • Function call syntax: function. Name( argument );

5 Programmer-Defined Functions • Functions allow program modularization • Variables declared in function are local variables ▫ Only known inside function in which defined • Most functions have list of parameters ▫ Means for communicating info between functions & function calls ▫ Local variables ▫ When function called, arguments assigned to parameters in function definition

6 Programmer-Defined Functions • Motives for modularizing a program with functions 1. Makes program development more manageable 2. Allows software reusability 3. Avoid repeating code in program Do not re-invent the wheel Save time

7 Programmer-Defined Functions • Naming functions ▫ Choose concise names which describe what function does ▫ If not possible to describe briefly, your function is too complex

8 Function Definitions • Function-definition format function-name ( parameter-list ) { Declarations and Statements }

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <!DOCTYPE html PUBLIC "-//W 3 C//DTD HTML 4. 0 Transitional//EN" > <HTML>  <HEAD> <TITLE>A Programmer-Defined square Function </TITLE> <SCRIPT LANGUAGE = "Java. Script"> document. writeln( "<H 1>Square the numbers from 1 to 10</H 1>" ); // square the numbers from 1 to 10 for ( var x = 1; x <= 10; ++x ) document. writeln( "The square of " + x + " is " + square( x ) + "<BR>" ); // The following square function's body is executed only // when the function is explicitly called. // square function definition function square( y ) { return y * y; } </SCRIPT> </HEAD><BODY></BODY> </HTML> 1. 1 Output HTML 2. 1 Open for control structure 2. 2 Call square userdefined function 3. 1 Define square function 3. 2 Return result

10 Script Output

11 Function Definitions • Method Math. max( y, z ) ▫ Returns larger of the two values inputted • When writing a function, do not ▫ Forget to return a value if function is supposed to return a value ▫ Forget to surround the function body with braces ▫ Pass an argument to function that is not compatible with expected data type

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 <!DOCTYPE html PUBLIC "-//W 3 C//DTD HTML 4. 0 Transitional//EN" > <HTML>  <HEAD> <TITLE>Finding the Maximum of Three Values </TITLE> 1. 1 Define variables and prompt user for values <SCRIPT LANGUAGE = "Java. Script"> var input 1 = window. prompt( "Enter first number", "0" ); var input 2 = window. prompt( "Enter second number", "0" ); var input 3 = window. prompt( "Enter third number", "0" ); 1. 2 Convert strings to integers var value 1 = parse. Float( input 1 ); var value 2 = parse. Float( input 2 ); var value 3 = parse. Float( input 3 ); var max. Value = maximum( value 1, value 2, value 3 ); document. writeln( "First number: " + value 1 + "<BR>Second number: " + value 2 + "<BR>Third number: " + value 3 + "<BR>Maximum is: " + max. Value ); // maximum method definition (called from line 17) function maximum( x, y, z ) { return Math. max( x, Math. max( y, z ) ); } </SCRIPT> 2. 1 Execute userdefined function max. Value 3. 1 Print results 4. 1 Define function max. Value

30 31 32 33 34 35 </HEAD> <BODY> <P>Click Refresh (or Reload) to run the script again </P> </BODY> </HTML> User Input

14 Script Output

15 Random Number Generation • Commonly used in simulations and gaming • Method Math. random ▫ Returns floating-point value between 0 and 1, inclusive ▫ Every value in the range has an equal chance (or probability) of being chosen each time random called • Math. floor( argument ); ▫ Rounds down the argument to the next integer

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 <!DOCTYPE html PUBLIC "-//W 3 C//DTD HTML 4. 0 Transitional//EN" > <HTML>  <HEAD> <TITLE>Shifted and Scaled Random Integers </TITLE> <SCRIPT LANGUAGE = "Java. Script"> var value; document. writeln( "<H 1>Random Numbers</H 1>" + "<TABLE BORDER = '1' WIDTH = '50%'><TR>" ); for ( var i = 1; i <= 20; i++ ) { value = Math. floor( 1 + Math. random() * 6 ); document. writeln( "<TD>" + value + "</TD>" ); if ( i % 5 == 0 && i != 20 ) document. writeln( "</TR><TR>" ); } document. writeln( "</TR></TABLE>" ); </SCRIPT> </HEAD> <BODY> <P>Click Refresh (or Reload) to run the script again </P> </BODY> </HTML> 1. 1 Initialize variable 2. 1 Initialize HTML TABLE 3. 1 Start for structure 3. 2 Set value to random value 3. 2. 1 Call Math. random 3. 2. 2 Set desired range for random number generation 3. 3. 3 Call Math. floor 4. 1 Print results

Script Outputs 17

18 Example: A Game of Chance • Program can also receive input from user through forms (discussed in HTML lecture) • GUI - Graphical User Interface ▫ Any user interaction with a GUI is called an event ▫ Event handling – Java. Script execution in response to an event ▫ GUI’s are located in the BODY of the HTML document

19 Example: A Game of Chance • GUI Setup: ▫ GUI is enclosed inside an HTML Form <FORM NAME=“form. Name”>…<FORM> tags ▫ Every GUI output is defined with the INPUT element <INPUT NAME = “input. Name” TYPE = “text”> ▫ Enter as many <INPUT> tags as needed ▫ Clicking on GUI button element causes an action <INPUT TYPE = “button” VALUE = “button. Label” ONCLICK = “java. Script. Function. Name”> Function indicated executed when button clicked

20 Example: A Game of Chance ▫ Output data to form elements Within a function, write a statement in the following format: form. Name. input. Name. value = variable. To. Be. Output; ▫ Browser status bar Print text by typing window. status = “text to be printed”; GUI’s can also be used for user input

21 Example: A Game of Chance • Rules of “craps” ▫ Player rolls 2 dice (6 faces/die, range: 1 -6) ▫ Sum of spots on two upward faces calculate If sum equals 7 or 11 – player wins If sum equals 2, 3 or 12 on first throw (called “craps”) – player loses If sum equals 4, 5, 6, 8, 9 or 10 on first throw – sum is players “point” ▫ If game not over after first roll, player continues rolling If rolls sum equal to his “point” – player wins if rolls 7 before matching his “point” – player loses ▫ Player continues rolling until game over

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 <!DOCTYPE html PUBLIC "-//W 3 C//DTD HTML 4. 0 Transitional//EN" > <HTML>  <HEAD> <TITLE>Program that Simulates the Game of Craps </TITLE> <SCRIPT LANGUAGE = "Java. Script"> // variables used to test the state of the game var WON = 0, LOST = 1, CONTINUE_ROLLING = 2; // other variables used in program var first. Roll = true, // true if first roll sum. Of. Dice = 0, // sum of the dice my. Point = 0, // point if no win/loss on first roll game. Status = CONTINUE_ROLLING; // game not over yet // process one roll of the dice function play() { if ( first. Roll ) { sum. Of. Dice = roll. Dice(); // first roll of the dice switch ( sum. Of. Dice ) { case 7: case 11: game. Status = WON; craps. point. value = ""; break; case 2: case 3: case 12: game. Status = LOST; craps. point. value = ""; break; default: // win on first roll // clear point field // lose on first roll // clear point field // remember point 1. 1 Initialize variables and set values 2. 1 Define function play() 2. 2 Start if structure 2. 3 Start switch structure 2. 4 Define switch case actions 2. 4. 1 Print values of dice rolled

34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 game. Status = CONTINUE_ROLLING; my. Point = sum. Of. Dice; craps. point. value = my. Point; first. Roll = false; } } else { sum. Of. Dice = roll. Dice(); if ( sum. Of. Dice == my. Point ) game. Status = WON; else if ( sum. Of. Dice == 7 ) game. Status = LOST; // win by making point if ( game. Status == CONTINUE_ROLLING ) window. status = "Roll again"; else { if ( game. Status == WON ) window. status = "Player wins. " + "Click Roll Dice to play again. "; else window. status = "Player loses. " + "Click Roll Dice to play again. "; } } // roll the dice function roll. Dice() { 2. 6 Plan for player to continue rolling indefinitely // lose by rolling 7 } first. Roll = true; 2. 5 Plan all possible dice rolls 3. 1 Define function roll. Dice()

67 var die 1, die 2, work. Sum; 68 69 die 1 = Math. floor( 1 + Math. random() * 6 ); 70 die 2 = Math. floor( 1 + Math. random() * 6 ); 71 work. Sum = die 1 + die 2; 72 73 craps. first. Die. value = die 1; 74 craps. second. Die. value = die 2; 75 craps. sum. value = work. Sum; 76 77 return work. Sum; 78 } 79</SCRIPT> 80 81</HEAD> 82<BODY> 83<FORM NAME = "craps"> 84 <TABLE BORDER = "1"> 85 <TR><TD>Die 1</TD> 86 <TD><INPUT NAME = "first. Die" TYPE = "text"></TD></TR> 87 <TR><TD>Die 2</TD> 88 <TD><INPUT NAME = "second. Die" TYPE = "text"></TD></TR> 89 <TR><TD>Sum</TD> 90 <TD><INPUT NAME = "sum" TYPE = "text"></TD></TR> 91 <TR><TD>Point</TD> 92 <TD><INPUT NAME = "point" TYPE = "text"></TD></TR> 93 <TR><TD><INPUT TYPE = "button" VALUE = "Roll Dice" 94 ONCLICK = "play()"></TD></TR> 95 </TABLE> 96</FORM> 97</BODY> 98</HTML> 3. 2 Calculate random dice rolls 3. 3 Print dice rolls 3. 4 Return dice value to function call 4. 1 Set FORM GUI structure 4. 2 Define INPUT fields 4. 3 Define BUTTON element and ONCLICK attribute

25 Script Output 1 (player wins first roll)

26 Script Output 2 (player loses first roll)

27 Script Output 3 (player wins on second roll) Roll 1 Roll 2

28 Script Output 4 (player loses on second roll) Roll 1 Roll 2