转载:https://www.cnblogs.com/tu-0718/p/9584184.html
可能光这样看,有些小伙伴会有些蒙蔽,不知道到底有什么区别?
请大家先看下面的代码:
<script> y(); function y() { alert(2); }; x(); var x = function() { alert(1); }; </script>
上面的代码运行以后,会先执行y()方法,并弹出2;然后在执行x()方法,但这里会报错:x is not a function
为什么会是这样的呢? 这就是函数定义2种方法的不同造成的。
上述y(),也就是定义函数的第一种方法 (官方称为-声明式定义函数)
大家知道JS变量是有变量声明提前的,其实函数也是有函数名声明提前的。
(另外,函数内部用var声明的局部变量也会把声明提前到函数代码顶部)
浏览器是从上到下开始解析,但因函数名声明提前(当没有解析到该方法代码之前,会自动提升到代码顶部,固能全局调用该方法)
尽管这个时候还没有解析到y()方法的代码,依然可以先调用该方法。所以y()方法会顺利执行,也不会报错。
上述x(),也就是定义函数的第二种方法(官方称为-函数表达式):
而x()方法则会报错提示:x is not a function, 因为第二种函数定义的写法,不会让函数名声明提前。
所以,浏览器从上往下执行,要先执行x()方法的代码,然后才能调用,比如下面这样就不会报错
var x = function() { alert(1); };
x();
推荐第二种方式定义函数
注:函数表达式需要在语句的结尾加上分号,表示语句结束。而声明式定义函数在结尾的大括号后面不用加分号
补充:还有一种函数写法,官方称为(立即执行函数);
有 3 种 写法(推荐第一或第二种):
(function(){ alert(1); })(); (function(){ alert(2); }()); !function(){ alert(3); }();