-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy path02. variable.html
180 lines (165 loc) · 5.73 KB
/
02. variable.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript 02</title>
<style>
*{
margin: 0;
padding: 0;
}
ul, ol{
margin-left: 25px;
margin-bottom: 15px;
}
body{
font-family: 'Poppins', sans-serif;
line-height: 1.8em;
}
.text-center{
text-align: center;
}
h1, h2, h3, h4{
margin: 15px 0px;
padding-bottom: 25px;
border-bottom: 1px solid #f1f1f1;
font-weight: 400;
}
code, pre, xmp {
background: #f1f1f1;
display: block;
padding: 15px;
margin: 10px auto;
border: 1px solid #ccc;
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
.container{
margin: 0 auto;
display: block;
width: 1170px;
}
p{
background: #000;
color: #fff;
padding: 5px;
border-radius: 5px;
border: 1px solid #f1f1f1;
}
</style>
<link href="https://fonts.googleapis.com/css?family=Poppins:400,700" rel="stylesheet">
</head>
<body>
<div class="container">
<h1 class="text-center">javaScript Variables</h1>
<h2 class="text-center">* How to write?</h2>
<xmp>
<script>
var avariablename = "Value of this variable";
var nextvariablename = "Value of next variable";
var anothervariablename = "Value of another variable"
document.write('<div class="text-center">',avariablename,'</div>', "<br>");
document.write('<div class="text-center">',nextvariablename,'</div>', "<br>");
document.write('<div class="text-center">',anothervariablename,'</div>', "<br>");
</script>
</xmp>
<script>
var avariablename = "Value of this variable";
var nextvariablename = "Value of next variable";
var anothervariablename = "Value of another variable"
document.write('<div class="text-center">',avariablename,'</div>', "<br>");
document.write('<div class="text-center">',nextvariablename,'</div>', "<br>");
document.write('<div class="text-center">',anothervariablename,'</div>', "<br>");
</script>
<h3 class="text-center">=> Another short way to print</h3>
<xmp>
<script>
document.write('<div class="text-center">',avariablename,'</div>', "<br>", '<div class="text-center">',nextvariablename,'</div>', "<br>", '<div class="text-center">',anothervariablename,'</div>', "<br>", );
</script>
</xmp>
<script>
document.write('<div class="text-center">',avariablename,'</div>', "<br>", '<div class="text-center">',nextvariablename,'</div>', "<br>", '<div class="text-center">',anothervariablename,'</div>', "<br>", );
</script>
<p class="text-center">
=> javaScript variables are case sencetive. It's mean if we declear variable like A = 10, and a = 20, It's mean there we called 2 variables. Not one. Example:<br>
</p>
<xmp>
<script>
var a = "LowerCase variable";
var A = "UpperCase variable";
document.write('<div class="text-center">',a,'</div>', "<br>");
document.write('<div class="text-center">',A,'</div>', "<br>");
</script>
</xmp>
<script>
var a = "LowerCase variable";
var A = "UpperCase variable";
document.write('<div class="text-center">',a,'</div>', "<br>");
document.write('<div class="text-center">',A,'</div>', "<br>");
</script>
<h2 class="text-center">* Nameing</h2>
<ol>
<li>We should use meaningful name.</li>
<li>We can use (a-z) or (A-Z) letters, (0-9) numbers, _ underscore, or $ doller sign to decleare a variable.</li>
<li>Variable name should start with letters, _ underscore, and $ doller and it can't be start with any numbers.</li>
<li>javaScript variables are case sencetive, it's mean name and NAME is totally two different variables.</li>
<li>We can't use any resurve keywords as variable name. example: var, let, function, else etc. can't be use as variable name. Check resurve keywords full list <a href="https://www.w3schools.com/js/js_reserved.asp">here</a></li>
</ol>
<p class="text-center">
Best practice for nameing is:
aLongNameHere or a_long_name_here
</p>
<h4 class="text-center">We can set value multiple time as we need. Example:</h4>
<xmp>
<script>
myAge = 22;
document.write('<div class="text-center">',myAge,'</div>', "<br>");
myAge = 25;
document.write('<div class="text-center">',myAge,'</div>', "<br>");
</script>
</xmp>
<script>
myAge = 22;
document.write('<div class="text-center">',myAge,'</div>', "<br>");
myAge = 25;
document.write('<div class="text-center">',myAge,'</div>', "<br>");
</script>
<h4 class="text-center">Print value and text</h4>
<xmp>
<script>
var country = "Bangladesh";
document.write("My country is ", country, " and I live in ", city);
</script>
</xmp>
<script>
var country = "Bangladesh";
var city = "Dhaka";
document.write('<div class="text-center">',"My country is ", country, " and I live in ", city,'</div>', "<br>");
</script>
<h2 class="text-center">* What is constant?</h2>
<p class="text-center">
Constant is another type of variable but we can't change it's value mulitple time. <strong>Example:</strong>
</p>
<script>
const pi = 3.14159;
document.write('<div class="text-center">',"Value of pi is ", pi,'</div>', "<br>");
</script>
<h2 class="text-center">* Commenting in javaScript</h2>
<xmp>
<script>
// This is single line comment
/*
This is a long
long comment
and it's have
some line
breaks.
*/
</script>
</xmp>
</div>
</body>
</html>