预编译
- 语法分析 通篇扫面但是不执行
- 预编译
- 解释代码
可以函数先执行 ，再定义，由于预编译
函数声明整体提升
变量 声明提升
由于预编译：eg:
-
预编译1.1 函数声明整体提升
<script type="text/javascript"> test(); function test(){ console.log('a') } </script> //a -
预编译1.2
<script type="text/javascript"> function test(){ console.log('a') } test(); </script> //a -
预编译1.3
//123<script type="text/javascript"> var abc =123; console.log(abc) -
预编译1.4 变量 声明提升
<script type="text/javascript"> console.log(abc) var abc =123; </script> //undefined -
预编译1.5
<script type="text/javascript"> console.log(abc) </script> //报错
暗示全局变量 imply global window所有
a =123
console.log(a)
//123
在全局上 var 声明的变量也归window所有 window是全局的域
window{
a：123
}
var a = 123;
//二者一致
-
a是全局对象所有window
window.a=10 // 发个文window.a 结果为10 //直接访问a等于10 <script type="text/javascript"> function test(){ var a=b=123; } test(); //window.a-----undefined //window.b-----123 //a是局部， b是全局 </script> -
window就是全局
<script type="text/javascript"> var a=123; //window.a-----123 </script> -
<script type="text/javascript"> var a=123; var b=123; var c=123; window{ a:123, b:123, c:123 } </script> //访问a就是全局的a
在全局上预编译过程
<script type="text/javascript">
function fn(a) {
console.log(a) //1
var a = 123;
console.log(a) //123
function a() {}
console.log(a);
var b = function() {}
console.log(b);
function d() {}
}
fn(1)
</script>
// 预编译发生在函数执行的前一刻
-
1.创建ao对象 (活跃对象，执行期上下文)
-
2.函数里面的形参和变量声明
-
3.AO的赋值
AO{ a:undefined b:undefined } -
4.将实参与形参变量相统一,赋值有的就不用再写了
-
5.函数体里找函数声明 有的不用再写了 函数体
<script type="text/javascript">
function fn(a) {
console.log(a) //function a(){}
var a = 123;
console.log(a) //123
function a() {}
console.log(a);//123
var b = function() {}
console.log(b);//function(){}
function d() {}
}
fn(1)
</script>
AO {
a: undefined,
b: undefined,
d: function d(){}
}
AO{
a:123,
b:function(){}
d:function(){}
}
eg:
<script type="text/javascript">
function test(a,b) {
console.log(a) //1
c = 0;
var c;
a = 3;
b = 2;
console.log(b) //2
function b() {}
function d() {}
document.write(b)//2 由于已经提升了 不需要再是函数了
}
test(1)
</script>
<!-- AO{
a: 3,
c:0,
b:function a(){},
d:function d(){}
} -->
-
形参和变量声明 a,b,c 都是undefined
-
实参形参相统一 a = 1
-
.函数体里找函数声明 b d 变为函数体
-
函数权限最高
<script type="text/javascript"> function test(a, b) { console.log(a) // function a(){} console.log(b)//undefined var b = 234; console.log(b)//234 a = 123; console.log(a)//123 function a() {} var a; b = 234; var b = function() {}; console.log(a)//123 console.log(b) //function (){} } test(1) </script -
形参和变量声明 a,b 都是undefined
-
实参形参相统一 a = 1
-
.函数体里找函数声明 a function a(){} 变为函数体
-
函数权限最高
-
var b = function() {};是函数表达式，在函数体位置值不会改变，只有最后会赋值
-
GO===window
-
window.a===a
-
任何全局变量都是window所有
-
go和ao的区别,先发生go
-
全局的go要发生在执行前一刻
-
go与ao都有用ao的
全局go与ao 1
<script type="text/javascript">
// 全局时使用
// Go{
// test: function test() {......函数体}
// }
console.log(test)// function test(test) {......函数体}
function test(test) {
console.log(test)// function test() {} ao的
var test = 234;
console.log(test); //234
function test() {}
}
test(1)
var test=123
</script>
<!-- 变量提升之后就不看了，直接看执行函数前一刻是ao -->
AO{
test: function test() {}
}
go 与ao执行顺序 2
<script type="text/javascript">
1. go {
global: undefined,
fn: fn() { ....
}
}
2. 执行go
go {
global: 100,
fn: fn() { ....
}
}
3.执行函数fn()
只有console.log
ao{
global:100//go中找到的
}
var global = 100
function fn() {
console.log(global)
}
fn();
</script>
<!-- 全局变量go也要执行，变量提升之后就不看了，直接看执行函数前一刻是ao -->
go 与ao执行顺序 3
<script type="text/javascript">
global = 100;
function fn(){
console.log(global)//undefined
global = 200;
console.log(global);//200
var global =300;
}
fn();
var global;
1.go{
global:undefined,
fn:function fn () {
....
}
}
2.go{
global:100,
fn:function fn () {
....
}
}
3.ao{
global:undefined
}
</script>
go 与ao执行顺序 4
<script type="text/javascript">
function test() {
console.log(b) //undefined
global = 200;
if (a) { //undefined
var b = 100; //不执行
}
console.log(b) //undefined
c = 234;
console.log(c);
}
var a;
test();
a = 10;
console.log(c)c:234//234//234
1. go {
a: undefined,
test: function test() { ....
},
c:234
}
2. 执行函数 不管有没有if都会预编译
ao {
b: 100,
}
go 与ao执行顺序 5
<script type="text/javascript">
function bar() {
return foo;
foo = 10;
function foo (){}
var foo = 11;
}
console.log(bar()); // function foo (){}
1. go {
bar: function bar() { ....
}
}
2. 执行函数 不管有没有if都会预编译
ao {
foo: function foo (){},
}
</script>
<script type="text/javascript">
console.log(bar());//11
function bar() {
foo = 10;
function foo (){}
var foo = 11;
return foo;
}
go{
bar:function bar() {....}
}
ao{
foo: 11
}
</script>
go 与ao执行顺序 6
<script type="text/javascript">
// go{
// a:100,
// e:1,
// demo:function demo(e) {...},
// f:123
// }
a = 100;
function demo(e) {
// ao{
// e:function e() {},
// b:undefined,
// c:undefined,
// a:10,
//
// }
function e() {}
arguments[0] = 2;
document.write(e);//2
if (a) {
var b = 123;
function c() {
// 猪都能做出来
}
}
var c;
a = 10;
var a;
document.write(b);//undefined
f = 123;
document.write(c);//undefined
document.write(a+"-+---");//10
}
var a;
demo(1);
document.write(a+"-----");//100 （全局的100）
document.write(f);//123
</script>
