你不知道的Javascript(上卷)这本书在我看来是一本还不错的书籍,这本书用比较简洁的语言来描述Js的那些”坑”,在这里写一些博客记录一下笔记以便消化吸收。

1 编译原理

在此书中,开始便提出:Javascript是一门编译型语言,我一开始以为这是国内翻译的锅,翻译的不够准确,后来我还专门去github看了,作者确实是将Js描述为一门编译型语言(compiled language)。然而我认为作者更想表达的是Js也拥有和Java一般的特定的编译过程.而不是传统得认为只是单纯的进行”解释执行”。

编译型语言的定义是编译型语言的首先将源代码编译生成机器语言,再由机器运行机器语言,就如C/C++一般。

Java把源代码编译成为JVM可以执行的字节码,明显是不符合编译型语言的定义的,所以Java是一门解释型语言。而Javascript也拥有同Java类似的过程,但是这个过程很短。这它在代码执行前的几微秒内要完成程序的编译,然后马上执行。

Javascript的编译分为三个步骤:

a.分词/词法分析

b.解析/语法分析

c.代码生成

Javascript在编译阶段的语法分析和代码生成阶段使用了各种方法(JIT, 延迟编译, 重编译等)保证性能最佳。

2 理解作用域

书中所说的Javascript的解释和执行的过程,主要就几个角色参与:

引擎:负责编译的第一部分(分词/词法分析)和执行编译后生成的代码

编译器:负责编译的第二部分(语法分析)和编译的第三部分(代码生成)

作用域:负责收集所有声明的标识符,即变量,并且维护一套管理变量的规则
对于var a = 2;可以认为他的执行过程如下

a.引擎执行编译的第一步 分词/词法分析

b.引擎调用编译器,编译器进行编译的语法分析和代码生成

a) 编译器遇到var a,去当前的作用域集合中查找是否存在a这个变量

b) 如果存在,则忽略变量声明

c) 如果不存在,则在作用域中声明一个新的变量,命名为a

d) 生成引擎运行所需代码

c.引擎运行生成的代码

a) 去当前作用域中查找是否存在a变量,如果找不到这个变量,它会继续往上 (它的上一层作用域)寻找

b) 如果存在,会使用这个变量,并为这个变量赋值

c) 如果不存在,会抛出一个异常或者创建一个变量(*详细请看下文LHS和 RHS)

备注:引擎去作用域查找变量的方式有两种一种是LHS查询,另外一种是RHS查询。

a) LHS可以认为是代表取得变量的源地址(变量实际上就是计算机内存中一段连续 的地址,并且我们通过为变量命名来为这段内存地址命名),取得源地址用于为该变量赋值。

b) RHS代表查询得到变量的值,一般用于为其他变量赋值

直接说LHS和RHS肯定太抽象,也不好记,LHS 和 RHS 字面上区别在于 L 和 R,分别代表左(left)和右(right)

对于 a= b = 2 这行代码,代码首先为b赋值为2。然后呢?重点来了

1首先查询得到b的值

2把查询的得到的值赋给a

而这,恰好分别对应着RHS查询和LHS查询,首先对处于右边的b进行一次RHS(查询得到b的值),然后LHS查询找到a变量的源地址(为a赋值)。

函数的执行,比如foo(2),实际是对foo进行一次RHS,得到的值是函数类型的对象,然后去执行他时,还有一次(多个形参时就是多次)对形参的LHS

3 作用域嵌套

当一个块或函数嵌套在另外一个块或函数中时,就发生了作用域的嵌套,因此,如果我们在一个块中定义函数的话,函数执行过程中是可以调用到函数外层的变量的。

整个的函数作用域链就像一个金字塔,在书中作者把函数作用域链比喻为一个建筑。在作用域的最顶层是一个全局作用域,每一个作用域都可能包含数个子作用域,如此往下延伸,因此金字塔对函数作用域链会更贴切。

LHS和RHS都会先在当前作用域进行查找,如果没有找到结果,那么它们都会一直往上寻找,直至全局作用域。

4 异常

如果引擎在最顶层的全局作用域中也找不到,那么会有什么行为呢? 在这里的话,LHS和RHS会有不同的行为

a.对于LHS:如果在最顶层也找不到这个变量,如果在非严格模式下,那么会在全局 作用域创建一个全局变量,如果处于严格模式下,严格模式禁止自动或隐式创建全 局变量,此时会抛出ReferenceError异常

b.对于RHS:如果在最顶层也找不到这个变量,那么会抛出ReferenceError异常。如果对查询的变量进行不合理的操作,比如调用非函数对象,会抛出TypeError异常。

你不知道的Javascript(上卷)读书笔记之一 ---- 作用域的更多相关文章

  1. JavaScript词法作用域—你不知道的JavaScript上卷读书笔记(一)

    前段时间在每天往返的地铁上抽空将 <你不知道的JavaScript(上卷)>读了一遍,这本书很多部分写的很是精妙,对于接触前端时间不太久的人来说,就好像是叩开了JavaScript的另一扇 ...

  2. JS闭包—你不知道的JavaScript上卷读书笔记(二)

    关于闭包,初学者会被绕的晕头转向,在学习的路上也付出了很多精力来理解. 让我们一起来揭开闭包神秘的面纱. 闭包晦涩的定义 看过很多关于闭包的定义,很多讲的云里雾里,晦涩难懂.让不少人以为闭包是多么玄乎 ...

  3. 你不知道的javascript 上卷 读书笔记

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. JavaScript中的this—你不知道的JavaScript上卷读书笔记(三)

    this是什么? this 是在运行时进行绑定的,并不是在编写时绑定,它的上下文取决于函数调用时的各种条件.this 的绑定和函数声明的位置没有任何关系,只取决于函数的调用方式.当一个函数被调用时,会 ...

  5. JavaScript中的对象与原型—你不知道的JavaScript上卷读书笔记(四)

    一.对象 对象可以通过两种形式定义:声明(文字)形式和构造形式.即: var myObj = { key: value // ... }; 或: var myObj = new Object(); m ...

  6. 《你不知道的javascript》读书笔记2

    概述 放假读完了<你不知道的javascript>上篇,学到了很多东西,记录下来,供以后开发时参考,相信对其他人也有用. 这篇笔记是这本书的下半部分,上半部分请见<你不知道的java ...

  7. 读《你不知道的JavaScript(上卷)》后感-作用域闭包(二)

    github原文 一. 序言 最近我在读一本书:<你不知道的JavaScript>,这书分为上中卷,内容非常丰富,认真细读,能学到非常多JavaScript的知识点,希望广大的前端同胞们, ...

  8. 《你不知道的JavaScript》读书笔记(二)词法作用域

    JavaScript 采用的是 词法作用域 的工作模型. 定义 词法化:大部分标准语言编译器的第一个工作阶段叫词法化(单词化),这个过程会对源代码中的字符进行检查,如果是有状态的解析过程,还会赋予单词 ...

  9. 《你不知道的javascript》读书笔记1

    概述 放假读完了<你不知道的javascript>上篇,学到了很多东西,记录下来,供以后开发时参考,相信对其他人也有用. js的工作原理 引擎:从头到尾负责整个js的编译和运行.(很大一部 ...

  10. 《你不知道的JavaScript》读书笔记(一)作用域

    名词 引擎:从头到尾负责整个 JavaScript 程序的 编译 及 执行 过程. 编译器:负责 语法分析 及 代码生成. 作用域:负责收集并维护由所有声明的标识符(变量)组成的一系列查询,并实施一套 ...

随机推荐

  1. php怎么获取input输入框中的值去数据库比较显示出来

    前端: <!--商品查询--> <input type="text" name="bianhao" value="" ma ...

  2. jquery模拟LCD 时钟

    查看效果网址:http://keleyi.com/keleyi/phtml/jqtexiao/24.htm 以下是HTML文件源代码: <!DOCTYPE html PUBLIC "- ...

  3. 前端Demo常用库文件链接

    <!doctype html><html><head> <meta charset="UTF-8"> <title>前端 ...

  4. git mv 命令 移动或重命名

    最基本的代码: git mv file_old file_new 手册: NAME git-mv - Move or rename a file, a directory, or a symlink ...

  5. web前端交互性易用性说明

    总结一下我们在web前端开发过程中总是强调交互性.易用性的情况分析说明.个人觉得web前端的易用交互也就是我们所说人性化操作.不外乎希望达到的效果为:界面风格简洁明了.重点突出:操作简单,直观可见.当 ...

  6. CSS性能分析,如何优化CSS提高性能

    不负十年后的自己,共勉! 前端性能优化一直是一个比较热门的话题,我们总是在尽我们最大的努力去,提高我们的页面性能,比如减少HTTP请求,利用工具对资源进行合并压缩,脚本置底,避免重复请求,css sp ...

  7. iOS UITableView删除cell分割线

    UITableView是UITableViewStylePlain风格的,这样整个TableView都会被分割线分隔开,不管有没有数据,非常丑. 为了可以自定义cell的分割线: 解决方案: 将UIT ...

  8. Centos6_64 rpm打包实践

    安装rpmbuild sudo yum install rpm-build 普通用户的配置 /home/you/rpmbuild/ 假设是要构建rpm的目录 先说说rpmbuild有什么用,给一个例子 ...

  9. UIImageView

    - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. /***** ...

  10. log4j配置

    log4j.rootCategory=DEBUG , R, D,stdout # Console log4j.appender.stdout=org.apache.log4j.ConsoleAppen ...