javascript基础进阶_深入剖析执行环境及作用域链


Posted in Javascript onSeptember 05, 2017

执行环境

执行环境定义了变量或函数有权访问的其他函数,决定了他们各自的行为。每个执行环境都有一个与之关联的变量对象。

变量对象

环境中定义的所有变量和函数都保存在这个对象中。

全局执行环境

全局执行环境是最外围的一个执行环境。在web浏览器中,全局执行环境被认为是Window对象,因此所有全局变量和函数都是作为window对象的属性和方法创建的。

每个函数都有自己的执行环境。

作用域链

当代码在一个环境中执行,会创建变量对象的一个作用域链。

用途:保证对执行环境有权访问的所有变量和函数有序访问。

特点:作用域链的前端始终是当前执行的代码所在的环境的变量对象。如果这个环境是函数,则将其活动对象作为变量对象。活动对象最开始只包含arguments对象。作用域的下一个变量对象来自包含环境,而再下个来自下一个包含环境。

var color ="blue";
function changeColor() {
 
 var anotherColor ="red";
 
 function swapColors() {
  var tempColor = anotherColor;
  anotherColor = color;
  color = tempColor;
 }

 swapColors();
}

changeColor();

如图表示执行环境,内部环境可以通过作用域链访问外部环境,但是外部环境不能访问内部环境中的变量和函数。每个环境都可以向上搜索作用域链,以查询变量和函数;但是不能向下搜索。

javascript基础进阶_深入剖析执行环境及作用域链

没有块级作用域 声明变量

使用var声明的变量会自动添加到最接近的环境中。如果省略var关键字,即会添加到全局环境中。

function add(num1,num2) {

 var sum = num1+num2;

 return sum;

}

var result= add(10,10)

console.log(sum)

javascript基础进阶_深入剖析执行环境及作用域链

sum is not defined

function add(num1,num2) {

 sum = num1+num2;

 return sum;

}

var result= add(10,10)

console.log(sum)

javascript基础进阶_深入剖析执行环境及作用域链

查询标识符

搜索过程从作用域链的前端开始,向上逐级查询与给定名字匹配的标识符,找到即终止搜索。即如果局部环境中存在着同名标识符,就不会使用位于父环境中的标志符。

var color ="red";

function getColor() {



 return color;

}



console.log(getColor())

javascript基础进阶_深入剖析执行环境及作用域链

var color ="red";

function getColor() {

 var color="green";

 return color;

}



console.log(getColor())

javascript基础进阶_深入剖析执行环境及作用域链

参考:《javascript高级程序设计(第三版)》

以上这篇javascript基础进阶_深入剖析执行环境及作用域链就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS URL传中文参数引发的乱码问题
Sep 02 Javascript
Jquery绑定事件(bind和live的区别介绍)
Aug 23 Javascript
jQuery实现HTML表格单元格的合并功能
Apr 06 Javascript
jQuery过滤特殊字符及JS字符串转为数字
May 26 Javascript
基于CSS3和jQuery实现跟随鼠标方位的Hover特效
Jul 25 Javascript
windows下vue-cli导入bootstrap样式
Apr 25 Javascript
vue-infinite-loading2.0 中文文档详解
Apr 08 Javascript
JS常用的几种数组遍历方式以及性能分析对比实例详解
Apr 11 Javascript
在vue中使用vue-echarts-v3的实例代码
Sep 13 Javascript
微信小程序使用setData修改数组中单个对象的方法分析
Dec 30 Javascript
后台使用freeMarker和前端使用vue的方法及遇到的问题
Jun 13 Javascript
js 执行上下文和作用域的相关总结
Feb 08 Javascript
基于ES6 Array.of的用法(实例讲解)
Sep 05 #Javascript
对于Javascript 执行上下文的全面了解
Sep 05 #Javascript
JS一个简单的注册页面实例
Sep 05 #Javascript
基于react组件之间的参数传递(详解)
Sep 05 #Javascript
zTree获取当前节点的下一级子节点数实例
Sep 05 #Javascript
JavaScript基础进阶之数组方法总结(推荐)
Sep 04 #Javascript
JS沙箱模式实例分析
Sep 04 #Javascript
You might like
2020年4月新番动漫目录 官方宣布4月播出的作品一览
2020/03/08 日漫
Syphon 虹吸式咖啡壶冲煮–拨动法
2021/03/03 冲泡冲煮
PHP默认安装产生系统漏洞
2006/10/09 PHP
PHP脚本的10个技巧(2)
2006/10/09 PHP
Thinkphp5.0框架的Db操作实例分析【连接、增删改查、链式操作等】
2019/10/11 PHP
JavaScript XML和string相互转化实现代码
2011/07/04 Javascript
纯JS实现的批量图片预览加载功能
2011/08/14 Javascript
jQuery中offsetParent()方法用法实例
2015/01/19 Javascript
js+html5绘制图片到canvas的方法
2015/06/05 Javascript
Javascript获取数组中的最大值和最小值的方法汇总
2016/01/01 Javascript
js实现(全选)多选按钮的方法【附实例】
2016/03/30 Javascript
常用Javascript函数与原型功能收藏(必看篇)
2016/10/09 Javascript
Angularjs之filter过滤器(推荐)
2016/11/27 Javascript
JavaScript基本类型值-Undefined、Null、Boolean
2017/02/23 Javascript
浅谈函数调用的不同方式,以及this的指向
2017/09/17 Javascript
Node.js Buffer用法解读
2018/05/18 Javascript
webpack4.x开发环境配置详解
2018/08/04 Javascript
vue基础之事件简写、事件对象、冒泡、默认行为、键盘事件实例分析
2019/03/11 Javascript
JS函数参数的传递与同名参数实例分析
2020/03/16 Javascript
[03:22]DOTA2超级联赛专访单车:找到属于自己的英雄
2013/06/08 DOTA
[01:21]2018DOTA2亚洲邀请赛4.5采访 打DOTA2也能有女朋友?
2018/04/06 DOTA
[56:12]LGD vs Optic Supermajor小组赛D组胜者组决赛 BO3 第一场 6.3
2018/06/04 DOTA
详解Python验证码识别
2016/01/25 Python
Python Socket编程之多线程聊天室
2018/07/28 Python
Python学习笔记之抓取某只基金历史净值数据实战案例
2019/06/03 Python
python中break、continue 、exit() 、pass终止循环的区别详解
2019/07/08 Python
完美解决TensorFlow和Keras大数据量内存溢出的问题
2020/07/03 Python
python中tkinter窗口位置\坐标\大小等实现示例
2020/07/09 Python
CSS3制作漂亮的照片墙的实现代码
2016/06/08 HTML / CSS
html5中去掉input type date默认样式的方法
2018/09/06 HTML / CSS
营销与策划专业毕业生求职信
2013/11/01 职场文书
销售主管岗位职责范本
2014/02/14 职场文书
职工小家建设活动方案
2014/08/25 职场文书
学校捐书倡议书
2015/04/27 职场文书
ztree+ajax实现文件树下载功能
2021/05/18 Javascript
MySQL中InnoDB存储引擎的锁的基本使用教程
2021/05/26 MySQL