javascript痛点之二作用域链
1.执行环境(执行上下文)
先看段代码
var a = 10; var b = 20; function cc(){
var c = 30; alert("b="+b); } cc();
alert(c);//报错
为什么我们在函数cc中可以访问到全局变量b而外部却访问不了局部变量c呢?
这就是执行环境的作用:它定义了变量或函数是否有权访问其他数据,决定各自行为。
在javascript中有三种可执行的类型
1.Global Code,即全局的、不在任何函数里面的代码,例如:一个js文件、嵌入在HTML页面中的js代码等。
2.Eval Code,即使用eval()函数动态执行的JS代码。
3. Function Code,即用户自定义函数中的函数体JS代码。
不同的类型有不同的执行环境,我们只讨论全局执行环境和函数执行环境
2.每一个执行环境都有一个与之关联的变量对象,环境中定义的所有变量和函数都保存在这个对象中
在这个方框里就是一个大的执行环境对应的有一个变量对象,这个变量对象我们在程序中是没法访问它的,那它的作用是什么呢?
我们定义的变量a,b,函数cc都是定义在变量对象(variable Object),后台在解析的时候是解析的变量对象的,这就是变量对象的概念。
3.作用域链
看段代码
//执行环境window对象(最上层的执行环境) var color1 = "blue"; function changeColor(){ //每一个函数都有一个执行环境 var color2 ="red"; function swapColor(){ var color3 = color2; color1 = color3; //这里可以访问color1,2,3 } //这里可以访问color1,color2,但不可以访问color3 swapColor(); } //这里只能访问color1 changeColor();//第一个作用环境 changeColor是最外层的window作用域,
在上面的大的执行环境中,可以看到变量color1和函数changeColor,执行changeColor(),代码会从color2代码开始执行到完毕。
当代码执行到swapColor函数的时候,这个函数又产生了一个执行环境(因为每一个函数都有一个执行环境),
当执行到 var color3 = color2;代码中就相当于
var color2 ="red"; function swapColor(){ var color3 = color2; color1 = color3; //这里可以访问color1,2,3 }
color2是全局变量所以函数swapColor可以访问到。
当访问到swapColor()是不可以访问到color3的。
所以我们就得出一个作用域链的概念
当我们的执行环境依次执行到changeColor和swapColor时会产生一个链条,这个链条决定了整个变量的访问权限
环境变量一层一层的向上进行追溯,可以访问它的上级环境(变量和函数)
这就是作用域链的概念
就是一层一层的向上找
c3可以访问c2也可以访问c1 但不能向下访问 。
假设c1是一级作用域,c2是二级作用域,c3是三级作用域
在c3中访问c1它会怎么做呢
1.先在swapColor函数内查找c1 结果没有发现c1
2.继续向上查找
3.发现c2作用域还是没发现c1
4.继续向上查找
5.找到c1
(完
下一章
javascript痛点之三闭包
javascript痛点之二作用域链的更多相关文章
- javascript深入理解-从作用域链理解闭包
一.概要 红宝书(P178)对于闭包的定义:闭包就是有权访问另外一个函数作用域中变量的函数. MDN,对于闭包的定义:闭包就是指能够访问自由变量的函数. 那么什么是自由变量?自由变量就是在函数中使用, ...
- Javascript 运行上下文和作用域链
一.作用域Scope和上下文Context 在javascript中,作用域scope和上下文context是两个不同的概念.每个函数调用都会伴随着scope和context,从本质上来说,scope ...
- 深度剖析Javascript执行环境、作用域链
一.执行环境 执行环境(也叫做执行上下文,Execution Context)是Javascript中最为重要的一个概念.执行环境定义了变量或函数有权访问其他数据,决定了它们各自的行为.每个执行环境都 ...
- JavaScript 执行环境以及作用域链
执行环境(execution context,为简单起见,有时也称为"环境")是 JavaScript 中最为重要的一个概念.执行环境定义了变量或函数有权访问的其他数据,决定了它们 ...
- JavaScript高级程序设计之作用域链
JavaScript只有函数作用域:每个函数都有个作用域链直达window对象. 变量的查找由内而外层层查找,找到即止. 同时不仅可以查找使用,甚至可以改变外部变量. var color = &quo ...
- Javascript中闭包的作用域链
作用域定义了在当前上下文中能够被访问到的成员,在Javascript中分为全局作用域和函数作用域,通过函数嵌套可以实现嵌套作用域. 闭包一般发生在嵌套作用域中.闭包是JavaScript最强大的特性之 ...
- javaScript执行环境、作用域链与闭包
一.执行环境 执行环境定义了变量和函数有权访问的其他数据,决定了他们各自的行为:每个执行环境都有一个与之关联的变量对象,环境中定义的所有变量和函数都保存在这个对象中.虽然我们编写的代码无法访问这个对象 ...
- 【进阶2-2期】JavaScript深入之从作用域链理解闭包(转)
这是我在公众号(高级前端进阶)看到的文章,现在做笔记 https://github.com/yygmind/blog/issues/18 红宝书(p178)上对于闭包的定义:闭包是指有权访问另外一 ...
- javascript 执行环境,作用域链和闭包
首先看下这条语句: (function($) {…})(jQuery): 1.原理: function(arg){…}这就定义了一个匿名函数,参数为arg 而调用函数时,是在函数后面写上括号和实参的, ...
随机推荐
- WEB认证模式:Basic & Digest
一. HTTP Basic 客户端以" : "连接用户名和密码后,再经BASE64加密通过Authorization请求头发送该密文至服务端进行验证,每次请求都需要重复发送该密文. ...
- Atom打造 c/c++编译环境(忙了一个上午)
众所周知 Atom是一款非常酷炫的编辑器.因为它就像上古卷轴一样,玩家可以开发各种dlc补丁,实现自己想要的效果.所以Atom 可以被你改造成自己想要的东西,可以用来写算法竞赛题目,可以开发网页,可以 ...
- Java多线程的几个常用关键字
一.同步(synchronized)和异步(asynchronized) 1.同步(synchronized)简单说可以理解为共享的意思,如果资源不是共享的,就没必要进行同步.设置共享资源为同步的话, ...
- Laravel 5.2 教程 - 数据填充
一.简介 Laravel提供的填充类(seed),可以让大家很容易的实现填充测试数据到数据库.所有的填充类都位于database/seeds目录.填充类的类名完全由你自定义,但最好还是遵循一定的规则, ...
- Pycharm实用技巧汇总
Pycharm中输入 a = list 按住Command点鼠标左键,即可查看该类下的所有用法,如下图 获取类中有哪些成员
- css grid学习材料整理
2017-04-18 19:59:02 由浅入深: 什么是网格布局:http://www.w3cplus.com/css3/what-is-css-grid-layout.html 浏览器如何开启网格 ...
- openlayers应用“四”:百度地图纠偏续
续前一篇,上一篇提到百度地图纠偏的基本思路,经过经过一天的努力,实现了百度地图坐标偏移参数的提取,步骤以及实现效果如下: 1.数据来源:四川省的省道矢量数据 2.提取坐标偏移参数的过程如下: A.将四 ...
- JDBC事务详解
在JDBC的数据库操作中,事务是由一个或者多个操作组成的一个不可分割的工作单元.JDBC的事务处理包含三个方面:事务的自动提交模式(Auto-commit mode).事务隔离级别(Transacti ...
- [大数据]-Elasticsearch5.3.1 IK分词,同义词/联想搜索设置
--题外话:最近发现了一些问题,一些高搜索量的东西相当一部分没有价值.发现大部分是一些问题的错误日志.而我是个比较爱贴图的.搜索引擎的检索会将我们的博文文本分词.所以图片内容一般是检索不到的,也就是说 ...
- 关于微信小程序的Request请求错误处理
在学微信小程序的request请求的时候,一开始报“不在以下合法域名列表中,请参考文”的错误,后来又莫名其妙的报“400 Bad Request”错误,经过半天的研究,终于搞定了,把遇到的错误给大家分 ...