javascript的解析顺序
1、先找出所有的定义
var 变量名 ：仅仅找出变量名字，不会进行赋值 ===>这叫 提升变量声明
function 函数名（） {} 找出函数块
2、执行步骤 除了定义其他的都是执行步骤 = 赋值 运算 函数执行 等等
var的时候
例：
alert( a ); ==>弹出undefined
var a = 10;//var a先被提取出来 a = 10;这是执行步骤
alert( a ); ===>弹出10
js先看所有的定义var a ;先提取变量 var a 全局就有 a 了 再来执行 alert( a ); ==>弹出undefined
注意：
var 是定义步骤
=是执行步骤
上面的代码可以看成：
var a ;
alert( a ); ==>弹出undefined
a = 10; //执行步骤
alert( a ); ===>弹出10
函数的时候
fn()
function fn(){
alert( 1 );
}
先找出函数块 function fn(){alert( 1 );} 然后再 执行 fn();放在什么地方都可以
alert( x )//弹出undefined
x();//报错
//这里是提取var x ==>undefined 再拿undefined来执行；
//再执行 x ();加括号就是执行函数 x不是函数会报错；
var x = function (){
alert( 2 );
}
x(); ==>这里就可以执行；x 就是等于function (){alert( 2 );} 弹出2
完整的解析顺序
<script type="text/javascript">
var a = 10;
x();
function x(){
var b = 20;
alert( b );
}
alert( a );
/*
执行顺序：
执行全局作用域：
1、定义
var a ;
function x(){
var b= 20;
alert( b );
}
2、执行步骤
a = 10;
x(); ====>新的作用域触发====>依照上面的规则：1、定义
var b;
2、执行步骤
b = 20;
alert( b ); 弹出 20；
回来父级这层开始向下执行
alert( a ); 弹出10；
*/
</script>
同局作用域 变量与函数重名
函数的优先级比较高
var a;
function a(){
alert(1);
}
a();
先执行定义步骤 var a function a(){alert(1);}
var a会被函数覆盖===>保留function a(){alert(1);}
再来执行步骤
a() ==>弹出1；
var a = 10;
function a(){
alert(1);
}
a();
先执行定义步骤 var a function a(){alert(1);}
var a会被函数覆盖===>保留function a(){alert(1);}
再来执行执行步骤
a = 10
a() ==>报错 现在a是10；
练习题
一、
var a = 10;
x();
function x(){
alert( a );
var a = 20;
}
alert( a );
/*
先看全局
1、定义
var a
function x(){}
2、执行
a = 10;
x() ===产生新的作用域===>1、定义
var a
2、执行
alert( a ) ===>弹出undefined
a = 20;
回到父级执行
alert( a )===>弹出 10
*/
二、
<script type="text/javascript">
function a(){
alert(1);
}
var a;
alert( a );
/*
先看全局
1、定义
var a
function a(){ }
2、执行
alert( a ); ==>弹出function a(){alert(1);}
函数没有执行
*/
</script>
三、
<script type="text/javascript">
function a(){
alert(1);
}
var a;
alert( a );
/*
先看全局
1、定义
var a
function a(){ }
2、执行
alert( a ); ==>弹出function a(){alert(1);}
函数没有执行
*/
</script>
四、
<script type="text/javascript">
console.log( a );
var a = 10;
console.log( a );
function a(){console.log( 20 )};
console.log( a );
var a = 30;
console.log( a );
function a(){console.log( 40 )};
console.log( a );
</script>
打印出 function a(){console.log( 40 )}; 10 10 30 30
/*
全局
1、定义
var a
function a(){console.log( 20 )};
var a
function a(){console.log( 40 )};
最后保留 function a(){console.log( 40 )};
2、执行
console.log( a ); 弹出 function a(){console.log( 40 )};
a = 10;
console.log( a ); 弹出 10；
function a(){console.log( 20 )}; 这是定义的步骤
console.log( a ); 弹出 10；
a = 30;
console.log( a ); 弹出 30；
function a(){console.log( 40 )}; 这是定义的步骤
a = 30;
console.log( a ); 弹出 30；
*/
五、
<script type="text/javascript">
var a = 10;
alert( a );
a();
function a(){
alert(20);
}
/*
1、定义
var a
function a(){ }
2、执行
a = 10;
alert( a );==>10;
a(); ===>报错
*/
</script>
六、
<script type="text/javascript">
a();
var a = function (){alert(1)};
a();
var a = function (){alert(2)};
a();
var a = function (){alert(3)};
/*
1、定义
var a
2、执行
a() ===>报错 下面就不执行了
*/
</script>
补充的注意事项
alert( a )
if( false ){
var a = 10;
}
全局作用域
1、编译：（ 不会看执行部分 在同个作用域下无论 if for ...都会先把声明的找出来，不受任何影响 ）
所以可以找到 var a
2、执行
alert( a ) ===>undefined
if( false ){ } 再执行这个
传参数的时候
var a = 5;
function fn( a ){
// 隐藏一个步骤 把实参传给 形参 a = 5 的步骤
alert( a ); ===>弹出5
var a = 10;
alert( a );
}
fn( a )
