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 相关文章推荐
基于JQuery的密码强度验证代码
Mar 01 Javascript
jquery预览图片实现鼠标放上去显示实际大小
Jan 16 Javascript
jquery实现点击向下展开菜单项(伸缩导航)效果
Aug 22 Javascript
Highcharts使用简例及异步动态读取数据
Dec 30 Javascript
javascript简单比较日期大小的方法
Jan 05 Javascript
JS实现多物体运动的方法详解
Jan 23 Javascript
原生JS实现循环Nodelist Dom列表的4种方式示例
Feb 11 Javascript
vue-cli3.0 脚手架搭建项目的过程详解
Oct 19 Javascript
Node.js一行代码实现静态文件服务器的方法步骤
May 07 Javascript
JavaScript 截取字符串代码实例
Sep 05 Javascript
基于jQuery实现可编辑的表格
Dec 11 jQuery
JavaScript中ES6规范中let和const的用法和区别
Aug 06 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
PHP简单生成缩略图相册的方法
2015/07/29 PHP
PHP中使用substr()截取字符串出现中文乱码问题该怎么办
2015/10/21 PHP
thinkphp3.2中实现phpexcel导出带生成图片示例
2017/02/14 PHP
event对象的方法 兼容多浏览器
2009/06/27 Javascript
js播放wav文件(源码)
2013/04/22 Javascript
基于jquery自定义的漂亮单选按钮RadioButton
2013/11/19 Javascript
javascript 模拟坦克大战游戏(html5版)附源码下载
2014/04/08 Javascript
JavaScript学习笔记之JS函数
2015/01/22 Javascript
jQuery实现类似标签风格的导航菜单效果代码
2015/08/25 Javascript
AngularJs  unit-testing(单元测试)详解
2016/09/02 Javascript
Javascript数组中push方法用法分析
2016/10/31 Javascript
JavaScript简单生成 N~M 之间随机数的方法
2017/01/13 Javascript
基于JavaScript实现滑动门效果
2017/03/16 Javascript
nodejs入门教程二:创建一个简单应用示例
2017/04/24 NodeJs
vue.js的安装方法
2017/05/12 Javascript
React 使用browserHistory项目访问404问题解决
2018/06/01 Javascript
微信小程序授权登录解决方案的代码实例(含未通过授权解决方案)
2019/05/10 Javascript
微信小程序移动拖拽视图-movable-view实例详解
2019/08/17 Javascript
vue穿梭框实现上下移动
2021/01/29 Vue.js
vue常用高阶函数及综合实例
2021/02/25 Vue.js
Python 列表(List)操作方法详解
2014/03/11 Python
python3爬取淘宝信息代码分析
2018/02/10 Python
python pandas获取csv指定行 列的操作方法
2019/07/12 Python
Python利用for循环打印星号三角形的案例
2020/04/12 Python
Python爬虫基于lxml解决数据编码乱码问题
2020/07/31 Python
Python修改DBF文件指定列
2020/12/19 Python
详解Python之Scrapy爬虫教程NBA球员数据存放到Mysql数据库
2021/01/24 Python
pytorch下的unsqueeze和squeeze的用法说明
2021/02/06 Python
卫校护理专业毕业生求职信
2013/11/26 职场文书
大学生未来职业生涯规划书
2014/02/15 职场文书
婚纱摄影师求职信
2014/03/07 职场文书
文化宣传方案
2014/03/13 职场文书
小学生环保标语
2014/06/13 职场文书
普希金诗歌赏析(6首)
2019/08/22 职场文书
redis实现排行榜功能
2021/05/24 Redis
SQL注入详解及防范方法
2021/12/06 MySQL