JavaScript-Folder/Hoisting.html at main · researcher-program/JavaScript-Folder · GitHub

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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>  Scope | JavaScript | Al- Arafat </title>
</head>
<body>
    <H1> Assalamualaikum Or-Rohmatullah </H1>
    <H2> Al -  Arafat </H2>
</body>
<script src="Hoisting.js"></script>
<script src="test-14.js"></script>
<script>
    // Type-1:


                // Scope level and mini hoisting in javascript:

        //This is some Kind of "Closure" :
        //Nested Scope :
    function one() {
        const username = "Arafat"
        function two() {
            const website = "Youtube"
            console.log(username);
        }
        // console.log(website); // This is Getting "Error",because This "console.log(website)" inside the "function two(){}".
        two(); // But if I comment Out Of "two()" function then not execute of "console.log(username)".
    }
    one();
    /*
Or,
    Same Things of "if-else":
*/
    if (true) {
        const username = "Arafat"
        if (username==="Arafat") {
            const website = " youtube"
            console.log(username+website);


        }
        // console.log(website); // This is Getting "Error",because This "console.log(website)" inside the "second scope{}".
    }
    // console.log(username); // This is Getting "Error",because This "console.log(username)" inside the "first scope{}".

    // Interesting Example :
        //Type :- 01
    function addOne(num) {
        return num + 1
    }
    addOne(5)

/*
    Same Thing Different Type:
*/
        //Type :- 02
const addTwo = function (num) {
        return num + 2
    }
    addTwo(5)
        //Type :- 03
addThree(5)
    console.log(addThree(5));
function addThree(num) {
        return num + 1
    }
     //Type :- 04

    addFour(5) // Now given to the error... Because This Problem seems to "Hoisting"
    const addFour = function(num) {
        return num + 2
    }


</script>
<script>
        // Type-2:

        function one() {
        const username = "Arafat"
        function two() {
            const website = "Youtube"
            console.log(username);
        }
        // console.log(website); // This is Getting "Error",because This "console.log(website)" inside the "function two(){}".
        two(); // But if I comment Out Of "two()" function then not execute of "console.log(username)".
    }
    // one();

    if (true) {
        const username = "Arafat"
        if (username==="Arafat") {
            const website = " youtube"
            // console.log(username+website);


        }
        // console.log(website); // This is Getting "Error",because This "console.log(website)" inside the "second scope{}".
    }
    // console.log(username); // This is Getting "Error",because This "console.log(username)" inside the "first scope{}".


    function addOne(num) {
        // console.log(num);

        // console.log(addOne); // [Function: addOne] (Not Unexpected!!!)

        return num + 1

        // console.log(num);
        // console.log(addOne);
        // [return এর পরে কোনো কিছুই print / console.log হয় না ]
    }
    // console.log(num); //ReferenceError: num is not defined (As I Expected!!!)
    // console.log(addOne); // [Function: addOne] (Not Unexpected!!!)

    // addOne(5)
    // addOne(5)

    const addTwo = function (num) {
        // console.log(addTwo(7)); // RangeError: Maximum call stack size exceeded
        // console.log(addTwo);
        // console.log(num); // "undefined" For   'console.log(addTwo());'

        return num + 2
        // console.log(addTwo);
        // console.log(num);
    }
    // console.log(addTwo);
        // console.log(num);
        // console.log(addTwo()); //NaN  // এটার জন্যে Undefined , NaN,7 আসে...!
        // console.log(addTwo(8));
    // addTwo(7)


    addThree(5)
    // console.log(addThree(5));
function addThree(num) {
        return num + 1
    }
    // addThree(5)
    // [ এখানে " Error " না আসার কারন হল ' Access:addFour(5) ' আগে  করা হয় নাই  " Declaration: const addFour = " এর পূর্বে ! ]


/*
    // addFour(5) // Now given to the error... Because This Problem seems to "Hoisting" // ReferenceError: Cannot access 'addFour' before initialization
    const addFour = function(num) {
        return num + 2
    }

    // [ এখানে " Error " আসার কারন হল ' Access:addFour(5) ' আগেই করা হয়েছে " Declaration: const addFour = " এর পূর্বে ! ]
*/
</script>

</html>