Embed Size (px)
Citation preview
Server versus Client-Side Programming
Server-Side Client-Side
What is JavaScript?
Embedding JavaScript in a Web Page
• To place JavaScript in a Web page use the tag: <script type=”text/javascript”>
script commands </script>
• Each script command is a single line that
indicates an action for the browser to take.• Each command ends with a semi-colon.• Place scripts anywhere. If placed in <head>, it
is immediately interpreted and run.
A Sample Command
• To write text to a Web page with JavaScript, use the command:
document.write(“text”);where text is the HTML code to be written to the Web page.
• document is an example of an object (a thing you
manipulate)• write is an example of a method (an action you
perform on the object)
Some JavaScript Syntax Rules
• JavaScript is case sensitive• JavaScript ignores most occurrences of extra white
space• In general, do not break a statement into several
lines• The + symbol used in a command combines
several text strings into a single text string, e.g.
“Rick “ + “Bournique” is the same as
“Rick Bournique”
JavaScript Variables
• A variable is a named item in a program that stores a data value
• Variables should always be declared (reserve memory)
but isn’t required by JavaScript• To declare a JavaScript variable: var variable; Example: var area, diameter;• To declare a JavaScript variable and set its initial value:
var variable = value; Example: var pi = 3.14159;• Assignment: variable = value;
Types of JavaScript Variables
• Numeric: any number, such as 13, 22.5, -77• Text: any group of text characters, such as “Hello”
or ‘Happy Holidays!’ Must be enclosed within either double or single quotations (but not both)
• Boolean:only true and false• Null: no value at all, e.g. x = null;• JavaScript is a weakly typed language. This is OK: total = 5 + 4; // 9 total = “face” + “book”; // facebook
Creating a JavaScript Function
• A function is a collection of commands that performs an action or returns a value. Good for reuse.• General form: function function_name(parameters){
JavaScript commandsreturn value;
}• Example: function CalculateArea(radius) { area = 3.14159 * radius * radius; return area; }• Functions are not required to return values.• Good practice to put all functions in <head>
Calling a JavaScript Function
• Once a function is created, you can call the function
(i.e., run it).• Example: function CalculateArea(radius) { area = 3.14159 * radius * radius; return area; }
var r = 10; a = CalculateArea(r); document.write(a);
Function is called with a parameter, r, of 10.
Placing JavaScript in an External File
• To access an external JavaScript file: <script src="url" type="text/javascript "></script> where url is the URL of the external document
Inserting Comments in JavaScript
• Commenting your code is an important practice
Debugging JavaScript
• Debugging is the process of searching code to locate a source of trouble
• Three types of errors can occur:• Load-Time Errors (also called compile-time or syntax)
Example: area = 3.14159 * radius *radius• Run-Time Errors
Example: area = 3.14159 * Radius *Radius;• Logical Errors
Example: area = 13.14159 * radius *radius;
A Useful Debugging Tool: Alert Functions
• The alert function in JavaScript displays a dialog box that shows a text message with an OK button
url = “[email protected]”; alert(url);
