先对需要用到的名词解释一下,再通过例子深入理解

一、什么是作用域(Scope)

  [[scope]]:每个javascript函数都是一个对象,对象中有些属性我们可以访问,但有些不可以,这些属性仅供javascript引擎存取,[[scope]]就是其中一个。[[scope]]指的就是我们所说的作用域,其中存储了运行期上下文的集合。即作用域决定了代码区块中变量和其他资源的可见性。

二、变量的作用域类型

  1.全局作用域:全局作用域贯穿整个javascript文档,在所有函数声明或者大括号之外定义的变量,都在全局作用域里。一旦你声明了一个全局变量,那么你在任何地方都可以使用它,包括函数内部。

  2.局部作用域:局部作用域一般只在固定的代码片段内可访问到,而其外部是无法访问的,它分为函数作用域和块级作用域

    a:函数作用域: 当你在函数里定义一个变量时,它在函数内任何地方都可以使用。在函数之外,你就无法访问它了。

    b:块级作用域:你在使用大括号时,声明了一个const或者let的变量时,你就只能在大括号内部使用这一变量。

三、作用域链

  作用域链:[[scope]]中所存储的执行期上下文对象的集合,这个集合呈链式链接,我们把这种链式链接叫做作用域链。

四、执行期上下文

  当函数执行时,会创建一个称为执行期上下文的内部对象。一个执行期上下文定义了一个函数执行时的环境,函数每次执行时对应的执行上下文都是独一无二的,所以多次调用一个函数会导致创建多个执行上下文,当函数执行完毕,执行上下文被销毁。(即AO、GO,不了解的可参考预预编译文章)

五、查找变量

  在函数中查找变量,从其作用域链的顶端依次向下查找,从Scope chain 的0位依次查到最后一位。

通过一个例子具体了解上面的定义:

<script>
function a() {
function b() {
var bb = 234
}
var aa = 123;
b();
}
var glob = 100;
a();
</script>

1.a()定义时,其Scope里存放GO

2.a()执行时,形成作用域链,Scope chain[0] 存放AO, Scope chain[1] 存放GO

  

3: b()定义,因为它是a()内部的函数,因此其执行期上下文与a()执行时是一样的;

  

4:b()执行时,产生自己的AO,在作用域链中将a()的AO与GO储存位置下移,第0位存自己的AO

  

注意:b()  Scope chain 储存的a() 的AO与a()中的AO一样,只是将其引用挂到里面,即通过b()中可以改变a()中变量的值

   例:

<script>
function a() {
function b() {
var bb = 234
aa = 0;
}
var aa = 123;
b();
     console.log(a);
}
var glob = 100;
a();
</script>

输出a的值为 0

JavaScript 作用域(Scope)详解的更多相关文章

  1. JavaScript作用域链详解

    JavaScript的作用域链还是很有味道的,搞懂了这个知识点,闭包的问题也就迎刃而解咯 1.JavaScript的全局变量和局部变量 首先,先来看看js的全局变量和局部变量,js不是块级作用域,所以 ...

  2. Spring-bean作用域scope详解

    Spring Framework支持五种作用域(其中有三种只能用在基于web的Spring ApplicationContext). singleton 在每个Spring IoC容器中一个bean定 ...

  3. Spring中bean的作用域scope详解

    参考文献:http://blog.csdn.net/jacklearntech/article/details/40157861 http://www.cnblogs.com/qq78292959/p ...

  4. JavaScript严格模式详解

    转载自阮一峰的博客 Javascript 严格模式详解   作者: 阮一峰 一.概述 除了正常运行模式,ECMAscript 5添加了第二种运行模式:"严格模式"(strict m ...

  5. 从mixin到new和prototype:Javascript原型机制详解

    从mixin到new和prototype:Javascript原型机制详解   这是一篇markdown格式的文章,更好的阅读体验请访问我的github,移动端请访问我的博客 继承是为了实现方法的复用 ...

  6. [转]javascript console 函数详解 js开发调试的利器

    javascript console 函数详解 js开发调试的利器   分步阅读 Console 是用于显示 JS和 DOM 对象信息的单独窗口.并且向 JS 中注入1个 console 对象,使用该 ...

  7. javascript 节点属性详解

    javascript 节点属性详解 根据 DOM,html 文档中的每个成分都是一个节点 DOM 是这样规定的:整个文档是一个文档节点每个 html 标签是一个元素节点包含在于 html 元素中的文本 ...

  8. (" use strict")Javascript 严格模式详解

    Javascript 严格模式详解 转载别人的博客内容,浏览了一遍,没有全部吸收,先保存一下链接 http://www.ruanyifeng.com/blog/2013/01/javascript_s ...

  9. 【HANA系列】SAP HANA XS使用JavaScript数据交互详解

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]SAP HANA XS使用Jav ...

  10. Maven依赖中的scope详解,在eclipse里面用maven install可以编程成功,到服务器上用命令执行报VM crash错误

    Maven依赖中的scope详解 项目中用了<scope>test</scope>在eclipse里面用maven install可以编译成功,到服务器上用命令执行报VM cr ...

随机推荐

  1. Jersey Client传递中文参数

    客户端需要客户端的包: <dependency> <groupId>com.sun.jersey</groupId> <artifactId>jerse ...

  2. 关于Java_Web连接Oracle数据库

    1.前提条件 1>装有Oracle数据库(因为连接的时候需要开启两项服务) 2>myeclipse或eclipse(支持WebProject的版本)开发环境,本机以myeclipse为例, ...

  3. .Net core,EFCore 入门

    我在百度上搜了一下.net  core和efcore 入门案例.好多博客都是大概说了一下做法,对于小白而言还是一头雾水,我今天就抽出一点时间,写一个详细的入门小案例,就一张表没有什么业务可言.主要是操 ...

  4. linux 基本操作笔记

        linux文件系统的实现 linux有一个树状结构来组织文件,数的顶端为根目录/,节点为目录,而末节点为所包含的数据文件.我们可以对文件进行多种操作,比如打开和读写.   存储设备分区   文 ...

  5. 用ndp部署storm应用

    本文由作者余宝虹授权网易云社区发布. 使用户ndp部署一个Java应用大家都非常熟悉的,但是看到某些同学用非常繁琐的方式部署storm应用的时候,我觉得很有必要整一个帮助教程,ndp帮助文档里面没有, ...

  6. Day5 作业(完成)

    1,有如下变量(tu是个元祖),请实现要求的功能# tu = ("alex", [11, 22, {"k1": 'v1', "k2": [& ...

  7. django项目中使用项目环境制作脚本 通过终端命令运行脚本文件

    在实际的django项目开发中,有时候需要制作一些脚本文件对项目数据进行处理,然后通过终端命令运行脚本. 完整的实现流程如下: 1.在一个应用目录下(app, 必须是在应用目录下,可以专门创建一个应用 ...

  8. window7下Python安装

    去python官网下载软件,https://www.python.org. 选择dowloads-->windows,选择稳定版python3.5.2,x86表示32位操作系统,x86-64表示 ...

  9. 图片后门恶意捆绑工具FackImageexploer

    本文作者:夜莺 今天向大家提个醒,最近有一款工具名叫FackImageexploer,该工具能够将恶意的.bat和.exe程序与图片绑定在一起,假若受害者点击了图片,就会反弹个shell给不法分子,如 ...

  10. 一步一步教你使用 LSMW 批量处理数据

    保存退出 输入完后,保存退出