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 相关文章推荐
jscript之Read an Excel Spreadsheet
Jun 13 Javascript
innerhtml用法 innertext用法 以及innerHTML与innertext的区别
Oct 26 Javascript
如何学习Javascript入门指导
Nov 01 Javascript
javascript+canvas实现刮刮卡抽奖效果
Jul 29 Javascript
js+CSS实现模拟华丽的select控件下拉菜单效果
Sep 01 Javascript
JavaScript小技巧整理
Dec 30 Javascript
js实现人民币大写金额形式转换
Apr 27 Javascript
AngularJS过滤器filter用法总结
Dec 13 Javascript
angular4强制刷新视图的方法
Oct 09 Javascript
vue实现前台列表数据过滤搜索、分页效果
May 28 Javascript
js实现带有动画的返回顶部
Aug 09 Javascript
JavaScript函数柯里化
Nov 07 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 heredoc和phpwind的模板技术使用方法小结
2008/03/28 PHP
php 数组二分法查找函数代码
2010/02/16 PHP
PHP中SERIALIZE和JSON的序列化与反序列化操作区别分析
2016/10/11 PHP
php实现构建排除当前元素的乘积数组方法
2018/10/06 PHP
php探针不显示内存解决方法
2019/09/17 PHP
js onload处理html页面加载之后的事件
2013/10/30 Javascript
jquery删除提示框弹出是否删除对话框
2014/01/07 Javascript
table对象中的insertRow与deleteRow使用示例
2014/01/26 Javascript
点评js异步加载的4种方式
2015/12/22 Javascript
D3.js实现散点图和气泡图的方法详解
2016/09/21 Javascript
基于vue2实现上拉加载功能
2017/11/28 Javascript
详解vue-router传参的两种方式
2018/09/10 Javascript
基于Taro的微信小程序模板消息-获取formId功能模块封装实践
2019/07/15 Javascript
linux 下以二进制的方式安装 nodejs
2020/02/12 NodeJs
Element Card 卡片的具体使用
2020/07/26 Javascript
vue 组件之间事件触发($emit)与event Bus($on)的用法说明
2020/07/28 Javascript
解决iview table组件里的 固定列 表格不自适应的问题
2020/11/13 Javascript
[03:12]2016完美“圣”典风云人物:单车专访
2016/12/02 DOTA
python自动化测试之连接几组测试包实例
2014/09/28 Python
使用python绘制常用的图表
2016/08/27 Python
Python利用flask sqlalchemy实现分页效果
2020/08/02 Python
详解django.contirb.auth-认证
2018/07/16 Python
PyQt5实现简单数据标注工具
2019/03/18 Python
创意爱尔兰礼物:Creative Irish Gifts
2020/01/29 全球购物
接口的多继承会带来哪些问题
2015/08/17 面试题
Java中的异常处理机制的简单原理和应用
2013/04/27 面试题
绩效考核实施方案
2014/03/18 职场文书
中国入世承诺
2014/04/01 职场文书
雷锋精神演讲稿
2014/05/13 职场文书
奥巴马竞选演讲稿
2014/05/15 职场文书
护理专科学生自荐书
2014/07/05 职场文书
大学生党员批评与自我批评
2014/09/28 职场文书
2015年党总支工作总结
2015/05/25 职场文书
迎新年主持词
2015/07/06 职场文书
公务员岗前培训心得体会
2016/01/08 职场文书
青年岗位能手事迹材料(2016推荐版)
2016/03/01 职场文书