JavaScript代码运行前有一个类似编译的过程即词法分析,词法分析主要有三个步骤:

  • 分析参数
  • 再分析变量的声明
  • 分析函数声明

具体步骤如下:

  • 函数在运行的瞬间,生成一个活动对象(Active Object),简称AO
  • 第一步:分析参数:
  1. 函数接收形式参数,添加到AO的属性,并且这个时候值为undefine,即AO.age=undefine
  2. 接收实参,添加到AO的属性,覆盖之前的undefine
  • 第二步:分析变量声明:如var age;或var age=18;
  1. 如果上一步分析参数中AO还没有age属性,则添加AO属性为undefine,即AO.age=undefine
  2. 如果AO上面已经有age属性了,则不作任何修改
  • 第三步:分析函数的声明:
  • 如果有function age(){}把函数赋给AO.age ,覆盖上一步分析的值

看一段代码练练手:

 function func(age) {
console.log(age);
var age = 25;
console.log(age);
function age() {
}
console.log(age); }
func(18);

词法分析:

第一步,分析函数参数:
  形式参数:AO.age = undefined
  实参:AO.age = 18
第二步,分析局部变量:
  第3行代码有var age,但此时第一步中已有AO.age = 18,故不做任何改变
  即AO.age = 18
第三步,分析函数声明:
  第5行代码有函数age,则将function age(){}付给AO.age,即AO.age = function age() {}

所以,执行代码时:

  第2行代码运行时拿到的age是词法分析后的AO.age,结果是:function age() {};

  第3行代码:25赋给age,此时age=25;

  第4行代码运行时age已被赋值为25,结果25;

  第5,6行代码是一个函数表达式,所以不会做任何操作;

  第7行代码运行时age仍然是25,结果也是25。看看浏览器执行的结果,bingo~~

词法分析时应该注意var age = function age(){},这个语句,参与了第二步和第三步;

执行代码时应注意函数表达式不做任何操作,且只声明变量没赋值时,age仍然等于AO.age。

例2:

 function func(age) {
var age;
console.log(age);
var age = 25;
console.log(age);
function age() {
}
console.log(age); }
func(18);

答案:

例3:

 function func(age) {
var age;
console.log(age);
var age = 25;
console.log(age);
function age() {
console.log(age);
}
age();
console.log(age); }
func(18);

答案:

例4:

 function func(age) {
var age;
console.log(age);
function age() {
console.log(age);
}
age();
console.log(age); }
func(18);

答案:

例5:

 function func(age) {
console.log(age);
var age = function age() {
console.log(age);
};
age();
console.log(age);
}
func(18);

答案:

浅谈JavaScript词法分析步骤的更多相关文章

  1. 浅谈javascript函数节流

    浅谈javascript函数节流 什么是函数节流? 函数节流简单的来说就是不想让该函数在很短的时间内连续被调用,比如我们最常见的是窗口缩放的时候,经常会执行一些其他的操作函数,比如发一个ajax请求等 ...

  2. 浅谈JavaScript中的闭包

    浅谈JavaScript中的闭包 在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: functio ...

  3. 浅谈JavaScript浮点数及其运算

    原文:浅谈JavaScript浮点数及其运算     JavaScript 只有一种数字类型 Number,而且在Javascript中所有的数字都是以IEEE-754标准格式表示的.浮点数的精度问题 ...

  4. 浅谈 JavaScript 编程语言的编码规范

    对于熟悉 C/C++ 或 Java 语言的工程师来说,JavaScript 显得灵活,简单易懂,对代码的格式的要求也相对松散.很容易学习,并运用到自己的代码中.也正因为这样,JavaScript 的编 ...

  5. 浅谈javascript的原型及原型链

    浅谈javascript的原型及原型链 这里,我们列出原型的几个概念,如下: prototype属性 [[prototype]] __proto__ prototype属性 只要创建了一个函数,就会为 ...

  6. 浅谈JavaScript中的null和undefined

    浅谈JavaScript中的null和undefined null null是JavaScript中的关键字,表示一个特殊值,常用来描述"空值". 对null进行typeof类型运 ...

  7. 浅谈JavaScript中的正则表达式(适用初学者观看)

    浅谈JavaScript中的正则表达式 1.什么是正则表达式(RegExp)? 官方定义: 正则表达式是一种特殊的字符串模式,用于匹配一组字符串,就好比用模具做产品,而正则就是这个模具,定义一种规则去 ...

  8. [转载]浅谈JavaScript函数重载

     原文地址:浅谈JavaScript函数重载 作者:ChessZhang 上个星期四下午,接到了网易的视频面试(前端实习生第二轮技术面试).面了一个多小时,自我感觉面试得很糟糕的,因为问到的很多问题都 ...

  9. 浅谈JavaScript的面向对象和它的封装、继承、多态

    写在前面 既然是浅谈,就不会从原理上深度分析,只是帮助我们更好地理解... 面向对象与面向过程 面向对象和面向过程是两种不同的编程思想,刚开始接触编程的时候,我们大都是从面向过程起步的,毕竟像我一样, ...

随机推荐

  1. 六款值得推荐的android(安卓)开源框架简介【转】

    http://my.oschina.net/u/1244156/blog/380647 1.volley 项目地址 https://github.com/smanikandan14/Volley-de ...

  2. 前端JS开发框架-DHTMLX--dhtmlXTree

    介绍 dhtmlxTree是一个功能丰富的JavaScript树菜单  它允许您快速添加一个好看的,基于ajax的web页面的分层树. treeview支持在线节点编辑.先进的拖放,三态复选框等等.由 ...

  3. 标准I/O的替代软件

    标准I/O并不完善. 标准I/O库的一个不足之处是效率不高,这与它需要复制的数据量有关.当使用每次一行函数fgets和fputs时,通常需要复制两次数据:一次是在内核和标准I/O缓冲之间(当调用rea ...

  4. 自定义QT事件

    qtuserclass 1.事件ID 本质上就是一个整型值.0-999作为系统保留字段,自定义事件从QEvent::User(也就是1000)开始, 例如: #define MY_EVENT QEve ...

  5. 通过ftp模拟网盘

    package com.xiaomo.ftp.down_upload; import java.io.IOException; import java.util.ArrayList; import j ...

  6. 如何在 Objective-C 的环境下实现 defer

    关注仓库,及时获得更新:https://github.com/draveness/iOS-Source-Code-Analyze Follow: https://github.com/Dravenes ...

  7. linux如何查进程、杀进程

    本文系转载,转载原文地址:http://blog.sina.com.cn/s/blog_637112040100vl53.html 1.查进程   ps命令查找与进程相关的PID号:   ps a 显 ...

  8. oracle修改字段类型

    有一个表名为tb,字段段名为name,数据类型nchar(20). 1.假设字段数据为空,则不管改为什么字段类型,可以直接执行:alter table tb modify (name nvarchar ...

  9. PowerDesigner使用详解

    PowerDesign高级应用编写相关的VBS脚本在PowerDesign里自定义一些命令与操作等,具体的可以参考C:\Program Files\Sybase\PowerDesigner 9\VB ...

  10. Redhat YUM U盘源配置

    Redhat YUM U盘源配置 1)在U盘创建目录 #mkdir /yum/Server 并从光盘Server.Packages 目录的所有文件拷贝到/yum/Server 2)安装 creater ...