A deep analysis of the way JavaScript two declares functions

How to declare a function

JavaScript has two ways of declaring functions, one is function expression definition function, that is, we say anonymous function, one is function statement definition function, the following look at the code:

/*方式一*/varfunction() {/* FUNCTION_BODY */};/*方式二*/function FUNCTION_NAME () {/* FUNCTION_BODY */

Distinguish one

The way one is declared after it is first declared and used
The way two is declared can be called first, after the declaration

/*方式一: *先声明后使用 *///f1();这里调用就会出错  varfunction () {         alert("var方式");}f1();//这里使用才正确/*方式二: *可以先使用后声明 *///这里调用可以正常执行  function f2 () {         alert("function方式");}f2();//这里调用可以正常执行

Difference Two

//方式一varfunction() {/* FUNCTION_BODY */};/*这种方式,编译后变量声明 FUNCTION_NAME 会“被提前”了，但是他的赋值（也就是FUNCTION_BODY）并不会被提前。匿名函数只有在被调用时才被初始化。*///方式二function FUNCTION_NAME () {/* FUNCTION_BODY *//*这种方式， 编译后 函数声明 和 赋值 都会被提前。即函数声明过程在整个程序执行之前的预处理就完成了，所以只要处于同一个作用域，就可以访问到，即使在定义之前调用它也可以。*/

Let's look at an example:

function f() {  alert(‘1‘// 弹窗内容是：2function f() {  alert (‘2‘);}

The runtime F () executes alert (' 2 '); The main reason is that the "advance" behavior of the JavaScript function declaration, in short, is that JavaScript allows us to use them before variables and functions are declared, while the second definition overrides the first one. In other words, the above code compiles after the equivalent of:

function f() {  alert(‘1‘);}function f() {  alert (‘2‘);//申明前置了，但因为这里的申明和赋值在一起，所以一起前置// 弹窗内容是：2

Let's look at an example below:

varfunction() {  alert(‘1‘// 弹窗内容是：1function f() {  alert (‘2‘);}

Here is the behavior we are looking for, which is the equivalent of this program compiled:

var//申明前置了function f() {  alert(‘1‘// 弹窗内容是：1function f() {  alert (‘2‘);}

Finally, let's look at an example:

//第一次调用函数 弹窗内容是：2varfunction() {  alert(‘1‘//第二次调用函数 弹窗内容是：1function f() {  alert (‘2‘//第三次调用函数 弹窗内容是：1

See the results, everyone should understand.

Reference content:

Reference content
Reference content

A deep analysis of the way JavaScript two declares functions