js中作用域链和作用域
作用域
在JavaScript中,我们可以将作用域定义为一套规则,这套规则用来管理引擎如何在当前作用域以及嵌套的子作用域中根据标识符名称(变量名或者函数名)进行变量查找。
经过研究《高级程序设计》第3版的第四章,作用域相关的知识,自己总结并画了如下图,希望能让大家对作用域链有更好的理解,(可拖拽到新窗口查看大图)
总结: 作用域链:就是由多级作用域连续引用形成的链式结果;
它掌管着一切变量的使用顺序!(即:先在局部找,找不到,再沿着作用域链向父级找,作用域链的最末端永远是全局变量对象)
=========================================================================================================================
作用域小知识点:
es5里只有函数(局部)作用域和全局作用域,而没有块级作用域;和JAVA等语言不同
var arr = []; for (var i = 0; i < 5; i++) {
arr[i] = function () {
console.log(i);
};
} arr[0]();//
arr[1]();//
arr[2]();//
arr[3]();//
arr[4]();//
我们发现和我们预期的结果不一致,最终的结果都是5;
解决办法:
我们可以通过立即执行函数(闭包)的形式,即用函数作用域模拟出块级作用域的效果,我们把上面例子进行修改
var arr = []; for (var i = 0; i < 10; i++) {
(function(i) {
arr[i] = function () {
console.log(i);
};
})(i);
} arr[0]();//
arr[1]();//
arr[2]();//
arr[3]();//
arr[4]();//
es6里面新增了,const和let,这两个有块级作用域
像刚刚的for循环函数,我们就仅仅需要把 var i => 改为 let i 即可;代码如下:
var arr = []; for (let i = 0; i < 5; i++) {
arr[i] = function () {
console.log(i);
};
} arr[0]();//
arr[1]();//
arr[2]();//
arr[3]();//
arr[4]();//
const和let 与 var 有三大区别:
1、没有“变量提升hoisting”;
2、有“暂时性死区temporal dead zone”;
暂时性死区:
只要块级作用域内,存在let
命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响。
var tmp = 123; if (true) {
tmp = 'abc'; // ReferenceError
let tmp;
}
上面代码中,存在全局变量tmp
,但是块级作用域内let
又声明了一个局部变量tmp
,导致后者绑定这个块级作用域,所以在let
声明变量前,对tmp
赋值会报错。
ES6明确规定,如果区块中存在let
和const
命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。
总之,在代码块内,使用let
命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)。
3、不允许在相同作用域内重复声明;
// 报错
function func() {
let a = 10;
var a = 1;
} // 报错
function func() {
let a = 10;
let a = 1;
}
建议:在使用ES6语法的项目中,不再使用var,使用let和const代替之。
js中作用域链和作用域的更多相关文章
- js中的块级作用域
概述 函数是js中最常见的作用域单元, 声明在一个函数内部的变量或函数会在所处的作用域中隐藏起来, 这是有意为之的非常好的设计原则. 但是随着js的发展, 我们有了某个代码块(通常指{..}内部)隐藏 ...
- 理解js中的自由变量以及作用域的进阶
如果你不知道什么是作用域,建议你先看什么是作用域链,什么是原型链.这篇文章,因为这些内容都是有关联性的. 什么是自由变量? 如我在全局中定义了一个变量a,然后我在函数中使用了这个a,这个a就可以称之为 ...
- 关于js中变量声明和作用域的理解
1. var是声明一个变量:虽然声明了这个变量,但在存入值之前,它的初始值是 undefined:2.全局变量:拥有全局作用域,在js代码中的任何地方都是有定义的:3.局部变量:在函数内声明的变量只在 ...
- JS中for循环变量作用域--解决for循环异步执行的问题
被这个问题困惑了很久,终于在网上找到了答案,感谢~ 现在分享给大家~ js中如何让一个for循环走完之后,再去执行下面的语句? 这涉及for循环变量作用域的问题,js中作用域只有函数作用域和全局作用域 ...
- 一个经典的js中关于块级作用域和声明提升的问题
function functions(flag) { if (flag) { function getValue() { return 'a'; } } else { function getValu ...
- JS中原型链继承
当我们通过构造函数A来实现一项功能的时候,而构造函数B中需要用到构造函数A中的属性或者方法,如果我们对B中的属性或者方法进行重写就会出现冗杂的代码,同时写出来也很是麻烦.而在js中每个函数都有个原型, ...
- JS中原型链中的prototype与_proto_的个人理解与详细总结
1.对象的内部属性[[prototype]]和属性__proto__:每个对象都具有一个名为__proto__的属性: 2.函数的属性prototype:每个构造函数(构造函数标准为大写开头,如Fun ...
- 关于JS中原型链中的prototype与_proto_的个人理解与详细总结
一直认为原型链太过复杂,尤其看过某图后被绕晕了一整子,今天清理硬盘空间(渣电脑),偶然又看到这图,勾起了点回忆,于是索性复习一下原型链相关的内容,表达能力欠缺逻辑混乱别见怪(为了防止新人__(此处指我 ...
- JS中原型链的理解
new操作符具体干了什么呢?其实很简单,就干了三件事情. var obj = {}; obj.__proto__ = Base.prototype; Base.call(obj); 第一行,我们创建了 ...
随机推荐
- 架构师养成记--21.netty编码解码
背景 作为网络传输框架,免不了哟啊传输对象,对象在传输之前就要序列化,这个序列化的过程就是编码过程.接收到编码后的数据就需要解码,还原传输的数据. 代码 工厂类 import io.netty.han ...
- Spring AOP 概述
1. AOP的概念 AOP 是Aspect-Oriented Programming(面向方面编程或者面向切面)的简称,维基百科对其解释如下: Aspect是一种新的模块化机制,用来描述分散在对象.类 ...
- app.module.ts说明
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; ...
- HDU – 1050 Moving Tables
http://acm.hdu.edu.cn/showproblem.php?pid=1050 当时这道题被放在了贪心专题,我又刚刚做了今年暑假不AC所以一开始就在想这肯定是个变过型的复杂贪心,但是后来 ...
- Codeforces Round #555 (Div. 3) A B C1(很水的题目)
A. Reachable Numbers 题意:设f(x)为 x+1 这个数去掉后缀0的数,现在给出n,问经过无数次这种变换后,最多能得到多少个不同的数. 代码 #include<cstdio& ...
- wireshark 抓包
Wireshark(前称Ethereal)是一个网络数据包分析软件.网络数据包分析软件的功能是截取网络数据包,并尽可能显示出最为详细的网络数据包数据.Wireshark使用WinPCAP作为接口,直接 ...
- dubbo SPI设计
SPI 全称为 Service Provider Interface,是一种服务发现机制.SPI 的本质是将接口实现类的全限定名配置在文件中,并由服务加载器读取配置文件,加载实现类.这样可以在运行时, ...
- Java Web入门学习(一) STS与Tomcat配置
Java Web学习(一) STS与Tomcat配置 一.IDE的选择 使用基于Eclipse的STS Ide ,个人感觉挺好用的. 地址:http://spring.io/tools/sts 根据以 ...
- Elastic-Job源码分析之JobScheduler类分析
JobScheduler这个类是EJ中比较核心的一个类,我们现在开始解析这个类. 一.构造器 首先我们看一下JobScheduler的几个构造器. private JobScheduler(final ...
- hadoop-2.6.0.tar.gz + spark-1.5.2-bin-hadoop2.6.tgz的集群搭建(单节点)(Ubuntu系统)
前言 本人呕心沥血所写,经过好一段时间反复锤炼和整理修改.感谢所参考的博友们!同时,欢迎前来查阅赏脸的博友们收藏和转载,附上本人的链接.http://www.cnblogs.com/zlslch/p/ ...