js运行三部曲
语法分析
预编译
解释执行
预编译
(函数声明 整体提升)
(变量 声明提升)
如果变量未经声明就赋值,此变量就为全局对象所有。
a = 123; -----> window.a = 123;
一切声明的全局变量,全是window 的属性。
var b = 123; ----> window.b = 123;
window 为全局对象,就是全局的域,window 也叫 GO (Global Object)
预编译四部曲
1.创建AO对象 (Activation Object,执行期上下文,也叫作用域)
2.找形参和变量声明(var a),将变量和形参名作为AO属性名,值为 undefined
3.将实参值和形参统一
4.在函数体里面找函数声明(function b () {}),函数名为AO属性名,值赋予函数体
// 例一
function fn(a){
console.log(a);
var a = 123;
console.log(a);
function a () {}
console.log(a);
var b = function () {}
console.log(b);
function d () {}
}
fn(1);
/*
--第一步 //形参和变量声明值为undefined
AO{
a : undefined
b : undefined
}
--第二步 //实参和形参值统一
AO{
a : 1
b : undefined
}
--第三步 //函数声明,赋值函数体
AO{
a : function a () {}
b : undefined
d : function d () {}
}
*/
// 即整理为
function fn (a){
function a () {}
function d () {}
console.log(a); // function a () {}
var a = 123;
console.log(a); // 123
console.log(a); // 123
var b = function () {}
console.log(b); // function () {}
}
fn(1);
// 例二
function test(a,b){
console.log(a);
c = 0;
var c;
a = 3;
b = 2;
console.log(b);
function b () {}
function d () {}
console.log(b);
}
test(1);
// 整理为
function test(a,b){
function b () {}
function d () {}
var c;
console.log(a); // 1
c = 0;
a = 3;
b = 2;
console.log(b); // 2
console.log(b); // 2
}
test(1);
// 例三
console.log(test);
function test(test){
console.log(test);
var test = 234;
console.log(test);
function test() {}
}
test(1);
var test = 123;
// 整理为
console.log(test); // function test(test){ ....... }
function test(test){
function test() {}
var test;
console.log(test); // function test(){}
test = 234;
console.log(test); // 234
}
test(1);
var test = 123;
// 例四
function test (){
console.log(b);
if(a){
var b = 100;
}
console.log(b);
c = 234;
console.log(c);
}
var a;
test();
a = 10;
console.log(c);
// 整理为
function test(){
var b;
console.log(b); // undefined
if(a){ // a 为 undefined
b = 100;
}
console.log(b); // undefined
c = 234;
console.log(c); // 234
}
var a;
test();
a = 10;
console.log(c); // 234
// 例五
function bar(){
return foo;
foo = 10;
function foo(){}
var foo = 11;
}
console.log(bar());
// 整理为
function bar(){
function foo(){}
var foo;
return foo; // function foo(){}
foo = 10;
foo = 11;
}
console.log(bar()); // function foo(){}