You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 5_Hoisting_and_Closure/HoistingAndClosure.md
+50-8Lines changed: 50 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,14 +1,26 @@
1
1
### Hoisting
2
2
3
-
Bringing the variables to the top of the scope.
3
+
In JavaScript, hoisting is the behavior of moving declarations to the top of the current scope. In other words, when the code is executed, declarations are processed before any code is executed. This means that you can use a variable or function before it has been declared.
4
4
5
-
Only the variable declaration gets to the top.
5
+
For example, consider the following code:
6
6
7
7
```js
8
-
console.log(age); // undefined will be displayed
9
-
varage=12;
8
+
Copy codeconsole.log(x); // undefined
9
+
varx=10;
10
10
```
11
11
12
+
Even though `x` is defined on the second line, it is still accessible on the first line because of hoisting. The declarations are moved to the top of the current scope, so the code is effectively rewritten as:
13
+
14
+
```js
15
+
Copy codevar x;
16
+
console.log(x); // undefined
17
+
x =10;
18
+
```
19
+
20
+
This behavior is specific to declarations (e.g. `var`, `let`, and `const`). Assignments and other code are not affected by hoisting.
21
+
22
+
It is generally a good idea to declare all variables at the top of their respective scopes to avoid any confusion or unexpected behavior related to hoisting.
23
+
12
24
```js
13
25
hoist();
14
26
@@ -20,7 +32,7 @@ function hoist() {
20
32
}
21
33
```
22
34
23
-
With modern JavaScript we can avoid Hoisting, in the below code we are making use of let and const.
35
+
With modern JavaScript we can avoid Hoisting, in the code below we are making use of let and const.
24
36
25
37
```js
26
38
console.log(age); // undeclared error
@@ -39,13 +51,43 @@ const hoist = () => {
39
51
};
40
52
```
41
53
54
+
### Closure
42
55
56
+
In JavaScript, a closure is a function that has access to the outer (enclosing) function's variables—scope chain—even after the outer function has returned.
43
57
44
-
### Closure
58
+
Here is an example of a closure in JavaScript:
59
+
60
+
```js
61
+
functionouterFunction(x) {
62
+
returnfunctioninnerFunction(y) {
63
+
return x + y;
64
+
}
65
+
}
66
+
67
+
constadd5=outerFunction(5);
68
+
console.log(add5(3)); // 8
69
+
```
70
+
71
+
In this example, the `innerFunction` has access to the `x` variable from the outer function even after the outer function has returned. The `innerFunction` is said to close over the variables from the outer function.
72
+
73
+
Closures are often used to create private variables in JavaScript. For example:
74
+
75
+
```js
76
+
functioncounter() {
77
+
let count =0;
78
+
returnfunction() {
79
+
return++count;
80
+
}
81
+
}
82
+
83
+
constmyCounter=counter();
84
+
console.log(myCounter()); // 1
85
+
console.log(myCounter()); // 2
86
+
```
45
87
46
-
Closure gives you an outer function scope through the inner function.
88
+
In this example, the `count` variable is not accessible from outside the `counter`function, but the inner function returned by `counter` has access to it. This allows the inner function to maintain state across multiple invocations.
47
89
48
-
Below Code shows how JavaScript takes care of the scope.
90
+
Closures are an important concept in JavaScript and are commonly used in many different types of code.
Copy file name to clipboardExpand all lines: 7_Arrays_in_detail/Arrays.md
+1Lines changed: 1 addition & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -191,3 +191,4 @@ const total = groceryList.reduce((total, price) => total + price, 0);
191
191
console.log(total); // 318
192
192
```
193
193
194
+
All the code blocks above demonstrates how to use arrays and various array methods in JavaScript. An array is an object that represents a collection of similar type of elements. The code first defines an array `months` and then uses a `for` loop to iterate over the array, printing each element to the console. The code then demonstrates several array methods including `push`, `pop`, `shift`, `unshift`, `splice`, `slice`, `forEach`, `map`, `filter`, and `find`. The `push` method adds a new element to the end of the array, the `pop` method removes the last element of an array, the `shift` method removes the first element of an array, the `unshift` method adds a new value to the start of the array, the `splice` method adds or removes elements in any position of the array, the `slice` method copies a certain part of an array into a new array, the `forEach` method executes a provided function once for each array element, the `map` method creates a new array with the results of calling a provided function on every element in the array, the `filter` method creates a new array with all elements that pass the test implemented by the provided function, and the `find` method returns the first element in the array that satisfies a provided testing function.
Copy file name to clipboardExpand all lines: 8_Objects_in_detail/objects.md
+17-6Lines changed: 17 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -3,10 +3,6 @@
3
3
#### Creating an Object
4
4
5
5
```js
6
-
// object is an unordered collection
7
-
// of related date in form of
8
-
// key value pair
9
-
10
6
constperson= {
11
7
firstName:"Shubham",
12
8
lastName:"Kadam",
@@ -18,9 +14,11 @@ const person = {
18
14
};
19
15
```
20
16
17
+
The first block of code shows how to create a new object using object literal syntax. An object literal is a list of key-value pairs enclosed in curly braces `{}`. The keys are represented by strings, and the values can be any data type (strings, numbers, arrays, etc).
18
+
21
19
#### The Dot and Square Notation
22
20
23
-
```
21
+
```js
24
22
// Dot notation
25
23
constperson= {
26
24
firstName:"Shubham",
@@ -40,7 +38,11 @@ const property = "age";
40
38
console.log(person[property]); // 23
41
39
```
42
40
43
-
#### Built-in-Methods
41
+
The above code demonstrates two ways to access and modify the properties of an object: dot notation and square bracket notation.
42
+
43
+
With dot notation, you can access or set a property of an object using a dot (`.`) followed by the property name. For example, `person.age = 23` sets the `age` property of the `person` object to 23.
44
+
45
+
With square bracket notation, you can access or set a property using a string inside square brackets (`[]`). For example, `person['age'] = 23` sets the `age` property of the `person` object to 23.
44
46
45
47
```js
46
48
constdog= {
@@ -64,6 +66,8 @@ const car = {
64
66
car.Details(); // Lambo 2019
65
67
```
66
68
69
+
`this` notation is useful when you need to access a property whose name is stored in a variable.
The above block of code demonstrates four methods that are built into JavaScript: `Object.keys()`, `Object.values()`, `Object.entries()`, and `Object.freeze()`.
145
+
146
+
-`Object.keys()` creates an array containing the keys (property names) of an object.
147
+
-`Object.values()` creates an array containing the values of an object.
148
+
-`Object.entries()` is a built-in JavaScript method that returns an array of an object's own enumerable string-keyed property [key, value] pairs, in the same order as that provided by a for...in loop (the difference being that a for-in loop enumerates properties in the prototype chain as well).
149
+
-`Object.freeze()` is a method in JavaScript that prevents an object from being modified. It makes the object's properties and values read-only, and prevents new properties from being added, removed, or modified. Once an object is frozen, you can no longer change its properties or values, and you cannot add or remove properties from the object.
// The behaviour is same even with respect to objects.
17
12
```
18
13
14
+
The first block of code demonstrates how variables in JavaScript can be copied by reference, rather than by value. When you assign an array or object to a new variable, the new variable is simply a reference to the original array or object. This means that any changes made to the original array or object will also be reflected in the copied variable, because they are both pointing to the same memory location.
A shallow copy is a copy that only includes the top-level properties of the original array or object, rather than copying all nested properties as well.
64
+
65
+
The first way to create a shallow copy is to use the spread operator (`...`). This creates a new array or object with the same properties as the original, but they are not nested. The second way to create a shallow copy is to use the `Array.slice()` or `Object.assign()` methods. These methods work similarly to the spread operator, but they are more specific to arrays and objects, respectively.
66
+
69
67
#### Deep Cloning
70
68
71
69
```js
72
70
// Deep Cloning
73
-
// We can create a shallow copy of person object
74
-
// but we have to do it for all the inner objects as well.
75
-
// To solve this we can do a deep cloning where we make
A deep copy is a copy that includes all nested properties of the original object, rather than just the top-level properties.
90
+
91
+
To create a deep copy, the code uses the `JSON.stringify()` and `JSON.parse()` methods. `JSON.stringify()` converts an object to a JSON string, which is a format that can be easily stored or transmitted. `JSON.parse()` converts a JSON string back into an object.
92
+
93
+
By using these methods, the code is able to create a deep copy of the original object, which can be modified independently without affecting the original object.
0 commit comments