The difference between var foo = function () {} and function foo()

This time I will bring you the difference between var foo = function () {} and function foo(). What are the precautions when using var foo = function () {} and function foo()? , the following is a practical case, let’s take a look.

One day when I was writing code, I suddenly encountered this problem. I took the opportunity to summarize a wave

JavaScript The "hoist" of function and variable declarationsbehavior

Simply put, if we use anonymous function

var a = {}

this way, after compilation The variable declaration a will be "advanced", but its assignment (that is, a) will not be advanced.

That is, the anonymous function is initialized only when it is called.

If you use

function a () {};

, the function declaration and its assignment will be advanced after compilation.

That is to say, the preprocessing of the function declaration process is completed before the entire program is executed, so as long as it is in the same scope, it can be accessed, even if it is called before definition.

Look at an example

function hereOrThere() { //function statement
  return 'here';
}
console.log(hereOrThere()); // alerts 'there'
function hereOrThere() {
  return 'there';
}

We will find that alert(hereOrThere) will alert('there') when the statement is executed! The behavior here is actually very unexpected. The main reason is the "early" behavior of JavaScript function declarations. In short, JavaScript allows us to use variables and functions before they are declared, and the second definition overrides the first. definition. In other words, after the above code is compiled, it is equivalent to

function hereOrThere() { //function statement
 return 'here';
}
function hereOrThere() {//申明前置了，但因为这里的申明和赋值在一起，所以一起前置
 return 'there';
}
console.log(hereOrThere()); // alerts 'there'

The behavior we expect

var hereOrThere = function () { // function expression
  return 'here';
};
console.log(hereOrThere()); // alerts 'here'
hereOrThere = function () {
  return 'there';
};

After this program is compiled, it is equivalent to:

var hereOrThere；//申明前置了
hereOrThere = function() { // function expression
 return 'here';
};
console.log(hereOrThere()); // alerts 'here'
hereOrThere = function() {
 return 'there';
};

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

How does the javascript module loader run

How to use the automatic generator in ionic2

Set cookie expiration to automatically update and automatically obtain

The above is the detailed content of The difference between var foo = function () {} and function foo(). For more information, please follow other related articles on the PHP Chinese website!