1、作用域

  作用域,它是指对某一变量和方法具有访问权限的代码空间。当我们在定义变量的时候,会定义两种变量,一种是在全局环境下定义的变量,叫全局变量,一种是在函数中定义的变量叫局部变量。全局变量的作用域就是全局环境,局部变量的作用域就是函数。

2、作用域链

  javascript高级程序设计书中写到,当代码在一个环境中执行时,会创建变量对象的一个作用域链。作用域链的用途,是保证对执行环境有权访问的所有变量和函数的有序访问。作用域链的前端,始终都是当前执行的代码所在环境的变量对象。 作用域链中的下一个变量对象来自包含(外部)环境,而再下一个变量则来自下一个包含环境,这样一直延续到全局执行环境;全局执行环境的变量对象始终都是作用域链中的最后一个对象。

  简单来说就是,当我查找一个变量时,我会先在自己所在的环境找,找不到延着作用域链继续向外一层的环境找,找不到再向外找,一直找到全局执行环境中。

  看一小段代码:

  

 var colorA = "red";
function abc(){
var colorB = "blue";
function info(){
var color ="yellow";
console.log(colorA);-------1
console.log(colorB);-------1
console.log(colorC);-------1
};
info();
console.log(colorA);-------2
console.log(colorB);-------2
console.log(colorC);-------2
};
abc();
console.log(colorA);-------3
console.log(colorB);-------3
console.log(colorC);-------3

  在上述代码中,你可以发现,标记为1的,三个颜色A、B、C都能正确的被找到并打印出来。而标记为2的,只能找到A、B颜色。而标记为3的,只能够找到A颜色。

  出现这种情况的原因就是去查找变量值的时候,是先从自身所在的环境中查找,没找到的时候,沿着作用域链向外层查找,所以在内层可以访问到外层定义的变量,在外层是访问不到内层所定义的变量的。

3、块级作用域和函数作用域

  我们都听说过javscript是没有块级作用域的,javascript执行的是函数作用域,那么什么是块级作用域呢?

  任何一对花括号({和})中的语句集都属于一个块,在这之中定义的所有变量在代码块外都是不可见的,我们称之为块级作用域。

  什么是函数作用域?

  简单来说函数中的参数和变量在函数外部是不可见的,只在函数内部可以访问。

  为什么说javascript没有块级作用域,看一段以下代码:

  

 var color="red";
if(true){
var color = "blue";
console.log(color);
}
console.log(color);

  会发现两个输出的都是blue,如果有块级作用域的话,if里面的color会被当做局部变量创建,这样子的话输出的就是"blue","red"了;正是因为没有块级作用域,if里面对color的赋值被当做是全局变量把原来的值覆盖掉,所以输出才会是两个都是blue;

4、变量声明提升

  先来看一小段代码,你认为的输出是什么:

  

 var a = 100;
function testResult(){
var b = 2 * a;
var a = 200;
var c = a / 2;
console.log(b);
console.log(c);
}
testResult();

  我们先不管上面的输出是什么,先来看看这几行代码的输出是什么;

  console.log(a);var a = 123;  //undefined;

  console.log(a);var a ;  //undefined;

  var a = 123;console.log(a);   //123;

  出现这种情况就是因为变量声明提升,我们去声明一个变量的时候javascript引擎会把变量"提前"声明,而把赋值放在原来的顺序。

  所以console.log(a);var a = 123;的执行顺序其实是var a; console.log(a); a = 123;

  故输出a的时候只是创建了变量还没有被赋值,所以输出为undefined;

  现在再来看看刚那段代码的执行顺序其实是:

  

 var a = 100;
function testResult(){
var b;
var a;
var c;
b = 2 * a; //此时在局部变量中找到了a,故不会再向上找全局变量a = 100; 但是a还没被赋值,a为undefined,故此时b为NaN;
a = 200;
c = a / 2; // 100;
console.log(b); //NaN
console.log(c); //100
}
testResult();

注:对undefined作加减乘除会把它转化为数字类型,undefined转化为数字类型就是NaN;

故输出为 NaN 和 100 ;

  

javascript作用域和作用域链的更多相关文章

  1. 深入理解 JavaScript 变量的作用域和作用域链

    一个变量的作用域(scope)是程序源代码中定义这个变量的区域.简单的说,作用域就是变量与函数的可访问范围.全局变量拥有全局作用域,在JavaScript代码中的任何地方都有定义.局部变量是在函数体内 ...

  2. 一步步学习javascript基础篇(2):作用域和作用域链

    作用域和作用域链 js的语法用法非常的灵活,且稍不注意就踩坑.这集来分析下作用域和作用域链.我们且从几道题目入手,您可以试着在心里猜想着答案. 问题一. if (true) { var str = & ...

  3. 关于Javascript作用域及作用域链的总结

    本文是根据以下文章以及<Javascript高级程序设计(第三版)>第四章相关内容总结的. 1.Javascript作用域原理,地址:http://www.laruence.com/200 ...

  4. javascript篇-----函数作用域,函数作用域链和声明提前

    在一些类似C语言的编程语言中,花括号内的每一段代码都具有各自的作用域,而且变量在声明它们的代码段之外是不可见的(也就是我们不能在代码段外直接访问代码段内声明的变量),我们称之为块级作用域,然而,不同于 ...

  5. javascript笔记:javascript的关键所在---作用域链

    javascript里的作用域是理解javascript语言的关键所在,正确使用作用域原理才能写出高效的javascript代码,很多javascript技巧也是围绕作用域进行的,今天我要总结一下关于 ...

  6. 浅谈JavaScript中的变量、参数、作用域和作用域链

    基本类型和引用类型 在JavaScript中有两种数据类型值.基本类型值和引用类型值.基本类型值指的是简单的数据段,而引用类型值指的是可能由多个值构成的对象.在JavaScript中有5种基本数据类型 ...

  7. javascript作用域和作用域链摘录

    作用域是JavaScript最重要的概念之一,想要学好JavaScript就需要理解JavaScript作用域和作用域链的工作原理.今天这篇文章对JavaScript作用域和作用域链作简单的介绍,希望 ...

  8. JavaScript高级之词法作用域和作用域链

    主要内容: 分析JavaScript的词法作用域的含义 解析变量的作用域链 变量名提升时什么 一.关于块级作用域         说到JavaScript的变量作用域,与咱们平时使用的类C语言不同. ...

  9. JavaScript 开发进阶:理解 JavaScript 作用域和作用域链

    作用域是JavaScript最重要的概念之一,想要学好JavaScript就需要理解JavaScript作用域和作用域链的工作原理.今天这篇文章对JavaScript作用域和作用域链作简单的介绍,希望 ...

  10. JavaScript 开发进阶:理解 JavaScript 作用域和作用域链(转载 学习中。。。)

    作用域是JavaScript最重要的概念之一,想要学好JavaScript就需要理解JavaScript作用域和作用域链的工作原理.今天这篇文章对JavaScript作用域和作用域链作简单的介绍,希望 ...

随机推荐

  1. window程序设计1

    int WINAPI WinMain(HINSTANCE HInstance,HINSTANCE HPreInstance,LPSTR szCmdLine,int CmdShown) { Massag ...

  2. C# 调用浏览器打开网址

    private void button1_Click(object sender, EventArgs e) { //调用系统默认的浏览器 System.Diagnostics.Process.Sta ...

  3. 深度克隆(对象、数组)--------百度IFE前端task2

    var srcObj = { a: 1, b: { b1: ["hello", "hi"], b2: "JavaScript" }}; co ...

  4. UC/OS操作系统 (转)

    1.和其他一些著名的嵌入式操作系统不同,uC/OS-II在单片机系统中的启动过程比较简单,不像有些操作系统那样,需要把内核编译成一个映像文件写入ROM中,上电复位后,再从ROM中把文件加载到RAM中去 ...

  5. Leakcanary

    一.什么是内存泄漏 垃圾回收器无法回收应被回收的对象比如:在Activity生命周期过程中,旋转屏幕时应新建activity,原activity应被销毁.但如果线程一直在引用此activity,则会出 ...

  6. TWRP-recovery中文界面安装方法[转]

    把下载到的ui.zip放入sdcard1/twrp文件夹.注意,是内置存储卡中.如没有上述文件夹,自行建立后通过文件管理器放入,不是卡刷.文件夹应如下所示:sdcard1(内置SD)  |  ┕--t ...

  7. Nexus Root Toolkit教程——刷机

    Nexus Root Toolkit是Nexus系列设备专属解锁.root.刷机.修复工具.本教程以Nexus7二代刷安卓5.0 Lollipop系统为实例演示刷机过程. 标签: 安卓5.0刷机教程 ...

  8. vmware workstation 10.0.1 install mac os mavericks

    由于项目当中有ios app开发,第一感觉就是mac开发环境会比较适合开发与调试(虽然linux.windows都有相应的oc开发环境). 由于我是用windows7搞.net开发的,所以其他系统接触 ...

  9. 装饰者模式 - OK

    装饰模式(Decorator),动态地给一个对象添加一些额外的职责,就增加功能来说,装饰模式比生成子类更为灵活.  装饰者模式隐含的是通过一条条装饰链去实现具体对象,每一条装饰链都始于一个Compon ...

  10. logstash tag使用说明

    zjtest7-frontend:/usr/local/logstash-2.3.4/config# cat stdin04.conf input { stdin { } } filter { # d ...