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类,兼容IE及Firefox
Jun 23 Javascript
jQuery 动态酷效果实现总结
Dec 27 Javascript
javascript 图片裁剪技巧解读
Nov 15 Javascript
jquery如何根据值设置默认的选中项
Mar 17 Javascript
Node.js入门教程:在windows和Linux上安装配置Node.js图文教程
Aug 14 Javascript
JS+CSS实现的拖动分页效果实例
May 11 Javascript
javascript html5 canvas实现可拖动省份的中国地图
Mar 11 Javascript
怎么限制input的text里输入的值只能是数字(正则、js)
May 16 Javascript
JavaScript 限制文本框不可输入英文单双引号的方法
Dec 20 Javascript
javascript 中的继承实例详解
May 05 Javascript
JS 组件系列之BootstrapTable的treegrid功能
Jun 16 Javascript
纯js实现页面返回顶部的动画(超简单)
Aug 10 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
全文搜索和替换
2006/10/09 PHP
PHP新手上路(十一)
2006/10/09 PHP
实例(Smarty+FCKeditor新闻系统)
2007/01/02 PHP
基于empty函数的判断详解
2013/06/17 PHP
php获取一个变量的名字的方法
2014/09/05 PHP
tp5.1框架数据库子查询操作实例分析
2020/05/26 PHP
LazyLoad 延迟加载(按需加载)
2010/05/31 Javascript
safari,opera嵌入iframe页面cookie读取问题解决方法
2010/06/23 Javascript
关于javascript DOM事件模型的两件事
2010/07/22 Javascript
jQuery学习笔记之2个小技巧
2015/01/19 Javascript
基于jQuery实现收缩展开功能
2016/03/18 Javascript
Knockoutjs 学习系列(一)ko初体验
2016/06/07 Javascript
js控件Kindeditor实现图片自动上传功能
2020/07/20 Javascript
JS创建对象的写法示例
2016/11/04 Javascript
JScript实现地址选择功能
2017/08/15 Javascript
vue 里面使用axios 和封装的示例代码
2017/09/01 Javascript
微信小程序picker组件简单用法示例【附demo源码下载】
2017/12/05 Javascript
浅析vue深复制
2018/01/29 Javascript
浅谈webpack组织模块的原理
2018/03/10 Javascript
JS原型对象操作实例分析
2020/06/06 Javascript
Python获取apk文件URL地址实例
2013/11/01 Python
python实现八大排序算法(1)
2017/09/14 Python
详解django三种文件下载方式
2018/04/06 Python
手机使用python操作图片文件(pydroid3)过程详解
2019/09/25 Python
Python使用psutil获取进程信息的例子
2019/12/17 Python
python删除某个目录文件夹的方法
2020/05/26 Python
浅谈Python程序的错误:变量未定义
2020/06/02 Python
css3实现可滑动跳转的分页插件示例
2014/05/08 HTML / CSS
大学毕业生通用自荐信范文
2013/10/31 职场文书
小学生秋游活动方案
2014/02/23 职场文书
目标责任书格式
2014/07/28 职场文书
办公室年度工作总结2015
2015/05/21 职场文书
谢师宴家长致辞
2015/07/27 职场文书
 Redis 串行生成顺序编码的方法实现
2022/04/03 Redis
Python matplotlib安装以及实现简单曲线的绘制
2022/04/26 Python
vue-treeselect的基本用法以及解决点击无法出现拉下菜单
2022/04/30 Vue.js