This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
JavaScript: var functionName = function() {} vs function functionName() {}
What is the difference between those two functions
function a()
{
b=2;
alert(b);
}
a();
and this function
var a=function()
{
b=2
alert(b);
}
a();
what is the main difference
The main difference is that when you declare function:
function a(){
// something...
}
it becomes accessible in the same scope even before the place in the code where it is declared.
But when you assign anonymous function to a variable:
var a = function(){
// something...
};
it is not available before the assignement.
When the functions are created
It is a result of when the function is actually created. In first case it is created when the code is compiled, while in the second case the function is created when the interpreter reaches the line of assignment.
Test code
You can see the difference I mentioned above by executing the following code (jsfiddle):
try {
a();
} catch(e) {
alert('problem calling function a(): ' + e);
};
try {
b();
} catch(e) {
alert('problem calling function b(): ' + e);
};
function a(){
alert('function a() called');
};
var b = function(){
alert('function b() called');
};
You will see (as in mentioned jsfiddle), that a() function is called properly even before the actual declaration, but b() is not available before the assignment.
The only real difference is that the second function has no name, and that the function a() {} one is hoisted.
The difference is that function a() is defined at parse-time for a script block while var a=function() is defined at run-time.
<script type="text/javascript">
// No errors occured;
function a();
function a(){
console.log("Success");
}
</script>
<script type="text/javascript">
// An error will occured;
a();
var a = function (){
console.log("Success");
}
</script>
Related
How do I call function "a" from "a.v" without a direct reference "a()"
function a(){
alert("1");
this.v=function(){alert("hi")};
}
One way I can think of doing this without repeating a:
function a(){
let indirect = arguments.callee;
alert("1");
indirect.v=function(){ indirect(); };
}
a();
a.v();
But this does not work under strict mode and you must call a before calling a.v.
You could also do:
function a(){
alert('1');
this.v = () => this();
}
a.v = a;
a.v();
This way you don't call a() and it also works under strict mode.
Set its v property outside the function:
function a() {
alert("1");
}
a.v = function() {
a()
alert("hi")
};
a.v()
This question already has answers here:
What are the precise semantics of block-level functions in ES6?
(2 answers)
Closed 4 years ago.
This is the example:
function b() {
console.log(f);
{
function f() {}
}
}
b()
I thought it would become:
function b() {
// hoist to function scope
function f() {}
console.log(f); // should output function f
}
or
function b() {
console.log(f); // should output reference error
{
// just hoist to block scope like this
function f() {}
}
}
but it outputs undefined, like var hoisting. why?
{} creates block scope so
JS engine will interpret your code something like this
function b() {
console.log(f);
{
var f = function f() {};
}
}
b();
So because of block scoping value of f is not available out of block. and since it is defined as var it is hoisted to parent's scope ( function b's scope ) and turns out to be undefined
If you remove {} .
function b() {
console.log(f);
function f() {}
}
b()
It's due to Hoisting. The function f() {} is inside a block, therefore console.log(f) cannot access the function f() {}, that is out of the scope. However, if you keep the console.log(f) inside the block {}. Hoisting should work.
I don't understand a part of the accpeted answer of this OP:
Javascript function scoping and hoisting
Writer says:
"
Also, in this instance,
function a() {}
behaved the same as
var a = function () {};
".
What I know is that function expression is different than function declaration, at least for hoisting. Why are they similar in this case?
Why are they similar in this case?
Because var is hoisted (but not set), like a function declaration is hoisted, meaning that there is an a in the local scope before a = 10; is evaluated, so the global a never gets modified - the identifier lookup finds the local a first so sets that
Related parts of the other question
var a = 1;
function b() {
a = 10;
return;
function a() {}
}
b();
alert(a);
Why is a === 1?
That the answer was trying to say was that b is equal to
function b() {
function a() {}
a = 10;
return;
}
Similar to
function b() {
var a = function () {};
a = 10;
return;
}
i.e. there is an identifier a defined in b, so
function b() {
var a = 10;
return;
}
And now, obviously, the global a will not be modified by b
Please note that the position of the var isn't really important, just that it's there, the following will produce the same behaviour
function b() {
a = 10;
return;
var a;
}
The difference is that the first line is defined at run-time, whereas second line is defined at parse-time for a script block.
Look at the full answer on stack, here : var functionName = function() {} vs function functionName() {}
This question already has answers here:
JavaScript inner-functions and Performance
(2 answers)
Closed 8 years ago.
If i have code:
function A() {
function B() {
}
B();
}
A();
A();
is B function parsed and created each time i call A(so it can decrease performance of A)?
If you want use a function only internally, how about closure. Here an example
var A = (function () {
var publicFun = function () { console.log("I'm public"); }
var privateFun2 = function () { console.log("I'm private"); }
console.log("call from the inside");
publicFun();
privateFun2();
return {
publicFun: publicFun
}
})();
console.log("call from the outside");
A.publicFun();
A.privateFun(); //error, because this function unavailable
function A(){
function B(){
}
var F=function(){
B();
}
return F;
}
var X=A();
//Now when u want to use this just use this X function it will work without parsing B()
I use only jQuery for writing JavaScript code. One thing that confuses me is these two approaches of writing functions,
First approach
vote = function (action,feedbackId,responseDiv)
{
alert('hi');
return feedbackId;
}
Second approach
function vote(action, feedbackId,responseDiv)
{
alert('hi');
return feedbackId;
}
What is the difference between the two and why should one use the first approach or the second approach?
The first is a function expression assigned to the vote variable, the second is a function declaration.
The main difference is that function statements are evaluated at parse time, they are available before its declaration at runtime.
See also:
Named function expressions demystified (article)
Explain JavaScript’s encapsulated anonymous function syntax
function myFunction() {}
...is called a "function declaration".
var myFunction = function() {};
...is called a "function expression".
They're very similar; however:
The function declaration can be declared after it is referenced, whereas the function expression must be declared before it is referenced:
// OK
myFunction();
function myFunction() {}
// Error
myFunction();
var myFunction = function() {};
Since a function expression is a statement, it should be followed by a semi-colon.
See Function constructor vs. function declaration vs. function expression at the Mozilla Developer Centre for more information.
The function declaration syntax cannot be used within a block statement.
Legal:
function a() {
function b() {
}
}
Illegal:
function a() {
if (c) {
function b() {
}
}
}
You can do this though:
function a() {
var b;
if (c) {
b = function() {
};
}
}
The first one is a function expression,
var calculateSum = function(a, b) { return a + b; }
alert(calculateSum(5, 5)); // Alerts 10
The second one is a plain function declaration.