V8底层运行机制之执行上下文及堆栈内存原理刨析

1、理论讲解：

我们编写的JS代码都是执行在一个环境里的，例如：

浏览器（引擎）
node（基于v8渲染js）
webview（v8引擎）

Execution Context Stack:

执行环境栈，栈内存（从内存中分配出的一个）

EC Execution Context 执行上下文
AO Active Object 私有对象
VO Variable Object 变量对象
GO Global Object 全局对象
SCOPE 作用域：创建函数的时候就赋予的
SCOPE-CHAIN 作用链域

ECStack

浏览器想要执行js代码，需要提供一个代码执行环境ECStack,执行环境栈
作用：1、共代码执行。2、存储原始值 &变量

EC

在编程语言中，代码执行时，为了区分全局和函数执行所处的不同作用域
（目的是为了区分每个词法作用域下代码的独立性）而创建出的执行上下文

VO - AO

每一个上下文代码执行的时候，可能都会创建变量，所以在每一个上下文中都会有一个存储变量的空间VO
变量对象：存放当前上下文中的变量
全局称为VO(G)
私有上下文中称为AO(XXX)，也是变量对象

GO

浏览器把所有后期需要供JS调用的属性和方法都放置在GO对象中
并且在全局中创建一个window变量指向这个GO对象

2、案例：

简单的案例

案例分析1：

  var a = 12;
  var b = a;
  b = 13;
  console.log(a);

= 赋值操作：
1、先创建一个值(原始值&对象)
原始值：在栈内存中找个位置存储起来
对象：单独开辟一个堆内存空间，用来存储对此的成员等信息
2、声明变量Declare，把声明的变量存储在当前的上下文的”变量对象中的Vo/Ao“
3、让变量和创建的值关联起来Defined定义

画图分析：

image.png

image.png

案例分析2：

var a = {
    n: 12
};
var b = a;
b['n'] = 13;
console.log(a.n);

画图分析：

image.png

案例分析3：

var a = {
    n: 1
};
var b = a;
a.x = a = {
    n: 2
};
console.log(a.x);
console.log(b);

画图分析：

image.png

案例分析4：函数等

var x = [12, 23];
function fn(y) {
    y[0] = 100;
    y = [100];
    y[1] = 200;
    console.log(y);
}
fn(x);
console.log(x);

画图分析：

image.png

创建函数：

1、开辟一个堆内存（在堆中开辟一个空间），有一个16进制的地址
2、存储内容：（1）：函数体中的代码当做字符串先存起来（2）：当做普通对象也会存一些键值对
3、创建函数的时候，声明了其作用域scope（创建函数所在的上下文）
4、把堆内存的地址放置哎栈中，供函数名（变量）使用

执行函数：

1、形成一个私有的执行上下文EC，然后进栈执行AO。。。
2、初始化作用域链
初始化this
初始化arguments参数集合
形参赋值（形参是私有变量&当前私有上下文中声明的变量也是私有变量）
变量提升
代码执行
3、根据情况，决定当前形成的私有上下文是否会出栈释放（一般都会出栈释放）

案例分析5：

let x = 5;
function fn(x) {
    return function (y) {
        console.log(y + (++x));
    }
}
let f = fn(6);
f(7);
fn(8)(9);
f(10);
console.log(x);

画图分析：

image.png

函数执行，产生一个私有的上下文，然后进栈
1、当函数执行完，一般情况下，当形成的上下文都会被释放掉（优化栈内存）：上下文被释放，之前存储的私有变量也会被释放
2、但是如果当前上下文中的某些东西（一般都是堆内存），被当前上下文以外的事物所占用，则当前上下文不能出栈释放：之前声明的私有变量也都被存储起来
市面上：会把不被释放的上下文称为“闭包”

闭包是一种机制，函数执行产生的上下文，一方面可以保护里面的私有变量不被污染，另一方面如果不被释放，私有的变量及相关信息也都会保存起来，我们把这种“保护”+ “保存”的机制，称为闭包

堆内存释放的问题：
如果当前的堆被占用了（地址被引用了）则不能被释放，如果不被引用，浏览器会在空闲时间释放它

浏览器的垃圾回收机制---GC

• 引用计数 （被占用一次计数累加一，当取消运用再减一）当减到零的时候，会把其释放
• 引用检测 标记清楚 （被占用后做一个标记，当移除引用，取消标记，在浏览器空闲的时候，会把所有未标记的内存回收）

案例分析6：

let a=0,
   b=0;
function A(a){
   A=function(b){
       alert(a+b++);
   };
   alert(a++);
}
A(1);
A(2);

画图分析：

image.png