Download presentation
Presentation is loading. Please wait.
1
Learning Javascript From Mr Saem www.mrsaem.com1
2
2
3
3
4
4
5
HTML CSS JavaScript www.mrsaem.com 5
6
6
7
7
8
8
9
9
10
First Script www.mrsaem.com 10
11
Add Javascript to it www.mrsaem.com 11
12
Script Position www.mrsaem.com 12
13
www.mrsaem.com 13
14
Should end with www.mrsaem.com 14
15
www.mrsaem.com 15
16
www.mrsaem.com 16
17
Not to use In-Line Script www.mrsaem.com 17
18
CSS at the Top Scripts at the bottom www.mrsaem.com 18
19
www.mrsaem.com 19
20
www.mrsaem.com 20
21
www.mrsaem.com 21
22
www.mrsaem.com 22
23
www.mrsaem.com 23
24
www.mrsaem.com 24
25
Variables www.mrsaem.com 25
26
We create variable to hold some data. So variable is a container. That works as a little piece of computer memory. www.mrsaem.com 26
27
These need to be in the lowercase. The name of the variable is up to us. No spaces are allowed while naming these. These could be letters, Numbers, _ or $ But you cannot start with a number www.mrsaem.com 27
28
www.mrsaem.com 28
29
www.mrsaem.com 29
30
www.mrsaem.com 30
31
You may split the variables into one line aswell www.mrsaem.com 31
32
www.mrsaem.com 32
33
www.mrsaem.com 33
34
You may use “ “ or ‘ ’. But do not mix them such as “ ‘ Javascript understands the data type on its own by the way we assign it. It will understand boolean /logic when we define it as true/false www.mrsaem.com 34
35
We need to ask questions so we shall use IF for that www.mrsaem.com 35
36
You will always find these in pairs if you have an opening one you will find A closing one as well. Even if it is after many multiple lines. But it needs to be there www.mrsaem.com 36
37
A All conditions should boil down into TRUE or FALSE TRUE FALSE www.mrsaem.com 37
38
oth www.mrsaem.com 38 So both are not =
39
www.mrsaem.com 39
40
www.mrsaem.com 40
41
Not equal to www.mrsaem.com 41
42
Code Block www.mrsaem.com 42
43
var amount = 500; if ( amount < 1000 ) { alert ("Its less than 1000"); } www.mrsaem.com 43
44
Using else www.mrsaem.com 44
45
www.mrsaem.com 45
46
www.mrsaem.com 46
47
www.mrsaem.com 47 = is a command. NOT a polite description We are setting a value We are assigning a value
48
www.mrsaem.com 48 OR
49
Some operators are considered more important than others eg Particularlay * and / are regarded more important than others. www.mrsaem.com 49
50
www.mrsaem.com 50
51
IF you are checking values are equal use the == operator www.mrsaem.com 51
52
www.mrsaem.com 52
53
www.mrsaem.com 53 You are telling You are asking Exactly equal
54
www.mrsaem.com 54
55
www.mrsaem.com 55 AND OR
56
www.mrsaem.com 56
57
www.mrsaem.com 57
58
www.mrsaem.com 58
59
var a=15; alert(++a); www.mrsaem.com 59 What should the output be?
60
var a=15; alert(a++); www.mrsaem.com 60 What should the output be?
61
www.mrsaem.com 61
62
www.mrsaem.com 62
63
Loops www.mrsaem.com 63
64
www.mrsaem.com 64
65
www.mrsaem.com 65
66
var a=1; while (a<10) { alert(a); } www.mrsaem.com 66 Infinite Loop Created While Loop
67
var a=1; while (a<10) { alert(a); a++; } www.mrsaem.com 67 While Loop (Output)
68
var a=100; while (a<10) { alert(a); a++; } www.mrsaem.com 68 While Loop (Output).What should it be ?
69
Do While. The output ? var a=100; do { alert(a); a++; } while (a<10); www.mrsaem.com 69
70
www.mrsaem.com 70
71
A short hand way www.mrsaem.com 71
72
www.mrsaem.com 72
73
The for loop www.mrsaem.com 73 OUTPUT
74
Three Parts of Four Loop www.mrsaem.com 74 VARIABLE DECLARATION - The first part of the loop which initializes the variable at the beginning of the loop to some value. This value is the starting point of the loop. INCREMENT STATEMENT - The increment statement is the third part of the loop. It is the part of the loop that changes the value of the variable created in the variable declaration part of the loop. The increment statement is the part of the loop which will eventually stop the loop from running. CONDITION - The second part of the loop, and it is the part that decides whether the loop will continue running or not. While the condition in the loop is TRUE, it will continue running. Once the condition becomes FALSE, the loop will stop.
75
The while loop The code within a while loop will execute while the specified condition is true. www.mrsaem.com 75
76
In the above code, a variable named num is initialized with the value of 0. The condition in the while loop is that while num is less than 25, 5 should be added to num. Once the value of num is greater than 25, the loop will stop executing. www.mrsaem.com 76 The while loop
77
The do-while loop The do-while loop is very similar to the while loop, but it does things in reverse order. The mechanism of the while loop is - while a condition is true, perform a certain action. The mechanism of the do-while loop is - perform a certain action while a condition is true. Furthermore, the code within a do-while loop will always execute at least once, even if the specified condition is false. This is because the code is executed before the condition is tested. www.mrsaem.com 77
78
Syntax: do{ execute this code; } while (condition); In the above code, a variable named num is initialized with the value of 5. The condition in the do-while loop is that while num is less than 25, 5 should be added to num. Once the value of num is greater than 25, the loop will stop executing. www.mrsaem.com 78 The do-while loop
79
Breaking out of a loop You can completely break out of a loop when it is still running. This is achieved with the break keyword. Once a loop is exited, the first statement right after it will be executed. The break keyword provides an easy way to exit a loop if an error occurs, or if you found what you were looking for www.mrsaem.com 79
80
In the above example, the for loop is set to iterate 9 times and print the current value of the variable a during each iteration. The if statement within the loop states that when the variable a is equal to 5, break out of the loop. www.mrsaem.com 80 Breaking out of a loop
81
www.mrsaem.com 81
Similar presentations
