2 6 34 SquareInt.html Calling function square and passing it the value of x. Variable y gets the value of variable x. The return statement passes the value of y * y back to the calling function."> 2 6 34 SquareInt.html Calling function square and passing it the value of x. Variable y gets the value of variable x. The return statement passes the value of y * y back to the calling function.">

Presentation is loading. Please wait.

Presentation is loading. Please wait.

JavaScript: Functions

Published byἌρης Αναγνώστου Modified over 6 years ago

Similar presentations

Presentation on theme: "JavaScript: Functions"— Presentation transcript:

1 JavaScript: Functions
main worker1 worker2 worker3 worker4 worker5 Fig. Hierarchical boss-function/worker-function relationship.

2 Calling function square and passing it the value of x.
1 <?xml version = "1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " 4 5 <!-- Fig. 10.2: SquareInt.html --> 6 <!-- Square function > 7 8 <html xmlns = " <head> <title>A Programmer-Defined square Function</title> 11 <script type = "text/javascript"> <!-- document.writeln( "<h1>Square the numbers from 1 to 10</h1>" ); 16 // square the numbers from 1 to 10 for ( var x = 1; x <= 10; ++x ) document.writeln( "The square of " + x + " is " + square( x ) + "<br />" ); 21 // The following square function's body is executed // only when the function is explicitly called. 24 // square function definition function square( y ) { return y * y; } // --> </script> 32 </head><body></body> 34 </html> SquareInt.html Calling function square and passing it the value of x. Variable y gets the value of variable x. The return statement passes the value of y * y back to the calling function.

3 Program Output

4 Prompt for the user to input three integers.
1 <?xml version = "1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " 4 5 <!-- Fig. 10.3: maximum.html --> 6 <!-- Maximum function > 7 8 <html xmlns = " <head> <title>Finding the Maximum of Three Values</title> 11 <script type = "text/javascript"> <!-- var input1 = window.prompt( "Enter first number", "0" ); var input2 = window.prompt( "Enter second number", "0" ); var input3 = window.prompt( "Enter third number", "0" ); 20 var value1 = parseFloat( input1 ); var value2 = parseFloat( input2 ); var value3 = parseFloat( input3 ); 24 var maxValue = maximum( value1, value2, value3 ); 26 document.writeln( "First number: " + value1 + "<br />Second number: " + value2 + "<br />Third number: " + value3 + "<br />Maximum is: " + maxValue ); 31 // maximum method definition (called from line 25) function maximum( x, y, z ) { return Math.max( x, Math.max( y, z ) ); Maximum.html Prompt for the user to input three integers. Call function maximum and pass it the value of variables value1, value2 and value3. Variables x, y and z get the value of variables value1, value2 and value3, respectively. Method max returns the larger of the two integers passed to it.

5 Maximum.html Program Output
} // --> </script> 39 </head> <body> <p>Click Refresh (or Reload) to run the script again</p> </body> 44 </html> Maximum.html Program Output

6 Program Output

7 The for loop creates 4 rows with 5 cells of a table.
1 <?xml version = "1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " 4 5 <!-- Fig. 10.4: RandomInt.html > 6 <!-- Demonstrating the Random method --> 7 8 <html xmlns = " <head> <title>Shifted and Scaled Random Integers</title> 11 <script type = "text/javascript"> <!-- var value; 15 document.writeln( "<table border = \"1\" width = \"50%\">" ); document.writeln( "<caption>Random Numbers</caption><tr>" ); 20 for ( var i = 1; i <= 20; i++ ) { value = Math.floor( 1 + Math.random() * 6 ); document.writeln( "<td>" + value + "</td>" ); 24 // write end and start <tr> tags when // i is a multiple of 5 and not 20 if ( i % 5 == 0 && i != 20 ) document.writeln( "</tr><tr>" ); } 30 document.writeln( "</tr></table>" ); // --> </script> 34 </head> RandomInt.html The for loop creates 4 rows with 5 cells of a table. Method floor rounds the number generated by method random down. Each cell is populated with a random number generated by method random.

8 RandomInt.html Program Output
<body> <p>Click Refresh (or Reload) to run the script again</p> </body> 39 </html> RandomInt.html Program Output

9 1 <?xml version = "1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " 4 5 <!-- Fig. 10.5: RollDie.html --> 6 <!-- Rolling a Six-Sided Die --> 7 8 <html xmlns = " <head> <title>Roll a Six-Sided Die 6000 Times</title> 11 <script type = "text/javascript"> <!-- var frequency1 = 0, frequency2 = 0, frequency3 = 0, frequency4 = 0, frequency5 = 0, frequency6 = 0, face; 17 // summarize results for ( var roll = 1; roll <= 6000; ++roll ) { face = Math.floor( 1 + Math.random() * 6 ); 21 switch ( face ) { case 1: frequency1; break; case 2: frequency2; break; case 3: frequency3; break; case 4: frequency4; break; case 5: RollDie.html This expression uses method random to generate a random number between 1 and 6. When the controlling expression, face, matches a case label, the respective frequency variable is incremented.

10 frequency5; break; case 6: frequency6; break; } } 43 document.writeln( "<table border = \"1\"" + "width = \"50%\">" ); document.writeln( "<thead><th>Face</th>" + "<th>Frequency<th></thead>" ); document.writeln( "<tbody><tr><td>1</td><td>" + frequency1 + "</td></tr>" ); document.writeln( "<tr><td>2</td><td>" + frequency2 + "</td></tr>" ); document.writeln( "<tr><td>3</td><td>" + frequency3 + "</td></tr>" ); document.writeln( "<tr><td>4</td><td>" + frequency4 + "</td></tr>" ); document.writeln( "<tr><td>5</td><td>" + frequency5 + "</td></tr>" ); document.writeln( "<tr><td>6</td><td>" + frequency6 + "</td></tr></tbody></table>" ); // --> </script> 62 </head> <body> <p>Click Refresh (or Reload) to run the script again</p> </body> 67 </html> RollDie.html The results of the dice being rolled 600 times are displayed in a table.

11 Program Output

12 To begin the program, variable x is initialized to 1.
1 <?xml version = "1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " 4 5 <!-- Fig. 10.7: scoping.html --> 6 <!-- Local and Global Variables --> 7 8 <html xmlns = " <head> <title>A Scoping Example</title> 11 <script type = "text/javascript"> <!-- var x = 1; // global variable 15 function start() { var x = 5; // variable local to function start 19 document.writeln( "local x in start is " + x ); 21 functionA(); // functionA has local x functionB(); // functionB uses global variable x functionA(); // functionA reinitializes local x functionB(); // global variable x retains its value 26 document.writeln( "<p>local x in start is " + x + "</p>" ); } 30 function functionA() { var x = 25; // initialized each time // functionA is called Scoping.html To begin the program, variable x is initialized to 1. Function start changes the value of x to 5. Function functionA changes the value of x to 25.

13 The value of x is incremented.
35 document.writeln( "<p>local x in functionA is " + x + " after entering functionA" ); x; document.writeln( "<br />local x in functionA is " + x + " before exiting functionA" + "</p>" ); } 42 function functionB() { document.writeln( "<p>global variable x is " + x + " on entering functionB" ); x *= 10; document.writeln( "<br />global variable x is " + x + " on exiting functionB" + "</p>" ); } // --> </script> 53 </head> <body onload = "start()"></body> 56 </html> Scoping.html The value of x is incremented. Function functionB multiplies the value of x by 10.

14 Program Output

Download ppt "JavaScript: Functions"

Similar presentations

JavaScript: Functions

JavaScript: Functions
 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 7 - JavaScript: Introduction to Scripting Outline 7.1 Introduction 7.2 Simple Program: Printing.

 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 7 - JavaScript: Introduction to Scripting Outline 7.1 Introduction 7.2 Simple Program: Printing.
1 JavaScript: Control Structures II. 2 whileCounter.html 1 2

1 JavaScript: Control Structures II. 2 whileCounter.html 1 2
1 Programmer-Defined Functions Functions allow program modularization Variables declared in function are local variables Only known inside function in.

1 Programmer-Defined Functions Functions allow program modularization Variables declared in function are local variables Only known inside function in.
Page 1 of 26 Javascript/Jscript Ch 7,8,9,10 Vadim Parizher Computer Science Department California State University, Northridge Spring 2003 Slides from.

Page 1 of 26 Javascript/Jscript Ch 7,8,9,10 Vadim Parizher Computer Science Department California State University, Northridge Spring 2003 Slides from.
Tutorial 12 Working with Arrays, Loops, and Conditional Statements

Tutorial 12 Working with Arrays, Loops, and Conditional Statements
Outline IS400: Development of Business Applications on the Internet Fall 2004 Instructor: Dr. Boris Jukic JavaScript: Functions Part I.

Outline IS400: Development of Business Applications on the Internet Fall 2004 Instructor: Dr. Boris Jukic JavaScript: Functions Part I.
1 JavaScript/Jscript: Arrays. 2 Introduction Arrays –Data structures consisting of related data items (collections of data items) JavaScript arrays are.

1 JavaScript/Jscript: Arrays. 2 Introduction Arrays –Data structures consisting of related data items (collections of data items) JavaScript arrays are.
1 JavaScript/Jscript 4 Functions. 2 Introduction Programs that solve real-world programs –More complex than programs from previous chapters Best way to.

1 JavaScript/Jscript 4 Functions. 2 Introduction Programs that solve real-world programs –More complex than programs from previous chapters Best way to.
Computers and Scientific Thinking David Reed, Creighton University Functions and Randomness 1.

Computers and Scientific Thinking David Reed, Creighton University Functions and Randomness 1.
 2004 Prentice Hall, Inc. All rights reserved. 1 Chapter 10 - JavaScript: Functions Outline 10.1 Introduction 10.2 Program Modules in JavaScript 10.3.

 2004 Prentice Hall, Inc. All rights reserved. 1 Chapter 10 - JavaScript: Functions Outline 10.1 Introduction 10.2 Program Modules in JavaScript 10.3.
 2000 Deitel & Associates, Inc. All rights reserved. Chapter 11 – JavaScript/Jscript: Functions Outline 11.1Introduction 11.2Program Modules in JavaScript.

 2000 Deitel & Associates, Inc. All rights reserved. Chapter 11 – JavaScript/Jscript: Functions Outline 11.1Introduction 11.2Program Modules in JavaScript.
1 JavaScript: Functions and Arrays October 18, 2005 Slides modified from Internet & World Wide Web: How to Program. 2004 (3rd) edition. By Deitel, Deitel,

1 JavaScript: Functions and Arrays October 18, 2005 Slides modified from Internet & World Wide Web: How to Program (3rd) edition. By Deitel, Deitel,
 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 8 - JavaScript: Control Structures I Outline 8.1 Introduction 8.2 Algorithms 8.3 Pseudocode 8.4.

 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 8 - JavaScript: Control Structures I Outline 8.1 Introduction 8.2 Algorithms 8.3 Pseudocode 8.4.
 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 10 - JavaScript: Functions Outline 10.1 Introduction 10.2 Program Modules in JavaScript 10.3.

 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 10 - JavaScript: Functions Outline 10.1 Introduction 10.2 Program Modules in JavaScript 10.3.
 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 7 - JavaScript: Introduction to Scripting Outline 7.1 Introduction 7.2 Simple Program: Printing.

 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 7 - JavaScript: Introduction to Scripting Outline 7.1 Introduction 7.2 Simple Program: Printing.
JavaScript: Functions ©1992-2012 by Pearson Education, Inc. All Rights Reserved.

JavaScript: Functions © by Pearson Education, Inc. All Rights Reserved.
 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 10 - JavaScript: Functions Outline 10.1 Introduction 10.2 Program Modules in JavaScript 10.3.

 2001 Prentice Hall, Inc. All rights reserved. 1 Chapter 10 - JavaScript: Functions Outline 10.1 Introduction 10.2 Program Modules in JavaScript 10.3.
 2008 Pearson Education, Inc. All rights reserved. 1 9 9 JavaScript: Functions.

 2008 Pearson Education, Inc. All rights reserved JavaScript: Functions.
Pemrograman Teknologi Internet W06: Functions and Events.

Pemrograman Teknologi Internet W06: Functions and Events.

Similar presentations

Ads by Google