zoukankan      html  css  js  c++  java
  • JavaScript词法分析(尽力理解)

    JavaScript中在调用函数的那一瞬间之前,会先进行词法分析

    词法分析的过程:

    当函数调用的前一瞬间,会先形成一个激活对象:Avtive Object(AO),并会分析以下3个方面:

    1:函数参数,如果有,则将此参数赋值给AO,且值为undefined。如果没有,则不做任何操作。
    2:函数局部变量,如果AO上有同名的值,则不做任何操作。如果没有,则将此变量赋值给AO,并且值为undefined。
    3:函数声明,如果AO上有,则会将AO上的对象覆盖。如果没有,则不做任何操作。

    函数内部无论是使用参数还是使用局部变量都到AO上找

    看两个例子:

    第一个:

    1 var age = 18;
    2 function foo(){
    3   console.log(age);
    4   var age = 22;
    5   console.log(age);
    6 }
    7 
    8 foo();  // 问:执行foo()之后的结果是?

    第二个:

     1 var age = 18;
     2 function foo(){
     3   console.log(age);
     4   var age = 22;
     5   console.log(age);
     6   function age(){
     7     console.log("呵呵");
     8   }
     9   console.log(age);
    10 }
    11 
    12 foo();  // 执行后的结果是?

    最后答案解析:

    第一题:

    undefined 22

    1 过程:
    2   执行前有一个局部变量,形成AO.age = undefined
    3   开始执行,第一个输出age,此时age为undefined,输出undefined
    4   赋值22给age
    5   第二个输出age,此时age已经有了值就输出22

    第二题:

    先输出函数 然后是两个22

     1 词法分析过程:
     2 1、分析参数,有一个参数,形成一个 AO.age=undefine;
     3 2、分析变量声明,有一个 var age, 发现 AO 上面已经有一个 AO.age,因此不做任何处理
     4 3、分析函数声明,有一个 function age(){...} 声明, 则把原有的 age 覆盖成 AO.age=function(){...};
     5 
     6 最终,AO上的属性只有一个age,并且值为一个函数声明
     7 
     8 执行过程:
     9 注意:执行过程中所有的值都是从AO对象上去寻找
    10 
    11 1、执行第一个 console.log(age) 时,此时的 AO.age 是一个函数,所以第一个输出的一个函数
    12 2、这句 var age=22; 是对 AO.age 的属性赋值, 此时AO.age=22 ,所以在第二个输出的是 2
    13 3、同理第三个输出的还是22, 因为中间再没有改变age值的语句了
    14 
  • 相关阅读:
    Prototype源码浅析——String部分(四)之补充
    改造alert的引发的争论【基本类型与引用类型】
    Eclipse rcp 窗口激活
    Eclipse statusLine 加入进度信息
    线的匹配
    python 文本搜索
    Eclipse rcp 编辑器行号显示
    CDT重建索引
    Eclipse rcp 数据存储
    CTabFolder 最大最小化
  • 原文地址:https://www.cnblogs.com/wyb666/p/9356388.html
Copyright © 2011-2022 走看看