都知道js中不存在类似于c++等语言的块级作用域,例如for循环中定义的变量,其实是属于当前对象下的属性,同一对象下可以随便访问。只有函数可以限定一个变量的作用范围,即函数才是变量的作用域。

  对于函数的变量访问时遵循作用域链的,即当前函数运行时会有一个当前作用域,当饮用某个变量时,会先查找当前作用域内是否存在该变量的定义,如果不存在则根据作用域链向上去查找父函数的作用域,有则拿来使用,没有则继续向上直到全局作用域。关于作用域链这里就不仔细描述,简单而言,类似原型链,从全局函数直到当前函数的作用域存在一种相互包含的关系,子可以向上访问,但是父不可以向下访问子函数的变量,这样层层嵌套的关系链。

  类似这样的:

 var num = 10;

  function a (){

    alert(num);

  }

  a() //结果alert(10),a里没有num所以向上查找外层的作用域,有且等于10所以弹出10而不是undefined.

  但是,下面的代码就是undefined了:

  var num = 10;

var num = 10;

  function a (){

    alert(num);

    var num = 11;

  }

  为什么呢? a()执行时虽然num=11没有赋值但是父级作用域里是有num=10的,不应该是undefined呀,js是按顺序执行的,此时的var num = 11;根本没有执行,所以应该是10!!你是不是也是这么认为的,就和我当初一样。。

  可以确定这样是对的,不信的小伙伴可以自己去试一试,如果你试的结果是10的话,那么一定是你写的不太一样。

  来深究一下原因,这里就牵扯到js词法分析这个东西了。总所周知js代码自上而下执行,但是在js代码执行前,会先进行词法分析。所以js运行要分为词法分析执行两个阶段。

  js词法分析主要分为3个步骤:

  1,分析形参:如果函数有形参,则给当前活动对象增加形参属性,默认为undefined。

  2,分析变量声明:如果有类似var a  之类的声明,若没有该属性则增加属性,若已存在则不做操作。默认为undefined。变量的赋值在执行阶段才进行,即执行到该变量的时候才有 var a = 11

  3,分析函数声明:类似 function a(){},若当前活动对象没有该属性则新增否则重写该属性为方法a。

所以回到开始的那段代码:

var num = 10;

  function a (){

    alert(num);

    var num = 11;

          function b (){//nth to do }

  }

 

具体步骤:1,分析形参: 此处无形参则不进行操作;当有形参时:

function a (b){

    alert(num);

    var num = 11;

  }

  a(4);

1,分析形参:则当前活动对象object.b = undefined; =>传入参数4则:object.b = 4;

 2,分析变量声明:  var num 则object.num = undefined;

  3, 分析函数声明: function b(){} 则object.b = function(){};重写

  4, 分析执行阶段,当运行到alert(num);时,认为num=10的想法是认为当前作用域没有num变量。该想法是错误的,其实下面只要有声明var num ;此时object.num = undefined,所以并不会向上去找父级作用域的num = 10;所以呢。。。就不是10了。

  其实词法分析并不难,只不过原来的时候掌握的一直不清晰所以造成了该处的疑惑,希望能够帮到同样有需求的同学。

参考文章:http://www.2cto.com/kf/201502/376768.html

js作用域和词法分析的更多相关文章

  1. JS作用域面试题总结

    关于JS作用域问题,是面试的时候面试官乐此不疲的面试题,有时候确实是令人抓狂,今天看到一个讲解这个问题的视频,明白了那些所谓的“原理”顿时有种豁然开朗的感觉~~~ 1.js作用域(全局变量,局部变量) ...

  2. js作用域问题

    <script type="text/javascript"> alert(i);//Uncaught ReferenceError: i is not defined ...

  3. js 作用域

    js 作用域 js作用域链查找,子函数能取到父函数中定义的变量. 前段时间误写成如下形式: 这只是普通的函数调用,没有父子的关系,child()函数会在全局查找pi变量,没找到所以报错. 最近发现原来 ...

  4. 08.01 签到! js 作用域

    js 作用域 : 1.js 没有块作用域 : for (var i = 0;i < 4; i++){ } alert(i) // i = 3 2.js 没有动态作用域: function f1( ...

  5. js作用域链

    js作用域链 <script> var up = 555; function display(){ var innerVar = 2; function inner(){ var inne ...

  6. easyui datagrid load 封装 参数问题 js 作用域

    var temp = { LoginAccount: $('#LoginAccount').val(), ShopName: $('#ShopName').val() }; function doSe ...

  7. js作用域零碎的知识点,不同的script块,虽然同是全局变量

    如下代码,第一次弹出a,因为解析器里找到var a,赋予a变量undefined,弹出undefined <!DOCTYPE html> <html> <head> ...

  8. JS作用域,作用域,作用链详解

    前言   通过本文,你大概明白作用域,作用域链是什么,毕竟这也算JS中的基本概念. 一.作用域(scope) 什么是作用域,你可以理解为你所声明变量的可用范围,我在某个范围内申明了一个变量,且这个变量 ...

  9. JS作用域和ASP(vbs)作用域比较

    一.js作用域,先上图: 以上代码执行的效果是,依次弹出 undefined, undefined, a, a,为什么是这样的结果啦?因为JS的作用域为链式作用域. 作用域链: 用VAR声明一个变量时 ...

随机推荐

  1. Highcharts——大气好用的图标制作工具

    Highcharts是一款纯javascript编写的图表库,能够很简单便捷的在Web网站或Web应用中添加交互性的图表,Highcharts目前支持直线图.曲线图.面积图.柱状图.饼图.散点图等多达 ...

  2. (String)将一个String里面的单词反转

    e.g.  i love java    return   java love i public static String reverseStr(String str) { String[] str ...

  3. ejabberd服务端开发笔记

    网上一搜一大陀ejabberd安装配置的,扩展开发的资料少之又少,写个笔记记录一下. xmpp protocal: http://xmpp.org/xmpp-protocols/xmpp-extens ...

  4. [EventBus源码解析] 初探EventBus

    本期blog作为EventBus(以下简称EB)学习的始动篇,主要记载了EB的功能.优点.使用方法,内容基于github上的README.md与HOWTO.md. 何为EventBus EB实现了An ...

  5. 七、context command

    context command是用来新建自己的工具,可以调用OPENGL,获取鼠标操作函数,在view窗口画自己想画的东西.(我是这麽理解的,可以以后再确定一下) 下面是一个context comma ...

  6. eclipse配置javacv0.8

    之前配置了一次javacv,但是忘了做笔记,这次又重新查了一遍资料,很多东西模棱两可,浪费了很多时间,这次配置成功,总结如下,希望能帮到大家. 如不明确,可以联系我.   javacv下载 https ...

  7. 关于 this 和 prototype 的理解

    1:this 的理解比较好的书是 <Javascript语言精粹> 平时我们全局写 var a = 1, 其实就是 window.a = 1; var f = function(){},  ...

  8. System.ArgumentOutOfRangeException: 指定的参数已超出有效值的范围

    GridView指定的参数已超出有效值的范围GridView在更新过程中异常详细信息: System.ArgumentOutOfRangeException: 指定的参数已超出有效值的范围.参数名:v ...

  9. (转载)IOS中UIScrollView的属性和委托方法

    http://www.jizhishusheng.com/?p=453   ---- 以下内容来自 UIScrollView 类负责所有基于 UIKit 的滚动操作一.创建 1. CGRect bou ...

  10. Visual Studio VS2010统计代码行数(转载)

    本文转自:http://blog.csdn.net/zhouworld16/article/details/9292851 在网上看到别人用的方法: 按CTRL+SHIFT+F (Find in fi ...