javascript在执行前会有一个预编译过程,预编译过程会先预声明变量再预定义函数,比如
<script>
console.log('^-^^-^^-^');
console.log(h);
var h = 'hello';
func();
function func(){
console.log(h);
}
</script>
<script>
alert(h);
</script>
预编译过后,类似于
<script>
var h; // h=undefined
function func(){
console.log(h);
}
console.log('^-^^-^^-^');
console.log(h);
h = 'hello';
func();
</script>
<script>
console.log(h);
</script>
运行输出为:
^-^^-^^-^
undefined
hello
hello
以及:
<script>
var w='world';
func();
function func(){
console.log(w);
var w = 'dddddd';
}
</script>
预编译后,类似于:
<script>
var w;
function func(){
var w;
console.log(w);
w = 'dddddd';
}
w='world';
func();
</script>
所以输出为 undefined
而不是world
这就是所谓的变量提升和函数提升
因此:
function func(){
}
和
var func = function(){
}两种函数定义方式的不同就显而易见了
// 后者属于变量赋值,预编译的时候,会把func变量声明提升,定义不提升
// 所以 这就是func不能在var func = function(){}前面执行的原因,而前者可以
从上面的一个例子中,第二个script输出第一个script的全局变量h的值,可以看出,如果一个文档有多个<script>…</script>,则每个代码区域是一个全局,因此如果多人合作写项目时,为了防止变量污染全局,代码打架,就需要定义自己的代码封闭区域.
这时候就需要:立即执行函数了.
(function(){
...
})();
// 用()把function(){}引起来
//会把函数当作返回值返回,然后直接执行
或者
(function(){
...
}());// 直接强制执行函数,并把函数执行的返回值返回