This question already has answers here:
var functionName = function() {} vs function functionName() {}
(41 answers)
Closed 2 years ago.
What is the difference between this (a 'standalone' function):
function standaloneFunction () {
console.log('standaloneFunction runs, success')
}
standaloneFunction()
...and this (a function inside a variable):
let variableFunction = function variableFunction () {
console.log('function inside let has same name as the variable, runs? - yep, does.')
}
variableFunction()
Is it a problem that the variable and the function share the same name?
it doesnt seem so - i speculate this is because it has something to do how variables
and functions are saved in memory? Functions in their entirety, and variables only their declaration?
When i do console.log(this), i can't find the 'variableFunction' in the execution
context of 'this' - however, 'standaloneFunction' does appear.
Have you, as a beginner, also asked yourself such questions? Am i being too picky about such details?
Should i already use es6 syntax?
Please also don't hold back with any advice regarding articulating my question.
Thanks to everyone who has taken their time to read this.
The first is a function declaration, which will be hoisted. The second is a named function expression, but I think an anonymous function expression would be better in this case since there’s no need to name the function, e.g. let variableFunction = function() {…}.
Please see What is the difference between a function expression vs declaration in JavaScript?
Related
This question already has answers here:
Javascript function scoping and hoisting
(18 answers)
Closed 5 years ago.
By trying to override a function I occurred in this odd behaviour. I hope to find an answer after having searched and read about function declaration methods without success.
In a script, if I declare this
var someFunction = function(){
alert("a");
}
someFunction();
someFunction = function(){
alert("b");
}
By calling someFunction I will have an output of "a"
But if I declare the two functions in this way
function someFunction(){
alert("a");
}
someFunction();
function someFunction(){
alert("b");
}
My output will be "b"
What is the difference here? I understand the first example is assigning to a variable an anonymous function. But the second example is totally unexpected and new to me.
I tested on all browsers and the output is the same.
The difference is the fact you are calling an anonymous function in the first example, Javascript gets evaluated top to bottom. In the case of an anonymous function it isn't actually executed UNTIL it is called later on.
This question already has answers here:
var functionName = function() {} vs function functionName() {}
(41 answers)
Closed 8 years ago.
few years back people always define function like this way
1) function foo() {}
now i have noticed people define function like this way
2) var foo= function () {}
3) foo: function() {}
4) var GaugeBar = GaugeBar || {};
GaugeBar.generate = function (percentage) {}
so anyone JavaScript expert would tell me why people follow different approach for defining function? each signature has any special significance ?
when we should follow which one?
looking for good explanation. thanks
I think that there is some confusion in your question - the only valid approach to define a function is 1) and 2). The other two are just different uses of functions in objects.
I personally like to define named functions (function myFunc () {}) because if my program crashes the function names will appear in stack traces. However, there are situations where I use anonymous functions if those functions are not part of a public API or if they are used only once in my program.
Option 3) is basically a function that gets assigned to an object:
var myObject =
{ func: function () {}
, func2: function () {}
}
Option 4) is merely a way how to ensure that a variable contains an object and after that adding some functions to that object.
In practical terms, there is no difference whether you give your functions a name or you use anonymous functions (except for the stack traces and for differences already described in this SO question) and I believe it depends on the programmer's preferred code style. I would love if everyone named their publicly accessible functions as it makes debugging easier, but that's up to each developer to decide.
This question already has answers here:
What is the (function() { } )() construct in JavaScript?
(28 answers)
Closed 8 years ago.
I just encountered this variable declaration syntax for the first time.
var myVar = (function() {
return 1;
})();
My 2 main questions are..
What is it called, and why is it legal?
Forgive me if this question has been asked before, I tried searching around but I have no idea what this notation is called so I wasn't able to find anything.
Also, I should add, what is the function of the 2 sets of parentheses? The first of which encloses the function, the second of which is empty.
Self executing functions are typically used to encapsulate context and avoid name collusions. Any variable that you define inside the (function(){..})() are not global.
The following code:
var same_name = 1;
var myVar = (function() {
var same_name = 2;
console.log(same_name);
})();
console.log(same_name);
produces this output:
1
2
By using this syntax you avoid colliding with global variables declared elsewhere in you javascript code.
I am not sure what this is called, other than defining an anonymous function and immediately invoking it.
It is perfectly legal, because
Defining an anonymous function is legal.
Invoking it and assigning the return value is also legal.
The end result is that myVar = 1.
This is an anonymous function (also called lambda function) that is being executed immediately with its return value (1) being assigned to a variable (myVar). It's legal because the specification says it is. It is a very common feature in many languages.
This question already has answers here:
var functionName = function() {} vs function functionName() {}
(41 answers)
Closed 9 years ago.
I know what the difference between these two are:
var myFunction = function(a) { ... }
function myFunction2(a) { ... }
I just can't figure out when I should use the first one and when the second one.
I saw this var functionName = function() {} vs function functionName() {} but as I said, I know what the difference between these two are.
well, the two options have pros and cons as told in the duplicate post. If you use:
var functionOne = function () { … }
function functionTwo () { … }
then functionOne won't exist in the block prior to its definition, and is being defined at runtime. Whereas the other option, functionTwo is defined at parse time and can be called anywhere in the program. Another thing that changes is the behavior of this inside the function.
So basically, your question is:
how do I want to scope my function?
if scope does not matter, do I prefer run time or parse time?
To get the full answers to those questions, I really advice you to read and reread the short book from Crockford "Javascript the good parts", and it looks like #wumm's suggested article is pretty relevant as well.
This question already has answers here:
Closed 12 years ago.
Possible Duplicates:
“Usual” functions vs function variables in JavaScript
What do you call this JavaScript syntax, so I can research it?
Is there a fundamental difference between
function foo()
{
things();
}
and
var foo = function()
{
things();
}
Or is function ... just syntactical sugar?
Thanks in advance.
They are different (but produce similar results). Basically, the first is an actual named function. The second is a regular variable declaration with an anonymous function attached to it. There are some subtle differences...they are summed up nicely here:
JavaScript Function Declaration Ambiguity (Be sure to read the comments too...more good info there)