Hoisting order with IIFE involved, specific example
0
I came across this code:
var myVar = 'foo';
(function() {
console.log('Original value was: ' + myVar);
var myVar = 'bar';
console.log('New value is: ' + myVar);
})();Questions:
- Is IIFE hoisted to the top before global
myVar?
1a. IF it is, is it executed before globalmyVaris declared? - In IIFE I get
undefinedfirst, andbarsecond. What is the behind the scenes order of execution in IIFE?
javascript iife hoisting
edited Nov 21 '18 at 17:12
Roy Scheffers
2,248101927
asked Nov 21 '18 at 16:56
YozexYozex
438
add a comment |
0
I came across this code:
var myVar = 'foo';
(function() {
console.log('Original value was: ' + myVar);
var myVar = 'bar';
console.log('New value is: ' + myVar);
})();Questions:
- Is IIFE hoisted to the top before global
myVar?
1a. IF it is, is it executed before globalmyVaris declared? - In IIFE I get
undefinedfirst, andbarsecond. What is the behind the scenes order of execution in IIFE?
javascript iife hoisting
edited Nov 21 '18 at 17:12
Roy Scheffers
2,248101927
asked Nov 21 '18 at 16:56
YozexYozex
438
add a comment |
0
0
0
I came across this code:
var myVar = 'foo';
(function() {
console.log('Original value was: ' + myVar);
var myVar = 'bar';
console.log('New value is: ' + myVar);
})();Questions:
- Is IIFE hoisted to the top before global
myVar?
1a. IF it is, is it executed before globalmyVaris declared? - In IIFE I get
undefinedfirst, andbarsecond. What is the behind the scenes order of execution in IIFE?
javascript iife hoisting
edited Nov 21 '18 at 17:12
Roy Scheffers
2,248101927
asked Nov 21 '18 at 16:56
YozexYozex
438
I came across this code:
var myVar = 'foo';
(function() {
console.log('Original value was: ' + myVar);
var myVar = 'bar';
console.log('New value is: ' + myVar);
})();Questions:
- Is IIFE hoisted to the top before global
myVar?
1a. IF it is, is it executed before globalmyVaris declared? - In IIFE I get
undefinedfirst, andbarsecond. What is the behind the scenes order of execution in IIFE?
var myVar = 'foo';
(function() {
console.log('Original value was: ' + myVar);
var myVar = 'bar';
console.log('New value is: ' + myVar);
})();var myVar = 'foo';
(function() {
console.log('Original value was: ' + myVar);
var myVar = 'bar';
console.log('New value is: ' + myVar);
})();javascript iife hoisting
javascript iife hoisting
edited Nov 21 '18 at 17:12
Roy Scheffers
2,248101927
asked Nov 21 '18 at 16:56
YozexYozex
438
edited Nov 21 '18 at 17:12
Roy Scheffers
2,248101927
asked Nov 21 '18 at 16:56
YozexYozex
438
edited Nov 21 '18 at 17:12
Roy Scheffers
2,248101927
edited Nov 21 '18 at 17:12
Roy Scheffers
2,248101927
edited Nov 21 '18 at 17:12
Roy Scheffers
2,248101927
2,248101927
asked Nov 21 '18 at 16:56
YozexYozex
438
asked Nov 21 '18 at 16:56
YozexYozex
438
asked Nov 21 '18 at 16:56
YozexYozex
438
438
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
2
- The IIFE is an expression, not a statement, so no it is not hoisted.
var myVarinside the IIFE is hoisted to the top of the function scope, but the assignment is not. The following is equivalent:
(function(){
var myVar;
console.log('Original value was: '+ myVar);
myVar = 'bar';
console.log('New value is: ' + myVar);
})();answered Nov 21 '18 at 16:59
Patrick RobertsPatrick Roberts
20.7k33577
add a comment |
1
Patrick Roberts' answer is excellent, but I wanted to make something clear, there is nothing specific to IIFEs here, all functions work the same, whether they are immediately invoked or not
var myVar = 'foo';
// f1 : creates a variable inside the scope with the same name
function f1 () {
console.log(myVar); // Logs undefined
var myVar = 'hi';
}
// f2 is the same as f1
function f2 () {
var myVar;
console.log(myVar); // Logs undefined
myVar = 'hi';
}
// f3 declares before logging
function f3 () {
var myVar = 'hullo';
console.log(myVar); // Logs the inner value of the variable
}
function logOuterVar () {
console.log(myVar); // Logs the global var
}
f1();
f2();
f3();
logOuterVar();answered Nov 21 '18 at 18:04
PamicelPamicel
686
I don't see how this is relevant. The main point is that IIFEs are not statements so they are not hoisted.
– Patrick Roberts
Nov 21 '18 at 18:56
The title being “Hoisting order with IIFE involved” and the question reading “What is the behind the scene order of execution in IIFE ?” (which could be understood as “inside an IIFE”) I thought anyone coming to this page should be made aware that the involvement or not of an IIFE is in fine irrelevant to the subject matter
– Pamicel
Nov 21 '18 at 23:09
I just wanted to add that there is nothing oesoteric about what happens inside of or around an IIFE.
– Pamicel
Nov 21 '18 at 23:23
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53417054%2fhoisting-order-with-iife-involved-specific-example%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
2
- The IIFE is an expression, not a statement, so no it is not hoisted.
var myVarinside the IIFE is hoisted to the top of the function scope, but the assignment is not. The following is equivalent:
(function(){
var myVar;
console.log('Original value was: '+ myVar);
myVar = 'bar';
console.log('New value is: ' + myVar);
})();answered Nov 21 '18 at 16:59
Patrick RobertsPatrick Roberts
20.7k33577
add a comment |
2
- The IIFE is an expression, not a statement, so no it is not hoisted.
var myVarinside the IIFE is hoisted to the top of the function scope, but the assignment is not. The following is equivalent:
(function(){
var myVar;
console.log('Original value was: '+ myVar);
myVar = 'bar';
console.log('New value is: ' + myVar);
})();answered Nov 21 '18 at 16:59
Patrick RobertsPatrick Roberts
20.7k33577
add a comment |
2
2
2
- The IIFE is an expression, not a statement, so no it is not hoisted.
var myVarinside the IIFE is hoisted to the top of the function scope, but the assignment is not. The following is equivalent:
(function(){
var myVar;
console.log('Original value was: '+ myVar);
myVar = 'bar';
console.log('New value is: ' + myVar);
})();answered Nov 21 '18 at 16:59
Patrick RobertsPatrick Roberts
20.7k33577
- The IIFE is an expression, not a statement, so no it is not hoisted.
var myVarinside the IIFE is hoisted to the top of the function scope, but the assignment is not. The following is equivalent:
(function(){
var myVar;
console.log('Original value was: '+ myVar);
myVar = 'bar';
console.log('New value is: ' + myVar);
})();(function(){
var myVar;
console.log('Original value was: '+ myVar);
myVar = 'bar';
console.log('New value is: ' + myVar);
})();(function(){
var myVar;
console.log('Original value was: '+ myVar);
myVar = 'bar';
console.log('New value is: ' + myVar);
})();answered Nov 21 '18 at 16:59
Patrick RobertsPatrick Roberts
20.7k33577
answered Nov 21 '18 at 16:59
Patrick RobertsPatrick Roberts
20.7k33577
answered Nov 21 '18 at 16:59
Patrick RobertsPatrick Roberts
20.7k33577
answered Nov 21 '18 at 16:59
Patrick RobertsPatrick Roberts
20.7k33577
20.7k33577
add a comment |
add a comment |
1
Patrick Roberts' answer is excellent, but I wanted to make something clear, there is nothing specific to IIFEs here, all functions work the same, whether they are immediately invoked or not
var myVar = 'foo';
// f1 : creates a variable inside the scope with the same name
function f1 () {
console.log(myVar); // Logs undefined
var myVar = 'hi';
}
// f2 is the same as f1
function f2 () {
var myVar;
console.log(myVar); // Logs undefined
myVar = 'hi';
}
// f3 declares before logging
function f3 () {
var myVar = 'hullo';
console.log(myVar); // Logs the inner value of the variable
}
function logOuterVar () {
console.log(myVar); // Logs the global var
}
f1();
f2();
f3();
logOuterVar();answered Nov 21 '18 at 18:04
PamicelPamicel
686
I don't see how this is relevant. The main point is that IIFEs are not statements so they are not hoisted.
– Patrick Roberts
Nov 21 '18 at 18:56
The title being “Hoisting order with IIFE involved” and the question reading “What is the behind the scene order of execution in IIFE ?” (which could be understood as “inside an IIFE”) I thought anyone coming to this page should be made aware that the involvement or not of an IIFE is in fine irrelevant to the subject matter
– Pamicel
Nov 21 '18 at 23:09
I just wanted to add that there is nothing oesoteric about what happens inside of or around an IIFE.
– Pamicel
Nov 21 '18 at 23:23
add a comment |
1
Patrick Roberts' answer is excellent, but I wanted to make something clear, there is nothing specific to IIFEs here, all functions work the same, whether they are immediately invoked or not
var myVar = 'foo';
// f1 : creates a variable inside the scope with the same name
function f1 () {
console.log(myVar); // Logs undefined
var myVar = 'hi';
}
// f2 is the same as f1
function f2 () {
var myVar;
console.log(myVar); // Logs undefined
myVar = 'hi';
}
// f3 declares before logging
function f3 () {
var myVar = 'hullo';
console.log(myVar); // Logs the inner value of the variable
}
function logOuterVar () {
console.log(myVar); // Logs the global var
}
f1();
f2();
f3();
logOuterVar();answered Nov 21 '18 at 18:04
PamicelPamicel
686
I don't see how this is relevant. The main point is that IIFEs are not statements so they are not hoisted.
– Patrick Roberts
Nov 21 '18 at 18:56
The title being “Hoisting order with IIFE involved” and the question reading “What is the behind the scene order of execution in IIFE ?” (which could be understood as “inside an IIFE”) I thought anyone coming to this page should be made aware that the involvement or not of an IIFE is in fine irrelevant to the subject matter
– Pamicel
Nov 21 '18 at 23:09
I just wanted to add that there is nothing oesoteric about what happens inside of or around an IIFE.
– Pamicel
Nov 21 '18 at 23:23
add a comment |
1
1
1
Patrick Roberts' answer is excellent, but I wanted to make something clear, there is nothing specific to IIFEs here, all functions work the same, whether they are immediately invoked or not
var myVar = 'foo';
// f1 : creates a variable inside the scope with the same name
function f1 () {
console.log(myVar); // Logs undefined
var myVar = 'hi';
}
// f2 is the same as f1
function f2 () {
var myVar;
console.log(myVar); // Logs undefined
myVar = 'hi';
}
// f3 declares before logging
function f3 () {
var myVar = 'hullo';
console.log(myVar); // Logs the inner value of the variable
}
function logOuterVar () {
console.log(myVar); // Logs the global var
}
f1();
f2();
f3();
logOuterVar();answered Nov 21 '18 at 18:04
PamicelPamicel
686
Patrick Roberts' answer is excellent, but I wanted to make something clear, there is nothing specific to IIFEs here, all functions work the same, whether they are immediately invoked or not
var myVar = 'foo';
// f1 : creates a variable inside the scope with the same name
function f1 () {
console.log(myVar); // Logs undefined
var myVar = 'hi';
}
// f2 is the same as f1
function f2 () {
var myVar;
console.log(myVar); // Logs undefined
myVar = 'hi';
}
// f3 declares before logging
function f3 () {
var myVar = 'hullo';
console.log(myVar); // Logs the inner value of the variable
}
function logOuterVar () {
console.log(myVar); // Logs the global var
}
f1();
f2();
f3();
logOuterVar();var myVar = 'foo';
// f1 : creates a variable inside the scope with the same name
function f1 () {
console.log(myVar); // Logs undefined
var myVar = 'hi';
}
// f2 is the same as f1
function f2 () {
var myVar;
console.log(myVar); // Logs undefined
myVar = 'hi';
}
// f3 declares before logging
function f3 () {
var myVar = 'hullo';
console.log(myVar); // Logs the inner value of the variable
}
function logOuterVar () {
console.log(myVar); // Logs the global var
}
f1();
f2();
f3();
logOuterVar();var myVar = 'foo';
// f1 : creates a variable inside the scope with the same name
function f1 () {
console.log(myVar); // Logs undefined
var myVar = 'hi';
}
// f2 is the same as f1
function f2 () {
var myVar;
console.log(myVar); // Logs undefined
myVar = 'hi';
}
// f3 declares before logging
function f3 () {
var myVar = 'hullo';
console.log(myVar); // Logs the inner value of the variable
}
function logOuterVar () {
console.log(myVar); // Logs the global var
}
f1();
f2();
f3();
logOuterVar();answered Nov 21 '18 at 18:04
PamicelPamicel
686
edited Nov 21 '18 at 23:18
answered Nov 21 '18 at 18:04
PamicelPamicel
686
answered Nov 21 '18 at 18:04
PamicelPamicel
686
answered Nov 21 '18 at 18:04
PamicelPamicel
686
686
I don't see how this is relevant. The main point is that IIFEs are not statements so they are not hoisted.
– Patrick Roberts
Nov 21 '18 at 18:56
The title being “Hoisting order with IIFE involved” and the question reading “What is the behind the scene order of execution in IIFE ?” (which could be understood as “inside an IIFE”) I thought anyone coming to this page should be made aware that the involvement or not of an IIFE is in fine irrelevant to the subject matter
– Pamicel
Nov 21 '18 at 23:09
I just wanted to add that there is nothing oesoteric about what happens inside of or around an IIFE.
– Pamicel
Nov 21 '18 at 23:23
add a comment |
I don't see how this is relevant. The main point is that IIFEs are not statements so they are not hoisted.
– Patrick Roberts
Nov 21 '18 at 18:56
The title being “Hoisting order with IIFE involved” and the question reading “What is the behind the scene order of execution in IIFE ?” (which could be understood as “inside an IIFE”) I thought anyone coming to this page should be made aware that the involvement or not of an IIFE is in fine irrelevant to the subject matter
– Pamicel
Nov 21 '18 at 23:09
I just wanted to add that there is nothing oesoteric about what happens inside of or around an IIFE.
– Pamicel
Nov 21 '18 at 23:23
I don't see how this is relevant. The main point is that IIFEs are not statements so they are not hoisted.
– Patrick Roberts
Nov 21 '18 at 18:56
I don't see how this is relevant. The main point is that IIFEs are not statements so they are not hoisted.
– Patrick Roberts
Nov 21 '18 at 18:56
The title being “Hoisting order with IIFE involved” and the question reading “What is the behind the scene order of execution in IIFE ?” (which could be understood as “inside an IIFE”) I thought anyone coming to this page should be made aware that the involvement or not of an IIFE is in fine irrelevant to the subject matter
– Pamicel
Nov 21 '18 at 23:09
The title being “Hoisting order with IIFE involved” and the question reading “What is the behind the scene order of execution in IIFE ?” (which could be understood as “inside an IIFE”) I thought anyone coming to this page should be made aware that the involvement or not of an IIFE is in fine irrelevant to the subject matter
– Pamicel
Nov 21 '18 at 23:09
I just wanted to add that there is nothing oesoteric about what happens inside of or around an IIFE.
– Pamicel
Nov 21 '18 at 23:23
I just wanted to add that there is nothing oesoteric about what happens inside of or around an IIFE.
– Pamicel
Nov 21 '18 at 23:23
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53417054%2fhoisting-order-with-iife-involved-specific-example%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
