JS函数作用域与执行上下文

目录

执行上下文

1. 代码分类

2. 全局执行上下文

3. 函数执行上下文

4.执行上下文栈

1. 理解

2. 理解

3. 流程分析

 5. 作用域与执行上下文

1.作用域

2、作用域分类

3、作用域与执行上下文

4、 区别与联系

区别1：创建时间不同

区别2：状态不同

联系

执行上下文

1. 代码分类

全局代码
函数（局部）代码

2. 全局执行上下文

• 在执行全局代码前将window确定为全局执行上下文
• 对全局数据进行预处理
  • var 定义的全局变量 ⇒ undefined,添加为window的属性
  • function声明的全局函数 ⇒ 赋值（fun），添加为window的方法
  • this ⇒ 赋值（window）
• 开始执行全局代码

3. 函数执行上下文

1. 在调用函数，准备执行函数体之前， 创建对应的函数执行上下文对象（虚拟的，存在于栈中），对局部数据进行预处理

• 形参变量⇒ 赋值(实参)⇒ 添加为执行上下文的属性
• arguments⇒ 賦值(实参列表)，添加为执行上下文的属性，
• var定义的局部变量⇒ undefined, 添加为执行上下文的属性
• function声明的函数⇒ 赋值(fun)。 添加为执行上下文的方法
• this⇒ 赋值(调用函数的对象)开始执行函数体代码

2. 开始执行函数体代码

4.执行上下文栈

1. 理解

        var a = 10;
        var bar = function (x) {
            var b = 5;
            foo(x + b);
        }
        var foo = function (y) {
            var c = 5;
            console.log(a + c + y);
        }

        bar(10)
        
        bar(10);  //30,因为调用bar(10)的时候，上面的两条赋值语句都执行了哦

在刚刚的引例中(两个bar(10))，产生了5个函数上下文执行对象（调用时产生），四次调用，一次window。
产生的上下文：调用函数的次数 加 上全局执行上下文

2. 理解

• 在全局代码执行前, JS引擎就会创建一个栈来存储管理所有的执行上下文对象
• 在全局执行上下文(window)确定后,将其添加到栈中(压栈)
• 在函数执行上下文创建后，将其添加到栈中(压栈)
• 在当前函数执行完后，将栈顶的对象移除(出栈)
• 当所有的代码执行完后，栈中只剩下window

3. 流程分析

 5. 作用域与执行上下文

1.作用域

2、作用域分类

• 全局作用域
• 函数作用域
• 没有块作用域（ES6有了）

3、作用域与执行上下文

4、 区别与联系

区别1：创建时间不同

全局作用域之外，每个函数都会创建自己的作用域，作用域在函数定义的时候就已经确定了，而不是在函数调用时。
全局执行上下文环境是在全局作用域确定之后，js代码马上执行之前创建
函数执行上下文是在函数调用时，函数体代码执行之前创建。

区别2：状态不同

作用域是静态的，只要函数定义好了就一直存在，不会再变
上下文环境是动态的，调用函数的时候创建，函数执行完毕上下文环境就会被释放

联系

上下文环境（对象）是从属于所在的作用域
全局上下文环境⇒ 全局作用域
函数上下文环境⇒ 对应的函数使用域