JavaScript 'hoisting' [duplicate]

Multi tool use
This question already has an answer here:
Javascript function scoping and hoisting
15 answers
I came across JavaScript 'hoisting' and I didn't figure out how this snippet of code really functions:
var a = 1;
function b() {
a = 10;
return;
function a() {}
}
b();
alert(a);
I know that function declaration like ( function a() {}
) is going to be hoisted to the top of the function b
scope but it should not override the value of a
(because function declarations override variable declarations but not variable initialization) so I expected that the value of the alert would be 10 instead of 1!!
javascript hoisting
marked as duplicate by apsillers
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Jan 21 '15 at 19:37
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
add a comment |
This question already has an answer here:
Javascript function scoping and hoisting
15 answers
I came across JavaScript 'hoisting' and I didn't figure out how this snippet of code really functions:
var a = 1;
function b() {
a = 10;
return;
function a() {}
}
b();
alert(a);
I know that function declaration like ( function a() {}
) is going to be hoisted to the top of the function b
scope but it should not override the value of a
(because function declarations override variable declarations but not variable initialization) so I expected that the value of the alert would be 10 instead of 1!!
javascript hoisting
marked as duplicate by apsillers
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Jan 21 '15 at 19:37
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
Hoisting is JavaScript's default behavior of moving declarations to the top. (function declarations are "moved" from where they appear in the flow of the code to the top of the code. This gives rise to the name "Hoisting".) Read more
– M98
Sep 6 '16 at 11:51
Here is a link with easy explanation about "Function expressions vs. function declarations and Hoisting" ... gomakethings.com/function-expressions-vs-function-declarations
– S. Mayol
Oct 12 '18 at 2:12
add a comment |
This question already has an answer here:
Javascript function scoping and hoisting
15 answers
I came across JavaScript 'hoisting' and I didn't figure out how this snippet of code really functions:
var a = 1;
function b() {
a = 10;
return;
function a() {}
}
b();
alert(a);
I know that function declaration like ( function a() {}
) is going to be hoisted to the top of the function b
scope but it should not override the value of a
(because function declarations override variable declarations but not variable initialization) so I expected that the value of the alert would be 10 instead of 1!!
javascript hoisting
This question already has an answer here:
Javascript function scoping and hoisting
15 answers
I came across JavaScript 'hoisting' and I didn't figure out how this snippet of code really functions:
var a = 1;
function b() {
a = 10;
return;
function a() {}
}
b();
alert(a);
I know that function declaration like ( function a() {}
) is going to be hoisted to the top of the function b
scope but it should not override the value of a
(because function declarations override variable declarations but not variable initialization) so I expected that the value of the alert would be 10 instead of 1!!
This question already has an answer here:
Javascript function scoping and hoisting
15 answers
javascript hoisting
javascript hoisting
edited Mar 9 '13 at 13:24


0x499602D2
68.2k26120207
68.2k26120207
asked Mar 9 '13 at 13:22
morfiocemorfioce
554611
554611
marked as duplicate by apsillers
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Jan 21 '15 at 19:37
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
marked as duplicate by apsillers
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Jan 21 '15 at 19:37
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
Hoisting is JavaScript's default behavior of moving declarations to the top. (function declarations are "moved" from where they appear in the flow of the code to the top of the code. This gives rise to the name "Hoisting".) Read more
– M98
Sep 6 '16 at 11:51
Here is a link with easy explanation about "Function expressions vs. function declarations and Hoisting" ... gomakethings.com/function-expressions-vs-function-declarations
– S. Mayol
Oct 12 '18 at 2:12
add a comment |
Hoisting is JavaScript's default behavior of moving declarations to the top. (function declarations are "moved" from where they appear in the flow of the code to the top of the code. This gives rise to the name "Hoisting".) Read more
– M98
Sep 6 '16 at 11:51
Here is a link with easy explanation about "Function expressions vs. function declarations and Hoisting" ... gomakethings.com/function-expressions-vs-function-declarations
– S. Mayol
Oct 12 '18 at 2:12
Hoisting is JavaScript's default behavior of moving declarations to the top. (function declarations are "moved" from where they appear in the flow of the code to the top of the code. This gives rise to the name "Hoisting".) Read more
– M98
Sep 6 '16 at 11:51
Hoisting is JavaScript's default behavior of moving declarations to the top. (function declarations are "moved" from where they appear in the flow of the code to the top of the code. This gives rise to the name "Hoisting".) Read more
– M98
Sep 6 '16 at 11:51
Here is a link with easy explanation about "Function expressions vs. function declarations and Hoisting" ... gomakethings.com/function-expressions-vs-function-declarations
– S. Mayol
Oct 12 '18 at 2:12
Here is a link with easy explanation about "Function expressions vs. function declarations and Hoisting" ... gomakethings.com/function-expressions-vs-function-declarations
– S. Mayol
Oct 12 '18 at 2:12
add a comment |
5 Answers
5
active
oldest
votes
- The global
a
is set to1
b()
is called
function a() {}
is hoisted and creates a local variablea
that masks the globala
- The local
a
is set to10
(overwriting the functiona
) - The global
a
(still1
) is alerted
2
thank you @Quentin I was missing the fact number 3 (that function a() {} creates a local variable that masks the global a)
– morfioce
Mar 9 '13 at 13:36
@Quentin: Can you please show with code how the function would look with hoisting?
– SharpCoder
Apr 27 '14 at 15:02
@Brown_Dynamite — It looks like it looks in the question. It functions in the order described in this answer.
– Quentin
Apr 27 '14 at 15:08
So ifa
was not hoisted, calling functionb()
would seta = 10
globally,alert(a)
would then output 10? If I'm understanding correctly?
– Kenny Worden
May 27 '15 at 16:50
1
The best way to understand hoisting is to talk like a compiler, Grate
– M98
Sep 6 '16 at 11:59
add a comment |
It's because the order of compilation/interpretation in this example is somewhat misleading. The function a () {}
line is interpreted before any of the rest of the function is executed, so at the very beginning of the function, a
has the value of function a () {}
. When you reassign it to 10
, you are reassigning the value of a
in the local scope of function b()
, which is then discarded once you return, leaving the original value of a = 1
in the global scope.
You can verify this by placing alert()
s or the like in the appropriate places to see what the value of a
is at various points.
add a comment |
(1) JavaScript does not have block statement scope; rather, it will be local to the code that the block resides within.
(2) Javascript's declaration of variables in a function scope, meaning that variables declared in a function are available anywhere in that function, even before they are assigned a value.
(3) Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function parameter with the same name as a global variable, you effectively hide the global variable.
you code is same as: (read comment)
<script>
var a = 1; //global a = 1
function b() {
a = 10;
var a = 20; //local a = 20
}
b();
alert(a); //global a = 1
</script>
reference:
(1) JavaScript Variable Scope:
(2) A Dangerous Example of Javascript Hoisting
(3) Variable scope
So in your code:
var a = 1; //global a = 1
function b() {
a = 10;
return;
function a() {} //local
}
b();
alert(a); //global a = 1
where you wrote "local a Undefined" - that's actually not true. function declarations are parsed before any content of the parent scope, so in this case when you assign a = 10, you are already overriding function a() {} with value 10. See Quentin's answer
– rochal
Mar 11 '13 at 21:54
@rochal No, please read this article Javascript hoisting can be especially nefarious in loops Also check code on safari browser...let me know And Yes itsa=10
on most browser ..Actually Undefined behaviour not ERROR
– Grijesh Chauhan
Mar 12 '13 at 4:12
read point 4. from Quentin's answer. At this pointa
already exists - it's a function, not an Undefined. How would Safari be different to i.e. Chrome..?
– rochal
Mar 12 '13 at 9:08
@rochalvariables declared in a function are available anywhere in that function, even before they are assigned a value
I also checked it, and giving10
But according to three tutorials (I given link) it should be undefined and 10 is result because of undefined. Quentin answered according to output but I think it may be not 10 for some browsers..
– Grijesh Chauhan
Mar 13 '13 at 4:15
once again, in your example code:a = 10; //local a Undefined
is incorrecta = 10; //local a is function(){}
is correct because as soon as you check the value of a inside function b() it already has been overridden by the local function a(){} so your comment that "local a Undefined" is not valid. And browser has nothing to do with it, it's a language feature.
– rochal
Mar 13 '13 at 4:39
|
show 1 more comment
- function declaration
function a(){}
is hoisted first, hence in local scopea
is created. - If you have two variable with same name (one in global another in local), local variable always get precedence over global variable.
- When you set
a=10
, you are setting the local variablea
, not the global one.
Hence, the value of global variable remain same and you get, alerted 1
add a comment |
When I read the same article you did JavaScript Scoping and Hoisting, I was confused as well because the author never showed what the two opening example codes are interpreted as in the compiler.
Here is example you provided, and the second on the page:
var a = 1;
function b() {
function a() {} // declares 'a' as a function, which is always local
a = 10;
return;
}
b();
alert(a);
and here is the first example on the page:
var foo = 1;
function bar() {
var foo; // a new local 'foo' variable
if (!foo) {
foo = 10;
}
alert(foo);
}
bar();
Hope this helps
I believe that article explains the hoisting topic quite good 2n.pl/blog/javascript-part-4
– Adam Piotrowski
Apr 9 '18 at 10:18
add a comment |
5 Answers
5
active
oldest
votes
5 Answers
5
active
oldest
votes
active
oldest
votes
active
oldest
votes
- The global
a
is set to1
b()
is called
function a() {}
is hoisted and creates a local variablea
that masks the globala
- The local
a
is set to10
(overwriting the functiona
) - The global
a
(still1
) is alerted
2
thank you @Quentin I was missing the fact number 3 (that function a() {} creates a local variable that masks the global a)
– morfioce
Mar 9 '13 at 13:36
@Quentin: Can you please show with code how the function would look with hoisting?
– SharpCoder
Apr 27 '14 at 15:02
@Brown_Dynamite — It looks like it looks in the question. It functions in the order described in this answer.
– Quentin
Apr 27 '14 at 15:08
So ifa
was not hoisted, calling functionb()
would seta = 10
globally,alert(a)
would then output 10? If I'm understanding correctly?
– Kenny Worden
May 27 '15 at 16:50
1
The best way to understand hoisting is to talk like a compiler, Grate
– M98
Sep 6 '16 at 11:59
add a comment |
- The global
a
is set to1
b()
is called
function a() {}
is hoisted and creates a local variablea
that masks the globala
- The local
a
is set to10
(overwriting the functiona
) - The global
a
(still1
) is alerted
2
thank you @Quentin I was missing the fact number 3 (that function a() {} creates a local variable that masks the global a)
– morfioce
Mar 9 '13 at 13:36
@Quentin: Can you please show with code how the function would look with hoisting?
– SharpCoder
Apr 27 '14 at 15:02
@Brown_Dynamite — It looks like it looks in the question. It functions in the order described in this answer.
– Quentin
Apr 27 '14 at 15:08
So ifa
was not hoisted, calling functionb()
would seta = 10
globally,alert(a)
would then output 10? If I'm understanding correctly?
– Kenny Worden
May 27 '15 at 16:50
1
The best way to understand hoisting is to talk like a compiler, Grate
– M98
Sep 6 '16 at 11:59
add a comment |
- The global
a
is set to1
b()
is called
function a() {}
is hoisted and creates a local variablea
that masks the globala
- The local
a
is set to10
(overwriting the functiona
) - The global
a
(still1
) is alerted
- The global
a
is set to1
b()
is called
function a() {}
is hoisted and creates a local variablea
that masks the globala
- The local
a
is set to10
(overwriting the functiona
) - The global
a
(still1
) is alerted
answered Mar 9 '13 at 13:26
QuentinQuentin
655k728911055
655k728911055
2
thank you @Quentin I was missing the fact number 3 (that function a() {} creates a local variable that masks the global a)
– morfioce
Mar 9 '13 at 13:36
@Quentin: Can you please show with code how the function would look with hoisting?
– SharpCoder
Apr 27 '14 at 15:02
@Brown_Dynamite — It looks like it looks in the question. It functions in the order described in this answer.
– Quentin
Apr 27 '14 at 15:08
So ifa
was not hoisted, calling functionb()
would seta = 10
globally,alert(a)
would then output 10? If I'm understanding correctly?
– Kenny Worden
May 27 '15 at 16:50
1
The best way to understand hoisting is to talk like a compiler, Grate
– M98
Sep 6 '16 at 11:59
add a comment |
2
thank you @Quentin I was missing the fact number 3 (that function a() {} creates a local variable that masks the global a)
– morfioce
Mar 9 '13 at 13:36
@Quentin: Can you please show with code how the function would look with hoisting?
– SharpCoder
Apr 27 '14 at 15:02
@Brown_Dynamite — It looks like it looks in the question. It functions in the order described in this answer.
– Quentin
Apr 27 '14 at 15:08
So ifa
was not hoisted, calling functionb()
would seta = 10
globally,alert(a)
would then output 10? If I'm understanding correctly?
– Kenny Worden
May 27 '15 at 16:50
1
The best way to understand hoisting is to talk like a compiler, Grate
– M98
Sep 6 '16 at 11:59
2
2
thank you @Quentin I was missing the fact number 3 (that function a() {} creates a local variable that masks the global a)
– morfioce
Mar 9 '13 at 13:36
thank you @Quentin I was missing the fact number 3 (that function a() {} creates a local variable that masks the global a)
– morfioce
Mar 9 '13 at 13:36
@Quentin: Can you please show with code how the function would look with hoisting?
– SharpCoder
Apr 27 '14 at 15:02
@Quentin: Can you please show with code how the function would look with hoisting?
– SharpCoder
Apr 27 '14 at 15:02
@Brown_Dynamite — It looks like it looks in the question. It functions in the order described in this answer.
– Quentin
Apr 27 '14 at 15:08
@Brown_Dynamite — It looks like it looks in the question. It functions in the order described in this answer.
– Quentin
Apr 27 '14 at 15:08
So if
a
was not hoisted, calling function b()
would set a = 10
globally, alert(a)
would then output 10? If I'm understanding correctly?– Kenny Worden
May 27 '15 at 16:50
So if
a
was not hoisted, calling function b()
would set a = 10
globally, alert(a)
would then output 10? If I'm understanding correctly?– Kenny Worden
May 27 '15 at 16:50
1
1
The best way to understand hoisting is to talk like a compiler, Grate
– M98
Sep 6 '16 at 11:59
The best way to understand hoisting is to talk like a compiler, Grate
– M98
Sep 6 '16 at 11:59
add a comment |
It's because the order of compilation/interpretation in this example is somewhat misleading. The function a () {}
line is interpreted before any of the rest of the function is executed, so at the very beginning of the function, a
has the value of function a () {}
. When you reassign it to 10
, you are reassigning the value of a
in the local scope of function b()
, which is then discarded once you return, leaving the original value of a = 1
in the global scope.
You can verify this by placing alert()
s or the like in the appropriate places to see what the value of a
is at various points.
add a comment |
It's because the order of compilation/interpretation in this example is somewhat misleading. The function a () {}
line is interpreted before any of the rest of the function is executed, so at the very beginning of the function, a
has the value of function a () {}
. When you reassign it to 10
, you are reassigning the value of a
in the local scope of function b()
, which is then discarded once you return, leaving the original value of a = 1
in the global scope.
You can verify this by placing alert()
s or the like in the appropriate places to see what the value of a
is at various points.
add a comment |
It's because the order of compilation/interpretation in this example is somewhat misleading. The function a () {}
line is interpreted before any of the rest of the function is executed, so at the very beginning of the function, a
has the value of function a () {}
. When you reassign it to 10
, you are reassigning the value of a
in the local scope of function b()
, which is then discarded once you return, leaving the original value of a = 1
in the global scope.
You can verify this by placing alert()
s or the like in the appropriate places to see what the value of a
is at various points.
It's because the order of compilation/interpretation in this example is somewhat misleading. The function a () {}
line is interpreted before any of the rest of the function is executed, so at the very beginning of the function, a
has the value of function a () {}
. When you reassign it to 10
, you are reassigning the value of a
in the local scope of function b()
, which is then discarded once you return, leaving the original value of a = 1
in the global scope.
You can verify this by placing alert()
s or the like in the appropriate places to see what the value of a
is at various points.
answered Mar 9 '13 at 13:35
fraveydankfraveydank
612
612
add a comment |
add a comment |
(1) JavaScript does not have block statement scope; rather, it will be local to the code that the block resides within.
(2) Javascript's declaration of variables in a function scope, meaning that variables declared in a function are available anywhere in that function, even before they are assigned a value.
(3) Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function parameter with the same name as a global variable, you effectively hide the global variable.
you code is same as: (read comment)
<script>
var a = 1; //global a = 1
function b() {
a = 10;
var a = 20; //local a = 20
}
b();
alert(a); //global a = 1
</script>
reference:
(1) JavaScript Variable Scope:
(2) A Dangerous Example of Javascript Hoisting
(3) Variable scope
So in your code:
var a = 1; //global a = 1
function b() {
a = 10;
return;
function a() {} //local
}
b();
alert(a); //global a = 1
where you wrote "local a Undefined" - that's actually not true. function declarations are parsed before any content of the parent scope, so in this case when you assign a = 10, you are already overriding function a() {} with value 10. See Quentin's answer
– rochal
Mar 11 '13 at 21:54
@rochal No, please read this article Javascript hoisting can be especially nefarious in loops Also check code on safari browser...let me know And Yes itsa=10
on most browser ..Actually Undefined behaviour not ERROR
– Grijesh Chauhan
Mar 12 '13 at 4:12
read point 4. from Quentin's answer. At this pointa
already exists - it's a function, not an Undefined. How would Safari be different to i.e. Chrome..?
– rochal
Mar 12 '13 at 9:08
@rochalvariables declared in a function are available anywhere in that function, even before they are assigned a value
I also checked it, and giving10
But according to three tutorials (I given link) it should be undefined and 10 is result because of undefined. Quentin answered according to output but I think it may be not 10 for some browsers..
– Grijesh Chauhan
Mar 13 '13 at 4:15
once again, in your example code:a = 10; //local a Undefined
is incorrecta = 10; //local a is function(){}
is correct because as soon as you check the value of a inside function b() it already has been overridden by the local function a(){} so your comment that "local a Undefined" is not valid. And browser has nothing to do with it, it's a language feature.
– rochal
Mar 13 '13 at 4:39
|
show 1 more comment
(1) JavaScript does not have block statement scope; rather, it will be local to the code that the block resides within.
(2) Javascript's declaration of variables in a function scope, meaning that variables declared in a function are available anywhere in that function, even before they are assigned a value.
(3) Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function parameter with the same name as a global variable, you effectively hide the global variable.
you code is same as: (read comment)
<script>
var a = 1; //global a = 1
function b() {
a = 10;
var a = 20; //local a = 20
}
b();
alert(a); //global a = 1
</script>
reference:
(1) JavaScript Variable Scope:
(2) A Dangerous Example of Javascript Hoisting
(3) Variable scope
So in your code:
var a = 1; //global a = 1
function b() {
a = 10;
return;
function a() {} //local
}
b();
alert(a); //global a = 1
where you wrote "local a Undefined" - that's actually not true. function declarations are parsed before any content of the parent scope, so in this case when you assign a = 10, you are already overriding function a() {} with value 10. See Quentin's answer
– rochal
Mar 11 '13 at 21:54
@rochal No, please read this article Javascript hoisting can be especially nefarious in loops Also check code on safari browser...let me know And Yes itsa=10
on most browser ..Actually Undefined behaviour not ERROR
– Grijesh Chauhan
Mar 12 '13 at 4:12
read point 4. from Quentin's answer. At this pointa
already exists - it's a function, not an Undefined. How would Safari be different to i.e. Chrome..?
– rochal
Mar 12 '13 at 9:08
@rochalvariables declared in a function are available anywhere in that function, even before they are assigned a value
I also checked it, and giving10
But according to three tutorials (I given link) it should be undefined and 10 is result because of undefined. Quentin answered according to output but I think it may be not 10 for some browsers..
– Grijesh Chauhan
Mar 13 '13 at 4:15
once again, in your example code:a = 10; //local a Undefined
is incorrecta = 10; //local a is function(){}
is correct because as soon as you check the value of a inside function b() it already has been overridden by the local function a(){} so your comment that "local a Undefined" is not valid. And browser has nothing to do with it, it's a language feature.
– rochal
Mar 13 '13 at 4:39
|
show 1 more comment
(1) JavaScript does not have block statement scope; rather, it will be local to the code that the block resides within.
(2) Javascript's declaration of variables in a function scope, meaning that variables declared in a function are available anywhere in that function, even before they are assigned a value.
(3) Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function parameter with the same name as a global variable, you effectively hide the global variable.
you code is same as: (read comment)
<script>
var a = 1; //global a = 1
function b() {
a = 10;
var a = 20; //local a = 20
}
b();
alert(a); //global a = 1
</script>
reference:
(1) JavaScript Variable Scope:
(2) A Dangerous Example of Javascript Hoisting
(3) Variable scope
So in your code:
var a = 1; //global a = 1
function b() {
a = 10;
return;
function a() {} //local
}
b();
alert(a); //global a = 1
(1) JavaScript does not have block statement scope; rather, it will be local to the code that the block resides within.
(2) Javascript's declaration of variables in a function scope, meaning that variables declared in a function are available anywhere in that function, even before they are assigned a value.
(3) Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function parameter with the same name as a global variable, you effectively hide the global variable.
you code is same as: (read comment)
<script>
var a = 1; //global a = 1
function b() {
a = 10;
var a = 20; //local a = 20
}
b();
alert(a); //global a = 1
</script>
reference:
(1) JavaScript Variable Scope:
(2) A Dangerous Example of Javascript Hoisting
(3) Variable scope
So in your code:
var a = 1; //global a = 1
function b() {
a = 10;
return;
function a() {} //local
}
b();
alert(a); //global a = 1
edited Mar 15 '13 at 15:21
answered Mar 9 '13 at 16:40
Grijesh ChauhanGrijesh Chauhan
45.8k1498163
45.8k1498163
where you wrote "local a Undefined" - that's actually not true. function declarations are parsed before any content of the parent scope, so in this case when you assign a = 10, you are already overriding function a() {} with value 10. See Quentin's answer
– rochal
Mar 11 '13 at 21:54
@rochal No, please read this article Javascript hoisting can be especially nefarious in loops Also check code on safari browser...let me know And Yes itsa=10
on most browser ..Actually Undefined behaviour not ERROR
– Grijesh Chauhan
Mar 12 '13 at 4:12
read point 4. from Quentin's answer. At this pointa
already exists - it's a function, not an Undefined. How would Safari be different to i.e. Chrome..?
– rochal
Mar 12 '13 at 9:08
@rochalvariables declared in a function are available anywhere in that function, even before they are assigned a value
I also checked it, and giving10
But according to three tutorials (I given link) it should be undefined and 10 is result because of undefined. Quentin answered according to output but I think it may be not 10 for some browsers..
– Grijesh Chauhan
Mar 13 '13 at 4:15
once again, in your example code:a = 10; //local a Undefined
is incorrecta = 10; //local a is function(){}
is correct because as soon as you check the value of a inside function b() it already has been overridden by the local function a(){} so your comment that "local a Undefined" is not valid. And browser has nothing to do with it, it's a language feature.
– rochal
Mar 13 '13 at 4:39
|
show 1 more comment
where you wrote "local a Undefined" - that's actually not true. function declarations are parsed before any content of the parent scope, so in this case when you assign a = 10, you are already overriding function a() {} with value 10. See Quentin's answer
– rochal
Mar 11 '13 at 21:54
@rochal No, please read this article Javascript hoisting can be especially nefarious in loops Also check code on safari browser...let me know And Yes itsa=10
on most browser ..Actually Undefined behaviour not ERROR
– Grijesh Chauhan
Mar 12 '13 at 4:12
read point 4. from Quentin's answer. At this pointa
already exists - it's a function, not an Undefined. How would Safari be different to i.e. Chrome..?
– rochal
Mar 12 '13 at 9:08
@rochalvariables declared in a function are available anywhere in that function, even before they are assigned a value
I also checked it, and giving10
But according to three tutorials (I given link) it should be undefined and 10 is result because of undefined. Quentin answered according to output but I think it may be not 10 for some browsers..
– Grijesh Chauhan
Mar 13 '13 at 4:15
once again, in your example code:a = 10; //local a Undefined
is incorrecta = 10; //local a is function(){}
is correct because as soon as you check the value of a inside function b() it already has been overridden by the local function a(){} so your comment that "local a Undefined" is not valid. And browser has nothing to do with it, it's a language feature.
– rochal
Mar 13 '13 at 4:39
where you wrote "local a Undefined" - that's actually not true. function declarations are parsed before any content of the parent scope, so in this case when you assign a = 10, you are already overriding function a() {} with value 10. See Quentin's answer
– rochal
Mar 11 '13 at 21:54
where you wrote "local a Undefined" - that's actually not true. function declarations are parsed before any content of the parent scope, so in this case when you assign a = 10, you are already overriding function a() {} with value 10. See Quentin's answer
– rochal
Mar 11 '13 at 21:54
@rochal No, please read this article Javascript hoisting can be especially nefarious in loops Also check code on safari browser...let me know And Yes its
a=10
on most browser ..Actually Undefined behaviour not ERROR– Grijesh Chauhan
Mar 12 '13 at 4:12
@rochal No, please read this article Javascript hoisting can be especially nefarious in loops Also check code on safari browser...let me know And Yes its
a=10
on most browser ..Actually Undefined behaviour not ERROR– Grijesh Chauhan
Mar 12 '13 at 4:12
read point 4. from Quentin's answer. At this point
a
already exists - it's a function, not an Undefined. How would Safari be different to i.e. Chrome..?– rochal
Mar 12 '13 at 9:08
read point 4. from Quentin's answer. At this point
a
already exists - it's a function, not an Undefined. How would Safari be different to i.e. Chrome..?– rochal
Mar 12 '13 at 9:08
@rochal
variables declared in a function are available anywhere in that function, even before they are assigned a value
I also checked it, and giving 10
But according to three tutorials (I given link) it should be undefined and 10 is result because of undefined. Quentin answered according to output but I think it may be not 10 for some browsers..– Grijesh Chauhan
Mar 13 '13 at 4:15
@rochal
variables declared in a function are available anywhere in that function, even before they are assigned a value
I also checked it, and giving 10
But according to three tutorials (I given link) it should be undefined and 10 is result because of undefined. Quentin answered according to output but I think it may be not 10 for some browsers..– Grijesh Chauhan
Mar 13 '13 at 4:15
once again, in your example code:
a = 10; //local a Undefined
is incorrect a = 10; //local a is function(){}
is correct because as soon as you check the value of a inside function b() it already has been overridden by the local function a(){} so your comment that "local a Undefined" is not valid. And browser has nothing to do with it, it's a language feature.– rochal
Mar 13 '13 at 4:39
once again, in your example code:
a = 10; //local a Undefined
is incorrect a = 10; //local a is function(){}
is correct because as soon as you check the value of a inside function b() it already has been overridden by the local function a(){} so your comment that "local a Undefined" is not valid. And browser has nothing to do with it, it's a language feature.– rochal
Mar 13 '13 at 4:39
|
show 1 more comment
- function declaration
function a(){}
is hoisted first, hence in local scopea
is created. - If you have two variable with same name (one in global another in local), local variable always get precedence over global variable.
- When you set
a=10
, you are setting the local variablea
, not the global one.
Hence, the value of global variable remain same and you get, alerted 1
add a comment |
- function declaration
function a(){}
is hoisted first, hence in local scopea
is created. - If you have two variable with same name (one in global another in local), local variable always get precedence over global variable.
- When you set
a=10
, you are setting the local variablea
, not the global one.
Hence, the value of global variable remain same and you get, alerted 1
add a comment |
- function declaration
function a(){}
is hoisted first, hence in local scopea
is created. - If you have two variable with same name (one in global another in local), local variable always get precedence over global variable.
- When you set
a=10
, you are setting the local variablea
, not the global one.
Hence, the value of global variable remain same and you get, alerted 1
- function declaration
function a(){}
is hoisted first, hence in local scopea
is created. - If you have two variable with same name (one in global another in local), local variable always get precedence over global variable.
- When you set
a=10
, you are setting the local variablea
, not the global one.
Hence, the value of global variable remain same and you get, alerted 1
edited May 17 '14 at 13:43
answered May 17 '14 at 13:30


KhanSharpKhanSharp
7,90343747
7,90343747
add a comment |
add a comment |
When I read the same article you did JavaScript Scoping and Hoisting, I was confused as well because the author never showed what the two opening example codes are interpreted as in the compiler.
Here is example you provided, and the second on the page:
var a = 1;
function b() {
function a() {} // declares 'a' as a function, which is always local
a = 10;
return;
}
b();
alert(a);
and here is the first example on the page:
var foo = 1;
function bar() {
var foo; // a new local 'foo' variable
if (!foo) {
foo = 10;
}
alert(foo);
}
bar();
Hope this helps
I believe that article explains the hoisting topic quite good 2n.pl/blog/javascript-part-4
– Adam Piotrowski
Apr 9 '18 at 10:18
add a comment |
When I read the same article you did JavaScript Scoping and Hoisting, I was confused as well because the author never showed what the two opening example codes are interpreted as in the compiler.
Here is example you provided, and the second on the page:
var a = 1;
function b() {
function a() {} // declares 'a' as a function, which is always local
a = 10;
return;
}
b();
alert(a);
and here is the first example on the page:
var foo = 1;
function bar() {
var foo; // a new local 'foo' variable
if (!foo) {
foo = 10;
}
alert(foo);
}
bar();
Hope this helps
I believe that article explains the hoisting topic quite good 2n.pl/blog/javascript-part-4
– Adam Piotrowski
Apr 9 '18 at 10:18
add a comment |
When I read the same article you did JavaScript Scoping and Hoisting, I was confused as well because the author never showed what the two opening example codes are interpreted as in the compiler.
Here is example you provided, and the second on the page:
var a = 1;
function b() {
function a() {} // declares 'a' as a function, which is always local
a = 10;
return;
}
b();
alert(a);
and here is the first example on the page:
var foo = 1;
function bar() {
var foo; // a new local 'foo' variable
if (!foo) {
foo = 10;
}
alert(foo);
}
bar();
Hope this helps
When I read the same article you did JavaScript Scoping and Hoisting, I was confused as well because the author never showed what the two opening example codes are interpreted as in the compiler.
Here is example you provided, and the second on the page:
var a = 1;
function b() {
function a() {} // declares 'a' as a function, which is always local
a = 10;
return;
}
b();
alert(a);
and here is the first example on the page:
var foo = 1;
function bar() {
var foo; // a new local 'foo' variable
if (!foo) {
foo = 10;
}
alert(foo);
}
bar();
Hope this helps
answered Nov 6 '13 at 5:30
JonathanJonathan
416516
416516
I believe that article explains the hoisting topic quite good 2n.pl/blog/javascript-part-4
– Adam Piotrowski
Apr 9 '18 at 10:18
add a comment |
I believe that article explains the hoisting topic quite good 2n.pl/blog/javascript-part-4
– Adam Piotrowski
Apr 9 '18 at 10:18
I believe that article explains the hoisting topic quite good 2n.pl/blog/javascript-part-4
– Adam Piotrowski
Apr 9 '18 at 10:18
I believe that article explains the hoisting topic quite good 2n.pl/blog/javascript-part-4
– Adam Piotrowski
Apr 9 '18 at 10:18
add a comment |
Tb2pWIj2
Hoisting is JavaScript's default behavior of moving declarations to the top. (function declarations are "moved" from where they appear in the flow of the code to the top of the code. This gives rise to the name "Hoisting".) Read more
– M98
Sep 6 '16 at 11:51
Here is a link with easy explanation about "Function expressions vs. function declarations and Hoisting" ... gomakethings.com/function-expressions-vs-function-declarations
– S. Mayol
Oct 12 '18 at 2:12