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

 更新时间:2017年09月05日 08:46:23   作者:偏执于肉夹馍和煎饼果子  
下面小编就为大家带来一篇javascript基础进阶_深入剖析执行环境及作用域链。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

执行环境

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

变量对象

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

全局执行环境

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

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

作用域链

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

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

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

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

 swapColors();
}

changeColor();

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

没有块级作用域 声明变量

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

function add(num1,num2) {

 var sum = num1+num2;

 return sum;

}

var result= add(10,10)

console.log(sum)


sum is not defined

function add(num1,num2) {

 sum = num1+num2;

 return sum;

}

var result= add(10,10)

console.log(sum)


查询标识符

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

var color ="red";

function getColor() {



 return color;

}



console.log(getColor())


var color ="red";

function getColor() {

 var color="green";

 return color;

}



console.log(getColor())


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

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

相关文章

  • webpack中的filename 和 chunkFilename 的区别实例解析

    webpack中的filename 和 chunkFilename 的区别实例解析

    filename 指列在 entry 中,打包后输出的文件的名称,chunkFilename 指未列在 entry 中,却又需要被打包出来的文件的名称,这篇文章主要介绍了webpack中的filename 和 chunkFilename 的区别实例解析,需要的朋友可以参考下
    2023-11-11
  • javascript中eval和with用法实例总结

    javascript中eval和with用法实例总结

    这篇文章主要介绍了javascript中eval和with用法,结合实例形式总结分析了JavaScript中eval和with的功能、用法与相关注意事项,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-11-11
  • flexslider.js实现移动端轮播

    flexslider.js实现移动端轮播

    本文主要分享了flexslider.js实现移动端轮播的示例代码,具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • 怎么在下面的HTML里调用数组cs[]的值

    怎么在下面的HTML里调用数组cs[]的值

    怎么在下面的HTML里调用数组cs[]的值...
    2007-01-01
  • JS实现提示框跟随鼠标移动

    JS实现提示框跟随鼠标移动

    在本篇内容里小编给各位整理了一篇关于JS实现提示框跟随鼠标移动的相关实例代码,需要的朋友们学习下。
    2019-08-08
  • 微信小程序实现简单手写签名组件的方法实例

    微信小程序实现简单手写签名组件的方法实例

    在使用微信的时候,为方便我们发送文件可以直接在上面进行手写签名,这篇文章主要给大家介绍了关于利用微信小程序实现简单手写签名组件的相关资料,需要的朋友可以参考下
    2021-07-07
  • javascript获取select值的方法分析

    javascript获取select值的方法分析

    这篇文章主要介绍了javascript获取select值的方法,实例分析了javascript获取select元素值的相关技巧,需要的朋友可以参考下
    2015-07-07
  • js+css实现飞机大战游戏

    js+css实现飞机大战游戏

    这篇文章主要为大家详细介绍了js+css实现飞机大战游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-05-05
  • javascript中2个感叹号的用法实例详解

    javascript中2个感叹号的用法实例详解

    这篇文章主要介绍了javascript中2个感叹号的用法,并用大量的实例讲述了!!的常见应用情况,是非常实用的技巧,需要的朋友可以参考下
    2014-09-09
  • 原生JavaScript创建不可变对象的方法简单示例

    原生JavaScript创建不可变对象的方法简单示例

    这篇文章主要介绍了原生JavaScript创建不可变对象的方法,结合简单实例形式分析了基于原生JavaScript创建不可变对象的相关原理、实现方法与操作注意事项,需要的朋友可以参考下
    2020-05-05

最新评论