理解Javascript_02_执行上下文01
执行上下文又名执行上下文环境
JS中为什么会产生这个概念呢,先来看一下下面的这段代码:

通过执行发现,第一句代码报了ReferenceError,第二句和第三句代码是undefined,由于undefined表明是已经定义了,但是没有进行赋值,却不知道a是10(第三句中)。
简单来说,浏览器在执行一段js代码执行要进行一些准备工作,包括变量声明提升,函数声明提升等,变量的赋值和函数形参的赋值要在运行到该代码时才进行,可以下图进行简单说明。

下面还有。先来个简单的。

有js开发经验的朋友应该都知道,你无论在哪个位置获取this,都是有值的。至于this的取值情况,比较复杂,后面会专门拿出一篇文章来讲解。
与第一种情况不同的是:第一种情况只是对变量进行声明(并没有赋值),而此种情况直接给this赋值。这也是“准备工作”情况要做的事情之一。
下面还有......第三种情况。
在第三种情况中,需要注意代码注释中的两个名词——“函数表达式”和“函数声明”。虽然两者都很常用,但是这两者在“准备工作”时,处理方式却不同。

看了以上代码。“函数声明”时我们看到了第二种情况的影子,而“函数表达式”时我们看到了第一种情况的影子。
没错。在“准备工作”中,对待函数表达式就像对待“ var a = 10 ”这样的变量一样,只是声明,赋值为undefined,相当于占了个坑。而对待函数声明时,却把函数整个赋值了。
好了,“准备工作”介绍完毕。
我们总结一下,在“准备工作”中完成了哪些工作:
- 变量、函数表达式——变量声明,默认赋值为undefined;
- this——赋值;
- 函数声明——赋值;
这三种数据的准备情况我们称之为“执行上下文”或者“执行上下文环境”。
这里插一句题外话:通过以上三种情况,你可能会联想到网上的有些考js语法的题目/面试题。的确,几乎每个js语法题中都有这种题目出现。之前你遇到这种题目是不是靠背诵来解决?背过了,隔几天又忘记了。——任何问题,都要去追根溯源,要知道这个问题是真正出自哪一块知识点,要真正去理解。光靠背诵是没用的。
细心的朋友可能会发现,我们上面所有的例子都是在全局环境下执行的。
其实,javascript在执行任一一个代码段之前,都会进行这些“准备工作”来生成执行上下文。这个“代码段”其实分三种情况——全局代码,函数体,eval代码。
这里解释一下为什么代码段分为这三种。
所谓“代码段”就是一段文本形式的代码。
首先,全局代码是一种,这个应该没有非议,本来就是手写文本到<script>标签里面的。

其次,eval代码接收的也是一段文本形式的代码。

最后,函数体是代码段是因为函数在创建时,本质上是 new Function(…) 得来的,其中需要传入一个文本形式的参数作为函数体。

这样解释应该能理解了。
最后,eval不常用,也不推荐大家用。
下一篇将讲解函数执行上下文。
理解Javascript_02_执行上下文01的更多相关文章
- 理解Javascript_02_执行上下文02
上一篇我们讲到在全局环境下的代码段中,执行上下文环境中如何处理数据: 变量.函数表达式——变量声明,默认赋值为undefined: this——赋值: 函数声明——赋值: 这篇文章讲关于函数执行上下文 ...
- JS底层知识理解之执行上下文篇
JS底层知识理解之执行上下文篇 一.什么是执行上下文(Execution Context) 执行上下文可以理解为当前代码的执行环境,它会形成一个作用域. 二.JavaScript引擎会以什么方式去处理 ...
- js的基础(平民理解的执行上下文/调用堆栈/内存栈/值类型/引用类型)
与以前的切图比较,现在的前端开发对js的要求似乎越来越高,在开发中,我们不仅仅是要知道如何运用现有的框架(react/vue/ng), 而且我们对一些基础的知识的依赖越来越大. 现在我们就用平民的方法 ...
- 深入理解javascript执行上下文(Execution Context)
本文转自:http://blogread.cn/it/article/6178 在这篇文章中,将比较深入地阐述下执行上下文 - Javascript中最基础也是最重要的一个概念.相信读完这篇文章后,你 ...
- 深入理解JavaScript执行上下文、函数堆栈、提升的概念
本文内容主要转载自以下两位作者的文章,如有侵权请联系我删除: https://feclub.cn/post/content/ec_ecs_hosting http://blog.csdn.net/hi ...
- 深入理解js——执行上下文
什么是"执行上下文"?暂且不下定义,先看一段代码: 第一句报错,a未定义,很正常.第二句.第三句输出都是undefined,说明浏览器在执行console.log(a)时,已经知道 ...
- JavaScript的执行上下文,真没你想的那么难
作者:小土豆 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.im/user/2436173500265335 前言 在正文开始前,先来看 ...
- javascript 执行上下文的理解
首先,为什么某些函数以及变量在没有被声明以前就可以被使用,javascript引擎内部在执行代码以前到底做了些什么?这里,想信大家都会想到,变量声明提前这个概念: 但是,以下我要讲的是,声明提前的这个 ...
- 深入理解javascript原型和闭包(8)——简述【执行上下文】上
什么是“执行上下文”(也叫做“执行上下文环境”)?暂且不下定义,先看一段代码: 第一句报错,a未定义,很正常.第二句.第三句输出都是undefined,说明浏览器在执行console.log(a)时, ...
随机推荐
- POJ1657
1.题目链接地址 http://poj.org/problem?id=1657 2.源代码 #include<iostream> using namespace std; int main ...
- 读书笔记 Week5 2018-4-5
再结束了第一个个人任务以后,我也算有点时间翻开一本大部头来通读一下.在看了一些相关的评论说:“该书可以从任意章节读起”后,刚刚在180M测试文件的个人任务中吃了亏的我,决定从他的第5部分,代码改善看起 ...
- box-shadow 内阴影
1.盒子阴影样式单词:box-shadow 2.语法 代表边框间距靠左0 靠上0 和1px阴影范围 阴影颜色为黑色(#000),有inset 代表框内阴影 ,不带inset 代表框外阴影. 注意:bo ...
- 453. Minimum Moves to Equal Array Elements 一次改2个数,变成统一的
[抄题]: Given a non-empty integer array of size n, find the minimum number of moves required to make a ...
- JSTL标签之core标签的使用
参考:http://blog.csdn.net/qq_25827845/article/details/53311722 核心标签库的导入 <%@ taglib prefix="c&q ...
- ls -al
ls -al:显示当前文件下所有的文件
- 黑盒测试实践--Day2 11.26
黑盒测试实践--Day2 今天完成任务情况: 大家自主安装和学习Selenium软件 小尹给大家介绍学生信息管理系统的基本情况,有余力者搭建了相关环境 周末,休息 附录 小组基本情况介绍 人数:五人 ...
- linq to sql 实现左(右)连接,那个方法是对的,该怎么处理
linq to sql 实现左(右)连接,那个方法是对的var query2 = from tb0 in db.table_0 join tb1 in db.table_1 on table_0.关 ...
- 小学四则运算生成器(Java) 刘少允,梁新男
github传送门 项目相关要求 使用 -n 参数控制生成题目的个数.(实现) 使用 -r 参数控制题目中数值(自然数.真分数和真分数分母)的范围.(实现) 生成的题目中计算过程不能产生负数.(实现) ...
- Head First HTML与CSS、XHTML (中文版).(Elisabeth Freeman) PDF扫描版
面对那些晦涩的html书你不禁要问:“难道要成为专家之后才能读懂这些?”那么,你应该选择<head first html与css.xhtml(中文版)>真正来学习html.这本书对你来说, ...