谈谈我对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 相关文章推荐
window.showModalDialog使用手册
Jan 11 Javascript
jQuery图片预加载 等比缩放实现代码
Oct 04 Javascript
js取float型小数点后两位数的方法
Jan 18 Javascript
jquery 鼠标滑动显示详情应用示例
Jan 24 Javascript
详解JavaScript 中的 replace 方法
Jan 01 Javascript
js倒计时小实例(多次定时)
Dec 08 Javascript
Vue.js 插件开发详解
Mar 29 Javascript
js-FCC算法-No repeats please字符串的全排列(详解)
May 02 Javascript
如何理解Vue的.sync修饰符的使用
Aug 17 Javascript
vue权限问题的完美解决方案
May 08 Javascript
JavaScript函数式编程(Functional Programming)声明式与命令式实例分析
May 21 Javascript
JS eval代码快速解密实例解析
Apr 23 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
让的PHP代码飞起来的40条小技巧(提升php效率)
2010/04/12 PHP
解析左右值无限分类的实现算法
2013/06/20 PHP
php+jQuery+Ajax简单实现页面异步刷新
2016/08/08 PHP
thinkphp 验证码 的使用小结
2017/05/07 PHP
tp5.1 框架数据库-数据集操作实例分析
2020/05/26 PHP
jQuery实现列表自动循环滚动鼠标悬停时停止滚动
2013/09/06 Javascript
Flexigrid在IE下不显示数据的处理的解决方法
2013/10/24 Javascript
JQuery下拉框应用示例介绍
2014/04/23 Javascript
ext combobox动态加载数据库数据(附前后台)
2014/06/17 Javascript
javascript稀疏数组(sparse array)和密集数组用法分析
2016/12/28 Javascript
使用grunt合并压缩js和css文件的方法
2017/03/02 Javascript
微信小程序 页面跳转如何实现传值
2017/04/05 Javascript
详解Vue.use自定义自己的全局组件
2017/06/14 Javascript
Vue computed计算属性的使用方法
2017/07/14 Javascript
jQuery EasyUI开发技巧总结
2017/09/26 jQuery
ES6中Class类的静态方法实例小结
2017/10/28 Javascript
Vue精简版风格指南(推荐)
2018/01/30 Javascript
详解Vue源码之数据的代理访问
2018/12/11 Javascript
js获取form表单中name属性的值
2019/02/27 Javascript
JS寄快递地址智能解析的实现代码
2020/07/16 Javascript
[01:22:28]DOTA2-DPC中国联赛 正赛 SAG vs RNG BO3 第一场 1月18日
2021/03/11 DOTA
python进阶教程之异常处理
2014/08/30 Python
使用Python的Treq on Twisted来进行HTTP压力测试
2015/04/16 Python
利用Anaconda完美解决Python 2与python 3的共存问题
2017/05/25 Python
Python列表生成式与生成器操作示例
2018/08/01 Python
Django 创建新App及其常用命令的实现方法
2019/08/04 Python
关于ResNeXt网络的pytorch实现
2020/01/14 Python
Python中文分词库jieba,pkusegwg性能准确度比较
2020/02/11 Python
python让函数不返回结果的方法
2020/06/22 Python
Django如何在不停机的情况下创建索引
2020/08/02 Python
Dillard’s百货官网:Dillards.com
2018/05/26 全球购物
银行会计职员个人的自我评价
2013/09/29 职场文书
药物学专业学生的自我评价
2013/10/27 职场文书
《夹竹桃》教学反思
2014/04/20 职场文书
党的群众路线教育实践活动领导班子整改方案
2014/10/25 职场文书
结婚典礼主持词
2015/06/29 职场文书