浏览器执行javaScript代码基础

JavaScript 代码执行分为两个阶段：

编译阶段和执行阶段

相关概念

• 编译结果：输入一段代码，经过编译后，会生成两部分内容：执行上下文（Execution context）和可执行代码
• 基础变量存储在栈（执行上下文）中，对象、数组、函数存储到堆 (HEAP）中，在栈空间中只是保留了对象的引用地址，当 JavaScript 需要访问该数据的时候，是通过栈中的引用地址来访问的
• 执行上下文：JavaScript 执行一段代码时的运行环境，比如调用一个函数，就会进入这个函数的执行上下文，确定该函数在执行期间用到的诸如 this、变量、对象以及函数等
• 调用栈：会存在多个执行上下文，在执行上下文创建好后，JavaScript 引擎会将执行上下文压入栈中
• 栈溢出：调用栈是有大小的，当入栈的执行上下文超过一定数目，JavaScript 引擎就会报错
• 编译阶段会存在变量提升
• 作用域：作用域是指在程序中定义变量的区域，该位置决定了变量的生命周期。在 ES6 之前，ES 的作用域只有两种：全局作用域和函数作用域。全局作用域中的对象在代码中的任何地方都能访问，其生命周期伴随着页面的生命周期。函数作用域就是在函数内部定义的变量或者函数，并且定义的变量或者函数只能在函数内部被访问。函数执行结束之后，函数内部定义的变量会被销毁。ES6之后，存在块级作用域，就是使用一对大括号包裹的一段代码，比如函数、判断语句、循环语句，甚至单独的一个{}都可以被看作是一个块级作用域。
• 闭包：当通过调用一个外部函数返回一个内部函数后，即使该外部函数已经执行结束了，但是内部函数引用外部函数的变量依然保存在内存中，我们就把这些变量的集合称为闭包。
• this: 在对象内部的方法中使用对象内部的属性是一个非常普遍的需求。但是 JavaScript 的作用域机制并不支持这一点，基于这个需求，JavaScript 又搞出来另外一套 this 机制。ES6 中的箭头函数并不会创建其自身的执行上下文，所以箭头函数中的 this 取决于它的外部函数。普通函数中的 this 默认指向全局对象 window。