Download presentation
Presentation is loading. Please wait.
1
JavaScript Syntax and Semantics
2
Lecture Overview Core JavaScript Syntax (I will not review every nuance of the language)
3
JavaScript IS CASE SENSITIVE
4
Statements (1) Syntax is the set of rules for a language
In a programming language, programming instructions are called statements Compare a programming statement to an sentence in English A statement expresses a complete thought Statements are executed by a Web browser JavaScript statements are terminated by a semicolon (;)
5
Statements (2) Statements are composed of: Values Operators
Fixed values are called literals Changing values are called variables Operators Expressions Keywords Comments
6
Fixed (Literal) Values
Fixed values (literals) are of two types Numbers are written without quotes Do not include commas in numbers Examples 1.24 84000 Strings are surrounded by quotation marks “Hello World”
7
Variables JavaScript is not strongly typed like Java
Variables are used to store data values that can change Declare variables with the var keyword var data type is generic JavaScript is not strongly typed like Java Type conversion happens on the fly In a programming language, variables are used to store data values. JavaScript uses the var keyword to define variables. An equal sign is used to assign values to variables. In this example, x is defined as a variable. Then, x is assigned (given) the value 6:
8
Variables (Identifiers)
Variables are also called identifiers Identifier naming rules are similar to most languages First character must be a letter, underscore (_), or dollar sign ($) Subsequent characters may be letters, digits, underscores, or dollar signs
9
Variables (Example) Declare a variable named temp
var temp; Store the value 42 (a number) in the variable temp (assignment statement) temp = 42; var x; // Now x is undefined var x = 5; // Now x is a number var x = "John"; // Now x is a string
10
Variables (Scope) Like VB, there are local and global variables
Local variables are declared inside of a procedure Global variables are declared in a <script> block but outside of a procedure We usually declare these in the <head> block script so they are universally available
11
Operators The equals sign (=) is the assignment operator
Arithmetic operators are +, -, *, / as you would expect ++ is increment and -- is decrement The + operator is also the string concatenation operator % is the modulus operator though Operator precedence
12
Expressions An expression is a combination of values, variables, and operators The result of an expression is typically stored in a variable Example to add two numbers. The value 10 is stored in the variable v var v; v = 5 + 5;
13
Comments Comments appear differently inside of JavaScript block that outside of a JavaScript block The characters // on a line mark the line as a comment The strings /* and */ mark the begin and end of a multi-line comment
14
Adding Comments <html> <body> <script>
// This is a comment. /* This is a two line comment */ document.write("Greetings") </script> </body> </html>
15
Functions (Introduction)
They are the same thing as a VB function or any other programming language function Functions execute When called by another procedure When implemented as an event handler Event handlers are discussed later
16
Declaring a Function function declarations typically appear in the <head> section Naming rules are the same as for any identifier Functions execute only when explicitly called Syntax: function name(parameter –list) { statements: }
17
Declaring a Function (Example)
Declare a function named printMessage <head> <script> function printMessage(msg) { alert(msg); } </script> </head>
18
Calling a Function Functions execute when called
Call functions explicitly from other JavaScript code Call functions implicitly from an event handler
19
Calling a Function (Example)
From another function or from within another JavaScript block, call the function with it’s name an parameters Example: <script> printMessage(); </script>
20
Returning a Value from a Function
Call the return statement with an argument as in return 0;
21
Comparisons Similar to VB == is the test for equality
!= is the test for inequality The other comparison operators are the same as in VB
22
Decision-Making Again, conceptually similar to VB
{} mark blocks instead of EndIf if specifies block of code execute, if a specified condition is true else specifies a block of code execute, if the same condition is false else if specifies a new condition to test, if the first condition is false switch specifies many alternative blocks of code to be executed based on the same condition
23
Decision-Making (if) Called a one-way if
Use to conditionally execute code when a condition is true if (value < 0) { negative = true; }
24
Decision-Making (if… else)
Called a two-way if Use to conditionally execute code when a condition is true and another code block when a condition is false if (value < 0) { negative = true; } else negative = false;
25
Decision-Making (if… elseif… else)
Called a multi-way if Create multiple elseif blocks for multiple conditions
26
Loops (Introduction) VB has for loops and while loops
JavaScript works similarly although the syntax differs Again use {} to mark the beginning and end of the a block while - Executes a block of code while a condition is true (pretest loop) do/while - also loops through a block of code while a specified condition is true for - loops through a block of code a number of times (posttest loop)
27
Loops (while) First test the loop condition and execute the code block if the condition is true Syntax: while (x < 10) { x++; }
28
Loops (do while) Code block executes and then the condition is tested
Loop would execute at least once
29
Loops (for) A loop variation that can be used when the number of iterations is known in advance Statement 1 is executed before the loop starts Statement 2 defines the condition for running the loop Statement 3 is executed each time after the loop has executed
30
Loops (for) Example: for (i = 0; i < 5; i++) { text += "The number is " + i + "<br />"; }
31
Arrays (Introduction)
Like VB, arrays are used to store several values in a single variable You need not redimension arrays. JavaScript creates elements automatically Use [] as an array subscript instead of VB’s () Declare an array var months = [“Jan”, “Feb”, “Mar”, “Apr”];
32
Arrays (Referencing) Use an array to reference an array element
Same as VB except use [] instead of () var month; month = months[0];
33
Arrays (Properties and Methods)
length returns the number of elements in the array push adds an element to the end of an array
34
A Bit About Dates The JavaScript Date object allows you to work with dates You can Get parts of a date (month / day / year) Perform date arithmetic Convert strings to dates Convert dates to strings and format them Dates can be represented in local time or UTC
35
Constructors and Methods
The Date() constructor gets the current get getDay() gets the day of the week (0-6) getFullYear() gets the 4 digit year getMonth() gets the month of the year There are many other methods See
36
Type Conversion We often need to convert strings to numbers and back
Call parseFloat to convert a string to a floating-point value Call parseInt to convert a string to an integral value Both methods accept one function argument (the string to convert)
37
Type Conversion (Example)
Similar presentations
![Hello.java Program Output 1 public class Hello { 2 public static void main( String [] args ) 3 { 4 System.out.println( “Hello! ); 5 } // end method main.](/25/7902006/big_thumb.jpg "Hello.java Program Output 1 public class Hello { 2 public static void main( String [] args ) 3 { 4 System.out.println( “Hello! ); 5 } // end method main.>")
