70 likes | 82 Views
Learn about programmer-defined functions, function calls with arguments and return values, as well as scope rules in JavaScript programming for web applications development.
E N D
Chapter 10: JavaScript Functions CIS 275—Web Application Development for Business I
Program Modules in JavaScript • Software development is best achieved in smaller pieces called _________, applying the principle of “divide and conquer”. • A module in JavaScript is called a _________. • A pre-defined function that belongs to a class is called a method (like Math.pow or Math.round). • A function you write is called a ____________-defined function. • A function is invoked by a function call. • A function call may include arguments. • A called function may _______ data to the caller.
Programmer-Defined Functions • All variables declared in a function are _______. • A function declaration may include parameters, which are also local variables. • Functions enable the principle of software reuse and help to avoid code repetition. • Format of a function definition function function-name( parameter-list) { declarations and statements } • The ___ is the function call operator. • The first line is the function declaration and the content within the {}’s is the function ______. ()
<html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title>A Programmer-Defined Function</title> <script type = "text/javascript"> document.writeln( "<h1>Square numbers from 1 to 10</h1>" ); for ( var x = 1; x <= 10; ++x ) document.writeln( "The square of " + x + " is " +square( x )+ "<br />" ); function square( y ) // do NOT use var here { return y * y; } </script> </head> <body></body> </html> Fig. 10.2
Example of a Function Call <html> <head> <script type="text/javascript"> function myFunction(){ alert("HELLO") } </script> </head> <body> <form> <input type = "button" onclick = "myFunction()" value = "Call function" > </form> <p>By pressing the button, a function will be called. The function will alert a message.</p> </body> </html>
Function Call w/ Arguments and Return <?xml version = "1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <script type="text/javascript"> function total(numberA, numberB){ return numberA + numberB } </script> </head> <body> <script type="text/javascript"> document.write( total(2,3) ) </script> </body> </html>
10.8 Scope Rules • The scope of an identifier for a variable or function is the part of the program in which the identifier can be referenced. • Variables declared in the ______ element are global variables and have global scope. • Variables declared inside a function have ______ scope and can be used only in that function. • Function parameters also have local scope. • A variable with local scope will ______ a variable with the same name that has global scope.