为顶级代码创建全局执行上下文,即不在任何 fn 内的代码。因此,首先执行 fn 之外的代码。
fn-decln/exprsn 的 fn 主体内的代码仅在调用时执行。
一段JS执行的环境。
存储一些要执行的代码的所有必要信息,例如局部变量、传递给 fn 的 args。
JS 代码始终在 EC 内运行。
无论 JS 项目有多大,都只有一个全局 EC。
默认上下文,为不在任何 fn 内的代码创建。
然后代码在全局EC内部执行
顶层代码执行完毕后,执行fns并等待C/bs
对于每个 fn 调用,都会创建一个新的 EC 来执行该 fn。方法也是如此,因为它们也是附加到对象的 fns。
所有这些 EC 共同构成了调用堆栈。
当所有 fns 执行完毕后,引擎等待 CB 到达并执行它们。前任。点击事件回调,由事件循环提供。
arguments 对象:将传递给 fn 的所有参数存储在其 EC 中。
每个 fn 都有自己的 EC 作为其名称。声明的变量最终位于变量环境中
范围链:
Fns 可以使用作用域链访问 fns 之外的变量。
包含对位于当前 fn 之外的变量的引用并跟踪作用域链,它存储在每个 EC 中。
每个 EC 还获得 'this' 关键字。
以上三个都是在执行之前的“创建阶段”生成的。这些是在顶层运行代码所必需的。
我们不会有:arguments 对象、this 关键字。箭头 fn 使用最接近的常规 fn,即上述两个。
参数:类数组对象,包含传递到常规 fn 的所有参数,而不是箭头 fn。
EC 相互堆叠的地方,以跟踪我们在执行中的位置。最顶层的 EC 是我们正在运行的 EC。当执行结束时,它会从栈顶移除,控制权会转移到底层 EC。
如果存在嵌套的 fn 调用,由于 JS 只有一个执行线程,因此会暂停外层 fn 调用,以便在调用堆栈上返回内层 fn 的执行结果。现在上一个 EC 将成为活动 EC
然后最顶层的 EC 在返回时从调用堆栈中弹出。
调用堆栈中最低的是全局 EC,最上面的是按顺序发生的 fn 调用。
确保执行顺序永远不会丢失。
最终程序完成,全局EC也会从Call Stack中弹出。
Hence, we can say that each EC has: 1. Variable environment 2. Scope chain 3. 'this' keyword
JS 引擎如何组织和访问我们的程序变量。
变量存在于哪里
我们在哪里可以访问某些变量,哪里不能。
JS 具有 Leical 作用域,这意味着作用域是通过代码中 fns 和块的放置来控制的。
前任。嵌套的 fn 可以访问其父 fn 的变量。
声明某个变量的空间或环境(fns 中的变量环境)。它是存储在 fns EC 中的变量 env。
对于 fns,Var env 和scope 都是相同的。
Three scopes in JS are: 1. Global scope 2. Fn scope 3. Block scope [ES6]
作用域是声明变量的地方。因此,对于 Fns 来说也是如此,因为 fns 只是存储在变量中的值。
可以访问某个变量的代码区域。
## Global Scope: For top level code For variables declared outside of any fn or block which are accessible from everywhere Variables in this scope are at the top of scope chain. Hence, can be used by every nested scope.
## Fn Scope: Each fn has creates its own scope Variables are accessible ONLY inside fn, NOT outside. Else Reference Error Also called local scope Fn decln, exprsn, arrow all three create their own scopes. Only way to create scope using ES5 which had only fn & global scope.
## Block Scope: Introduced in ES6, not only fn but {} also create a scope known as block scope which work only for ES6 variables i.e let-const types. DOesn't work for variables declared with 'var' as its fn scoped. Variables accessible only inside block i.e {} This only applies to variables declared with let-const only. Fns are also block scoped in ES6 (only in strict mode, should be used) variables declared using 'var' will be accessible outside the block Scoped to the current fn or the global scope. var variables only care about fn, they ignore blocks. They end up in nearest fn scope.
如果 fn 在其作用域中找不到该变量,它将查找作用域链以找出其外部作用域中的变量。这个过程称为作用域链中的变量查找。反之则不行,即我们无法从 fn 或外部作用域之外访问嵌套的 fn 变量或作用域。
兄弟作用域无法访问彼此的变量
只有最内层的作用域可以访问其外层的作用域,反之则不然。
每个 fn 都有一个 EC,按照调用 fn 的确切顺序放置在调用堆栈上,其变量位于 EC 内。 Global EC 位于调用堆栈的底部
Scope chain:
Its all about the order in which fns are written in the code.
Has nothing to do with order in which fns were called.
Scope chain gets the variable environment from the EC.
Order of fn calls is not relevant to the scope chain at all.
const a = 'Alice'; first(); function first(){ const b = "Hello"; second(); function second(){ const c = "Hi"; third(); } } function third(){ const d = "Hey"; console.log(d + c + b + a); // Reference Error } ## Call Stack order: third() EC - top second() EC first() EC global EC - bottom Scope Chain: second() --nested inside--> first() --nested inside--> global scope. third() is independently defined inside gloabal scope. Reference Error occurred because both 'c' as well as 'b' cannot be accessed using the scope chain.
Summary:
E-C, Var Env, Cl-Sk, Scope, Scope-chain are all different but related concepts.
Scoping asks the questions where do variables live, where can we access the variables and where not.
Lexical Scoping in JS: Rules of where we can access variables are based exactly where in the code fns and blocks are written.
Every scope has access to all the variables from all its outer scopes. This is scope chain which is a one-way street. An outer scope can never access variables of inner scope.
Scope chain of a certain scope is equal to adding together all the Var Envs of all the parent scopes.
Scope chain has nothing to do with the order in which fns are called. It does not affect the scope chain at all.
When a variable is not found in current scope, engine looks up the scope chain until it finds the variable its looking for. This is called variable look-up.
以上是执行上下文和调用堆栈的详细内容。更多信息请关注PHP中文网其他相关文章!