谈谈我对JavaScript原型和闭包系列理解(随手笔记8)


Posted in Javascript onDecember 24, 2015

在上篇文章给大家介绍了《谈谈我对JavaScript原型和闭包系列理解(随手笔记6)》, 谈谈我对JavaScript原型和闭包系列理解(随手笔记9)     可以点击了解详情。

执行上下文栈

执行全局代码时,会产生一个执行上下文环境,每次调用函数都又会产生执行上下文环境。当函数调用完成时,这个上下文环境以及其中的数据都会被消除,再重新回到全局上下文环境。处于活动状态的执行上下文环境只有一个。

压栈出栈过程----执行上下文栈:

谈谈我对JavaScript原型和闭包系列理解(随手笔记8)

var a = 10,    //1. 进入全局上下文环境
  fn,
  bar = function(x) {
   var b = 5;
   fn(x + b); //3. 进入fn函数上下文
  };
fn = function(y) {
 var c = 5;
 console.log(y + c);
};
bar(10);    //2. 进入bar函数上下文环境

1、在执行之前,首先创建全局上下文环境

 谈谈我对JavaScript原型和闭包系列理解(随手笔记8)

2、代码执行,执行到bar(10)之前,全局上下文中的变量在执行过程中被赋值。

 谈谈我对JavaScript原型和闭包系列理解(随手笔记8)

3、执行到bar(10)调用bar函数,同时创建该函数内部的执行上下文环境

 谈谈我对JavaScript原型和闭包系列理解(随手笔记8)

4、这时候该执行上下文环境进行压栈,设置为活动状态

 谈谈我对JavaScript原型和闭包系列理解(随手笔记8)

5、bar函数执行到fn(x + b),调用fn函数,创建了fn函数的执行上下文,并压栈,设置为活动状态

 谈谈我对JavaScript原型和闭包系列理解(随手笔记8)

6、fn函数执行完毕,fn环境出栈,被销毁,释放内存,bar函数变为活动态

 谈谈我对JavaScript原型和闭包系列理解(随手笔记8)

7、fn函数执行完毕并销毁,意味着bar也执行完毕了,此时bar函数环境出栈,并销毁。全局环境变为活动态。

 谈谈我对JavaScript原型和闭包系列理解(随手笔记8)

到这里这一段代码的执行过程就完毕了。

根据原作者的描述:

其中上下文环境的变量赋值过程我省略了许多,因为那些并不难,一看就知道。

的确!代码的大概执行过程跑完后,就能很清楚的知道各个执行环境中的变量是个怎样的状态。

讲到这里,我不得不很遗憾的跟大家说:其实以上我们所演示的是一种比较理想的情况。有一种情况,而且是很常用的一种情况,无法做到这样干净利落的说销毁就销毁。这种情况就是伟大的——闭包。要说闭包,咱们还得先从自由变量和作用域说起。

以上内容是小编给大家分享我对JavaScript原型和闭包系列理解(随手笔记8),希望大家喜欢。

Javascript 相关文章推荐
js 绑定带参数的事件以及手动触发事件
Apr 27 Javascript
jquery+json实现数据列表分页示例代码
Nov 15 Javascript
JavaScript判断IE版本型号
Jul 27 Javascript
JS学习之表格的排序简单实例
May 16 Javascript
Express之get,pos请求参数的获取
May 02 Javascript
vue实现点击图片放大效果
Aug 15 Javascript
JavaScript数组去重算法实例小结
May 07 Javascript
React全家桶环境搭建过程详解
May 18 Javascript
详解webpack打包第三方类库的正确姿势
Oct 20 Javascript
给localStorage设置一个过期时间的方法分享
Nov 06 Javascript
vue权限管理系统的实现代码
Jan 17 Javascript
js this 绑定机制深入详解
Apr 30 Javascript
js中flexible.js实现淘宝弹性布局方案
Jun 23 #Javascript
正则表达式优化JSON字符串的技巧
Dec 24 #Javascript
jQuery实现移动端滑块拖动选择数字效果
Dec 24 #Javascript
不得不分享的JavaScript常用方法函数集(上)
Dec 23 #Javascript
JQuery实现的按钮倒计时效果
Dec 23 #Javascript
基于jquery实现鼠标左右拖动滑块滑动附源码下载
Dec 23 #Javascript
JS实现的倒计时效果实例(2则实例)
Dec 23 #Javascript
You might like
地球防卫队:陪着奥特曼打小怪兽的人类力量 那些经典队服
2020/03/08 日漫
用php获取远程图片并把它保存到本地的代码
2008/04/07 PHP
PHP与MySQL开发的8个技巧小结
2010/12/17 PHP
TP5(thinkPHP框架)实现后台清除缓存功能示例
2019/05/29 PHP
JavaScript 应用类库代码
2008/06/02 Javascript
javascript之可拖动的iframe效果代码
2008/08/01 Javascript
jQuery ajax BUG:object doesn't support this property or method
2010/07/06 Javascript
IE6/IE7中JavaScript json提示缺少标识符、字符串或数字问题处理
2014/12/16 Javascript
JS获取iframe中longdesc属性的方法
2015/04/01 Javascript
jQuery实现网站添加高亮突出显示效果的方法
2015/06/26 Javascript
jQuery.prop() 使用详解
2015/07/19 Javascript
跟我学习javascript的浮点数精度
2015/11/16 Javascript
jQuery通过deferred对象管理ajax异步
2016/05/20 Javascript
使用jQuery5分钟快速搞定双色表格的简单实例
2016/08/08 Javascript
JS实现动态添加DOM节点和事件的方法示例
2017/04/28 Javascript
javascript使用正则实现去掉字符串前面的所有0
2018/07/23 Javascript
nodejs 十六进制字符串型数据与btye型数据相互转换
2018/07/30 NodeJs
ztree加载完成后显示勾选节点的实现代码
2018/10/22 Javascript
[01:17]炒鸡美酒第四天TA暴走
2018/06/05 DOTA
[00:05]ChinaJoy现场 DOTA2玩家高呼“CN DOTA BEST DOTA”
2019/08/04 DOTA
python del()函数用法
2013/03/24 Python
Python实现的一个简单LRU cache
2014/09/26 Python
Python 自动补全(vim)
2014/11/30 Python
Python实现从log日志中提取ip的方法【正则提取】
2018/03/31 Python
Python3.6+Django2.0以上 xadmin站点的配置和使用教程图解
2019/06/04 Python
Python替换月份为英文缩写的实现方法
2019/07/15 Python
你正在寻找的CSS3 动画技术
2011/07/27 HTML / CSS
美国隐形眼镜网上商店:Lens.com
2019/09/03 全球购物
应届生文秘专业个人自荐信格式
2013/09/21 职场文书
汽车技术服务与营销专业推荐信
2013/11/29 职场文书
优秀高中生事迹材料
2014/02/11 职场文书
英语系本科生求职信
2014/07/15 职场文书
公安领导班子四风问题个人整改措施思想汇报
2014/10/09 职场文书
2015高三毕业寄语赠言
2015/02/27 职场文书
教师求职自荐信
2015/03/26 职场文书
社会主义核心价值观主题教育活动总结
2015/05/07 职场文书