-
Notifications
You must be signed in to change notification settings - Fork 0
/
blog.html
330 lines (284 loc) · 17.2 KB
/
blog.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
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
<!DOCTYPE html>
<html lang="en" data-theme="light">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Phero Tube</title>
<link rel="shortcut icon" href="images/play_icon.png" type="image/x-icon">
<!-- Daisy Link -->
<link href="https://cdn.jsdelivr.net/npm/daisyui@3.5.1/dist/full.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.tailwindcss.com"></script>
<!-- inter font -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;800&display=swap" rel="stylesheet">
</head>
<!-- tailwind custom class -->
<script>
tailwind.config = {
theme: {
extend: {
colors: {
clifford: '#da373d',
'primary-color': '#FF1F3D',
}
}
}
}
</script>
<!-- css class -->
<style>
.font-inter {
font-family: 'Inter', sans-serif;
}
</style>
<body class="font-inter container mx-auto px-5">
<header class="my-10">
<!-- Navbar -->
<div
class="navbar bg-base-100 flex flex-col md:flex-row lg:flex-row gap-5 md:gap-0 lg:gap-0 items-center justify-between">
<div>
<div>
<img class="w-full" src="images/Logo.png" alt="">
</div>
</div>
<div>
<button class="btn bg-primary-color text-white">
<a href="index.html">Home</a>
</button>
</div>
</div>
</header>
<hr class="mb-10">
<main class="mb-5">
<div class="join join-vertical w-full">
<div class="collapse collapse-arrow join-item border border-base-300">
<input type="radio" name="my-accordion-4" checked="checked" />
<div class="collapse-title text-2xl font-bold">
Discuss the scope of var, let, and const.
</div>
<div class="collapse-content">
<div class="text-justify">
<p>
In JavaScript, <span class="font-bold">'var'</span>, <span class="font-bold">'let'</span>,
and <span class="font-bold">'const'</span>. are used to declare variables, but they differ
in terms of their
scope, hoisting
behavior, and mutability. Here's a discussion of the scope of each:
</p>
<!-- Var -->
<div class="mt-5">
<span class="text-xl font-bold">
1. var:
</span> <br>
<span class="font-bold">Function-Scoped:</span> Variables declared with <span
class="font-bold">'var'</span>
have function scope,
meaning they are only
accessible within the function
in which they are defined. If a <span class="font-bold">'var'</span> variable is declared
outside of any
function, it becomes a global
variable and is
accessible throughout the entire program.
<br>
<span class="font-bold">Hoisting:</span> <span class="font-bold">'var'</span> variables are
hoisted to
the top of their function or
global scope. This means that you can access a <span class="font-bold">'var'</span> variable
before it's declared in the code, but it will have an initial value of <span
class="font-bold">'undefined'</span>.
<br>
</div>
<!-- Let-->
<div class="mt-5">
<span class="text-xl font-bold">
2. let:
</span> <br>
<span class="font-bold">Block-Scoped:</span> Variables declared with <span
class="font-bold">'let'</span> have
block scope, which means they are accessible only within the
nearest enclosing block (typically a pair of curly
braces '{}'). This makes <span class="font-bold">'let'</span> more predictable and safer
than <span class="font-bold">'var'</span>.
<br>
<span class="font-bold">Hoisting:</span> <span class="font-bold">'let'</span> variables are
also
hoisted, but unlike <span class="font-bold">'var'</span> , they are not initialized.
Accessing a <span class="font-bold">'let'</span> variable before its declaration results in
a <span class="font-bold">'ReferenceError'</span>.
<br>
</div>
<!-- const -->
<div class="mt-5">
<span class="text-xl font-bold">
1. const:
</span> <br>
<span class="font-bold">Block-Scoped:</span> Variables declared with <span
class="font-bold">'const'</span> also
have block scope, similar to <span class="font-bold">'let'</span>. They are accessible only
within the nearest
enclosing block.
<br>
<span class="font-bold">Immutable:</span> Variables declared with <span
class="font-bold">'const'</span>
are immutable, which means their
value cannot be changed once assigned. However, for
objects and arrays declared with <span class="font-bold">'const'</span>, the object or array
itself is
still mutable; you just can't
reassign the
variable to a different object or array.
<br>
</div>
<br>
<p>
In modern JavaScript, it's generally recommended to use <span
class="font-bold">'const'</span> by
default for variable declarations and
only use <span class="font-bold">'let'</span> when
you need to reassign the variable's value. Avoid using <span class="font-bold">'var'</span>
in modern
code because of its function-scoped
nature and
potential for unexpected behavior due to hoisting. Using <span
class="font-bold">'const'</span> and
<span class="font-bold">'let'</span> helps improve code readability
and
maintainability while reducing the risk of bugs.
</p>
</div>
</div>
</div>
<div class="collapse collapse-arrow join-item border border-base-300">
<input type="radio" name="my-accordion-4" />
<div class="collapse-title text-2xl font-bold">
Tell us the use cases of null and undefined
</div>
<div class="collapse-content">
<div class="text-justify">
<p>
In JavaScript, <span class="font-bold">'null'</span>and <span
class="font-bold">'undefined'</span> are two distinct values that are often used in
different contexts. Understanding their use cases is essential for
writing clean and bug-free code.
</p>
<!-- Null -->
<div class="mt-5">
<span class="text-xl font-bold">
1. null:
</span> <br>
<span class="font-bold">Intentional Absence of Value:</span> You can assign <span
class="font-bold">'null'</span>
to a variable or property to explicitly indicate that there is no value or that the value is
intentionally empty.
<br>
<span class="font-bold">As a Placeholder:</span> <span class="font-bold">'null'</span> can
be used as a placeholder for an object or value that will be assigned later in your code.
<br>
<span class="font-bold">Return Value:</span> Functions can return <span
class="font-bold">'null'</span> to indicate that they didn't produce a valid result.
<br>
</div>
<!-- undefined-->
<div class="mt-5">
<span class="text-xl font-bold">
2. undefined:
</span> <br>
<span class="font-bold">Implicit Absence of Value:</span> <span
class="font-bold">'undefined'</span> represents the absence of a value in a variable or
property when it has not been assigned any value. It's often the
default value for uninitialized variables.
<br>
<span class="font-bold">Function Parameters:</span> If a function is called with fewer
arguments than it expects, the missing arguments will be <span
class="font-bold">'undefined'</span>.
<br>
<span class="font-bold">Return Value:</span> Functions that don't explicitly return a value
will return <span class="font-bold">'undefined'</span>.
<br>
<span class="font-bold">Accessing Non-existent Properties:</span> When you try to access a
property that doesn't exist in an object, you'll get <span
class="font-bold">'undefined'</span>.
</div>
<br>
<p>
In summary, <span class="font-bold">'null'</span> is typically used to represent an
intentional absence of a value or as a
placeholder, while <span class="font-bold">'undefined'</span>
indicates that a variable or property has not been assigned a value or when accessing
non-existent properties. It's
important to understand these distinctions to write clean and predictable JavaScript code.
</p>
</div>
</div>
</div>
<div class="collapse collapse-arrow join-item border border-base-300">
<input type="radio" name="my-accordion-4" />
<div class="collapse-title text-2xl font-bold">
What do you mean by REST API?
</div>
<div class="collapse-content">
<div class="text-justify">
<p>
REST API stands for Representational State Transfer Application Programming Interface. It is
an architectural style for
designing networked applications, and it has become the predominant approach for building
web services and APIs
(Application Programming Interfaces) on the internet. REST is not a specific technology or
protocol but rather a set of
constraints and principles that guide how web services should be structured and interact
with each other. <br><br>
<span class="font-bold">
Key principles and characteristics of RESTful APIs include:
</span> <br><br>
<span class="font-bold">1. Stateless:</span> Each request from a client to a server must
contain all the information needed to understand and process the request.
The server does not store any client state between requests. This makes APIs scalable and
easy to manage.<br>
<span class="font-bold">2. Client-Server Architecture:</span> REST separates the client (the
consumer of the API) and the server (the provider of the API) into distinct entities.
This separation allows for better scalability and independence of the two.<br>
<span class="font-bold">3. Resource-Based:</span> In REST, resources are the key
abstractions. Resources are identified by URIs (Uniform Resource Identifiers), and
clients interact with these resources using standard HTTP methods like GET (retrieve data),
POST (create new data), PUT
(update data), and DELETE (remove data).<br>
<span class="font-bold">4. Representation:</span> Resources can have multiple
representations (e.g., JSON, XML, HTML) to accommodate the needs of different clients.
Clients can specify the desired representation using HTTP headers.<br>
<span class="font-bold">5. Statelessness:</span> Each request to the server must be
self-contained and include all the necessary information. The server does not store
information about the client's state between requests.<br>
<span class="font-bold">6. HTTP Methods:</span> RESTful APIs often use HTTP methods to
perform actions on resources. For example, GET to retrieve data, POST to create
data, PUT to update data, and DELETE to remove data.<br>
<span class="font-bold">7. Stateless Communication:</span> RESTful APIs rely on stateless
communication. This means that each request from a client to a server must contain all
the information needed to understand and process the request. Servers do not store
information about the client's state
between requests.<br>
<span class="font-bold">8. Uniform Interface:</span> REST APIs follow a uniform and
consistent interface, making it easier for developers to understand and work with
different APIs.<br>
<span class="font-bold">9. Idempotent Operations:</span> Some HTTP methods, like GET and
PUT, are idempotent, meaning that if you make the same request multiple times, the
result will be the same as making it once. This property ensures that repeating requests
won't have unintended side
effects.<br>
<span class="font-bold">10. Layered System:</span> REST allows for a layered system
architecture, where each layer (e.g., load balancers, security, caching) adds its own
functionality without affecting the core logic of the API.<br><br>
RESTful APIs are widely used for building web services because of their simplicity,
scalability, and compatibility with
the HTTP protocol, which is the backbone of the World Wide Web. They are commonly used in
web and mobile applications to
retrieve, create, update, and delete data over the internet.
</p>
</div>
</div>
</div>
</div>
</main>
</body>
</html>