稳扎稳打JS——执行上下文

上下文环境的初始化在代码执行前完成

• JS有三种作用域：全局作用域、函数作用域、eval作用域(不常用，不做介绍)。

• 在JS代码执行前，首先会对这三种作用域进行上下文环境的准备工作，准备内容如下：

  1. 全局作用域的上下文准备工作
     
     • 将全局变量设为undefined
     • 将函数表达式的值设为undefined
     • 为函数声明直接赋值
     • 将window对象赋给this
  2. 函数作用域的上下文准备工作
     
     • 确定自由变量的作用域
     • 为函数的参数和arguments对象赋值
     • 将局部变量的值设为undifined
     • 将函数表达式的值设为undifined
     • 为函数声明直接赋值

//将全局变量的值设为undefined
console.log(a); //undefined
var a = 1;

//将window对象赋给this
console.log(this);

//将函数表达式的值设为undefined
console.log(fn1);//undefined
var fn1 = function(){
    //……
}

//为函数声明直接赋值
console.log(fn2); //输出函数的代码
function fn2(){
    //……
}

//函数作用域
function fn3(b,c){
    //确定自由变量的作用域
    console.log(a);

    //为局部变量赋上undefined
    console.log(x);//undefined
    var x = 123;

    //为函数的参数赋值
    console.log(b,c); //2,3

    //为arguments赋值
    console.log(arguments); //[2,3]
}

fn3(2,3);

• 函数作用域中this的是在JS运行时才能确定，而全局作用域中的this在准备上下文环境的时候就确定了(window)。

• 定义函数有两种方法：函数声明式定义、函数表达式定义，如下所示：

//函数声明式定义
function fn(a,b){
    //……
}

//函数表达式定义
var fn = function(a,b){
    //……
}

• 两者区别如下：

  • 若采用函数声明式定义，函数调用语句和函数声明语句的先后次序无关。
    因为在代码运行前的准备上下文环境过程中，函数的初始化已经完成，所以运行时无论函数调用语句在哪儿，JS编译器都能调用这个函数。

  • 若采用函数表达式来定义函数，则函数定义一定要在函数调用语句之前！
    因为在这种方式中，函数的初始化是在运行时完成，在代码运行前只是将undefined赋给函数变量。因此在这种情况下，函数调用语句必须在函数定义后。

• JS中作用域只有三种：全局作用域、函数作用域、eval作用域。除此之外就没有作用域了！如：for、if、while等都不是独立的作用域！ 因此在里面定义的局部变量都属于其所属的外层作用域。