执行上下文就是JavaScript 在被解析和运行时环境的抽象概念,JavaScript 运行任何代码都是在执行上下文环境中运行的,执行上下文包括三个周期:创建——运行——销毁,重点说一下创建环节。

创建环节(函数被调用,但未未被执行)会执行三件事情

  • 创建变量对象,首先初始化函数的arguments对象,提升函数声明和变量声明,从近到远查找函数运行所需要的变量。
  • 创建作用域链,作用域就是一个独立的地盘,让变量不会相互干扰,当前作用域没有定义的变量,这成为 自由变量。自由变量会向上一直寻找,要到创建这个函数的那个作用域中取值——是“创建”,而不是“调用”,如果最终没有就为undefined。这种层层之间就构成了作用域链。
  • 确定this指向,this、apply、call的指向
function test(arg){
// 1. 形参 arg 是 "hi"
// 2. 因为函数声明比变量声明优先级高,所以此时 arg 是 function
console.log(arg);
var arg = 'hello'; // 3.var arg 变量声明被覆盖, arg = 'word'被执行
function arg(){
console.log('hello world')
}
var arg = 'word';
console.log(arg);
}
test('hi');

可以看下上面这个例子,函数内函数声明比变量声明优先,所以arg被覆盖,并且被提升,所以第一次打印不会报错,打出了arg函数,后面变量被覆盖成为hello。

函数执行多了就会有多个执行上下文,那么怎么管理这些执行上下文呢?

JavaScript 引擎创建了执行栈来管理执行上下文,可以把执行栈认为成一个储存函数调用的栈结构,遵循先进后出的原则。

从上面代码执行,我们大概可以得出以下几点

  • JavaScript引擎是单线程执行,所有代码都是排队执行。
  • 一开始执行的是全局代码,首先创建全局的执行上下文,然后将该执行上下文压入执行栈中。
  • 每当执行一个函数,就会创建该函数的执行上下文,然后将其压入执行栈的顶部,函数执行完成后,执行上下文从底部退出,等待垃圾回收。
  • 游览器js总是访问执行栈顶层的执行上下文。
  • 全局上下文只有唯一的一个,它在浏览器关闭时出栈

js执行上下文和执行栈的更多相关文章

  1. 转:JS高级学习笔记(8)- JavaScript执行上下文和执行栈

    必看参考: 请移步:博客园 JavaScript的执行上下文 深入理解JavaScript执行上下文和执行栈 JavaScript 深入之执行上下文 写在开头 入坑前端已经 13 个月了,不能再称自己 ...

  2. 深入理解 JavaScript 执行上下文和执行栈

    前言 如果你是一名 JavaScript 开发者,或者想要成为一名 JavaScript 开发者,那么你必须知道 JavaScript 程序内部的执行机制.执行上下文和执行栈是 JavaScript ...

  3. JavaScript进阶之执行上下文和执行栈

    js引擎的执行过程 执行上下文和执行栈属于js引擎的执行过程的预编译阶段. 执行上下文(Execution Context) 执行上下文是当前 JavaScript 代码被解析和执行时所在环境的抽象概 ...

  4. Js 执行上下文和作用域

    1.执行上下文和执行栈 执行上下文就是当前 JavaScript 代码被解析和执行时所在环境的抽象概念, JavaScript 中运行任何的代码都是在执行上下文中运行. 执行上下文的生命周期包括三个阶 ...

  5. 理解 Javascript 执行上下文和执行栈

    如果你是一名 JavaScript 开发者,或者想要成为一名 JavaScript 开发者,那么你必须知道 JavaScript 程序内部的执行机制.理解执行上下文和执行栈同样有助于理解其他的 Jav ...

  6. Javascript执行上下文和执行栈

    什么是执行上下文? 执行上下文就是当前JavaScript代码被解析和执行时所在环境的抽象概念,JavaScript中运行任何的代码都是在执行上下文. 什么是执行栈? 执行栈,在其他编程语言中也被叫做 ...

  7. js - 执行上下文和作用域以及闭包

    首先,咱们通常被"执行上下文","执行上下文环境","上下文环境","执行上下文栈"这些名词搞混.那我们一一来揭秘这些名 ...

  8. 【进阶1-1期】理解JavaScript 中的执行上下文和执行栈(转)

    这是我在公众号(高级前端进阶)看到的文章,现在做笔记 https://mp.weixin.qq.com/s/tNl5B4uGdMkJ2bNdbbo82g 阅读笔记 执行上下文是当前 JavaScrip ...

  9. JavaScript 中的执行上下文和执行栈

    JavaScript - 原理系列 ​ 在日常开发中,每当我们接手一个现有项目后,我们总喜欢先去看看别人写的代码.每当我们看到别人写出很酷的代码的时候,我们总会感慨!写出这么优美而又简洁的代码的兄弟到 ...

随机推荐

  1. 关于系统中:/dev/mem

    1)参考:https://blog.csdn.net/lsn946803746/article/details/52948036   博主:lsn946803746 2)参考:https://blog ...

  2. Python:extend和append的用法

    转于:https://www.cnblogs.com/subic/p/6553187.html 博主:subic 1)list.append(object) 向列表中添加一个对象object2)lis ...

  3. 批量创建10个系统帐号tianda01-tianda10并设置密码

    #.添加用户 useradd tianda01 #.非交互式给密码 echo "pass"|passwd --stdin tianda #.- 加0思路 ()..} () #随机密 ...

  4. B/S测试与C/S测试之区别

    我们在日常功能测试工作中,常常依据测试对象和测试目标的不同分为四个级别的测试,单元测试.集成测试.系统测试和验收测试,但是往往忽略了被测应用系统架构.在测试过程中针对不同的系统架构,测试的侧重点也不同 ...

  5. css之布局

    布局一直是页面制作很重要的部分,有个良好的布局不仅在页面上呈现很好的效果,还对后续功能扩展有重要的作用.本文主要讨论一下几种布局: 水平居中布局 垂直居中布局 多列布局 自适应布局 stracky-f ...

  6. XML解析,出现ClassCastException 原因

    import java.io.IOException; import javax.xml.parsers.DocumentBuilder; import javax.xml.parsers.Docum ...

  7. 关于RTC的浅学

    最近公司业务主要是移动客户端,所以免不了客户端与服务端之间的通信.第一次接触通信,做点基本概念的笔记. 主要架构是:openfire+xmpp+play+移动客户端,下文理下这几个概念. OpenFi ...

  8. Dialog 基本使用

    1   :  效果图 btnGeneral.setOnClickListener(new View.OnClickListener() { @Override public void onClick( ...

  9. 【总结整理】JQuery基础学习---样式篇

    进入官方网站获取最新的版本 http://jquery.com/download/    中文 https://www.jquery123.com/ <!--JQuery:轻量级的JavaScr ...

  10. Umbraco back office 中form显示不出来的问题

    问题纠结了好久,没找到什么原因,具体就是在back office中,form显示不出来.如下: 按下F12,在chrome 的developer tools中发现如下错误 找了半天不知道原因,后来看到 ...