This question already has answers here:
Order of hoisting in JavaScript
(2 answers)
Closed 6 years ago.
I came to know 'Function declarations and variable declarations are always moved (“hoisted”) invisibly to the top of their containing scope by the JavaScript interpreter.' -- JavaScript Scoping and Hoisting.
But which one hoisted first?
As a result of someone asked me at SegmentFault, I should give him a exact answer.
function test() {
return foo;
var foo = true;
function foo(){}
}
console.log(typeof test()) // function
functions are hoisted first
See here for more informations
Related
This question already has answers here:
Hoisting variables in JavaScript
(5 answers)
Closed 1 year ago.
I am studying hoisting concept now, but i cannot understand why
hoisting can only work on declaration, not initialization.
declaration O
catName("cat");
function catName(name){
console.log(name) // return cat
}
initialization X
console.log(num); // return undefined
var num;
num = 6;
...why hoisting can only work on declaration, not initialization
It can work with initialization (and in fact, that var variable is initialized — with the value undefined), it's just that hoisting the initializer expression is not defined for var. Hoisting initialization is defined for function declarations: The binding (loosely, variable) for the function is both declared and initialized with the function object:
console.log(example); // Shows the function
function example() {
}
It's just that that's not how var is defined, not least because hoisting the initialization expression (rather than undefined) would be much more complicated than hoisting the initialization of a function identifier, because var initializers can be any arbitrary expression. So instead, var variables are initialized with undefined.
Fast-forward several years and the initialization of let, const, and class aren't hoisted at all (only the declaration), leading us to the Temporal Dead Zone between declaration and initialization during which you can't access them, because that was deemed more useful than hoisting undefined:
console.log(example); // ReferenceError
let example = 42;
This question already has answers here:
var functionName = function() {} vs function functionName() {}
(41 answers)
Closed 8 months ago.
const func = () => {
someFunction() // error here
return function someFunction() {
console.log('hello')
}
}
func()
I've created closure and wanted to check hoisting inside of func function. Each time when you create function declaration it hoists your variable up to the top. Why is someFunction not hoisted?
When you put a function after return statement, it no longer is a function declaration, but rather a function expression. Unlike declarations, function expressions are not hoisted.
Function expressions in JavaScript are not hoisted, unlike function
declarations.
- MDN
You have a (named) function expression in your return statement. This function is not a function statement and because of this, it is not hoisted.
Another reason is, a function expression has no name. That means, you can not access it by the a name outside of the function. The name of a function expression is only available inside of the function with it name (for example for recursions).
This question already has answers here:
Javascript function scoping and hoisting
(18 answers)
Are variables declared with let or const hoisted?
(7 answers)
Closed 3 years ago.
Using older syntax
Prints "this is myfunc1"
myfunc1();
function myfunc1() {
console.log("this is myfunc1");
}
Using es6 syntax
This gives error "myfunc2 is not a function"
myfunc2();
var myfunc2 = () => {
console.log("this is myfunc2");
}
Function declarations are hoisted.
Variable declarations using var keyword are also hoisted (meaning the Javascript engine "knows" the variable has been declared) but, because assignments are not hoisted, the variable will contain undefined until the line of code that does the assignment is executed.
Do not consider this "old" and "new" syntax.
Function declarations, function expressions, and arrow functions all have different behaviour. While arrow functions were introduced to the language more recently, they are not a replacement for function declarations or function expressions.
This question already has an answer here:
Why JavaScript function declaration behave differently in chrome and safari? [duplicate]
(1 answer)
Closed 5 years ago.
In a book You Don't Know JS: Scope & Closures There is this sample of code I don't understand fully.
"Function declarations that appear inside of normal blocks typically hoist to the enclosing scope, rather than being conditional as this code implies:"
foo(); // "b"
var a = true;
if (a) {
function foo() { console.log( "a" ); }
}
else {
function foo() { console.log( "b" ); }
}
What does it mean? How is it even possible? Is the conditional not working?
It's happening because function declarations are moved to the top of the file by the javascript parser. That's what they mean by hoisting. The last declaration of foo overwrites the first when they are hoisted.
This question already has answers here:
var functionName = function() {} vs function functionName() {}
(41 answers)
Are named functions preferred over anonymous functions in JavaScript? [duplicate]
(4 answers)
Closed 9 years ago.
I saw the following JavaScript functions works exactly same, Then what is the difference between them other than syntax.
The function are:
var functionName=function(){
//some code here
};
function functionName(){
//some code here
}
I call them in the same way as:
functionName();
Please dont' tell me there syntax is different, Other than that is there any difference like
1)speed of execution
2)Memory utilization etc.
Thanks in advance!
This has been answered many times in StackOverflow. It is just the way of naming. So taking up some points from the answers, I would say:
Function declarations and variable declarations are always moved ("hoisted") invisibly to the top of their containing scope by the JavaScript interpreter. Function parameters and language-defined names are, obviously, already there.
Advantages & Disadvantages:
There are few advantages to naming functions:
names for meta analysis. functionInstance.name will show you the name.
Far more importantly, the name will be printed in stack traces.
names also help write self documenting or literate code.
There is a single disadvantage to named functions expressions
IE has memory leaks for NFE
Another main difference
The difference is that functionTwo is defined at parse-time for a script block, whereas functionOne is defined at run-time. For example:
<script>
// Error
functionOne();
var functionOne = function() {
}
</script>
<script>
// No error
functionTwo();
function functionTwo() {
}
</script>
References
var functionName = function() {} vs function functionName() {}
Are named functions or anonymous functions preferred in JavaScript?
Named function expressions demystified
Function Declarations vs. Function Expressions.
var functionName = function() {} vs function functionName() {}
1st one is Named Function Expressions, which should return some value to the caller.
2nd one is just a function, it's upto you whether you return value or not