zoukankan      html  css  js  c++  java
  • 《你不知道的JavaScript》读书笔记(一)作用域

    名词

    引擎:从头到尾负责整个 JavaScript 程序的 编译 及 执行 过程。

    编译器:负责 语法分析 及 代码生成

    作用域:负责收集并维护由所有声明的标识符(变量)组成的一系列查询,并实施一套非常严格的规则,确定当前执行的代码对这些标识符的访问权限。

    LHS:赋值操作的左侧(理解为赋值操作的目标是谁,LHS 查询 试图找到变量的容器本身,并对其 赋值 )。

    RHS:赋值操作的右侧(理解为谁是赋值操作的源头,RHS 查询 就是 查找 某个变量的值)。

    JavaScript 的编译

    Javascript 是一门 编译语言(注①)。

    与传统编译语言不同的是,它不是提前编译的,而是在代码执行前的几微妙甚至更短的时间内进行编译。

    编译器与作用域

    例如 var a = 2;

    JavaScript 的引擎会认为这里有两个完全不同的声明,一个由编译器在编译时处理,另一个则由引擎在运行时处理。

    编译器 会首先将这段程序分解为词法单元,这个过程叫做 1.分词/词法分析(Tokenizing/Lexing),然后将词法单元解析成一个树结构(Abstract Syntax Tree,AST,抽象语法树),这个过程叫 2.解析/语法分析(Parsing)。当遇到 var a 时,编译器会询问作用域是否已经有一个该名称的变量存在与同一个作用域的集合,如果是,编译器会忽略该声明(忽略 var a),否则它会要求作用域在当前作用域的集合中声明一个新的变量,并命名为 a;

    接下来 编译器 会为引擎 3.生成 运行时所需的代码,这些代码用来处理 a = 2 这个赋值操作。

    引擎 运行 时会首先询问作用域,在当前的作用域集合中是否存在一个叫做 a 的变量。如果是,引擎就会使用这个变量,如果否,引擎就会继续查找该变量。

    如果引擎最终找到了 a 变量,就会将 2 赋值给它,否则引擎就会抛出一个异常。

    引擎运行代码时的分析

    在引擎运行代码时,会通过查找变量 a 来判断它是否已经声明过,查找的过程由作用域进行协助。

    例如 console.log(a);

    其中对 a 的引用是一个 RHS 引用,因为这里 a 没有赋予任何值,而需要查找并取得 a 的值,才能传递给 console.log(...)。

    再如 a = 2;

    这里对 a 的引用是 LHS 引用,要为 = 2 这个赋值操作找到一个目标。

    【例】

    1 function foo(a){
    2     console.log(a);
    3 }
    4 foo(2);

    打印出 2 。

    分析:

    1. line 4:(引擎在作用域里)为 foo 进行 RHS 引用;

    2. line 1:(引擎在作用域里)对 a 进行 LHS 引用(给参数 a 隐式分配值);

    3. line 2:(引擎在作用域里)对 console 进行 RHS 引用,并检查得到的值中是否有 log 方法;

    4. line 2:(引擎在作用域里)对 a 进行 RHS 引用。

    【例】

    1 function foo(a){
    2     var b = a;
    3     return a+b;
    4 }
    5 var c = foo(2);

    函数返回 4。

    分析:

    1. line 5:(引擎在作用域里)为 c 进行 LHS 引用(c = ...);

    2. line 5:(引擎在作用域里)为 foo(...) 进行 RHS 引用(foo(2...);

    3. line 1:(引擎在作用域里)为 a 进行 LHS 引用(a = 2);

    4. line 2:(引擎在作用域里)为 b 进行 LHS 引用(b = ...);

    5. line 2:(引擎在作用域里)为 a 进行 RHS 引用(= a);

    6. line 3:(引擎在作用域里)为 a 进行 RHS 引用(a...);

    7. line 4:(引擎在作用域里)为 b 进行 RHS 引用(...b)。

    作用域嵌套

    当一个块或者函数嵌套在另一个块或者函数中,就发生了作用域的嵌套。因此,在当前作用域中无法找到某个变量时,引擎就会在外层嵌套的作用域中继续查找,直到找到该变量,或抵达最外层的的作用域(全局作用域)为止。

    【例】

    1 function foo(a){
    2     console.log( a + b );
    3 }
    4 var b = 2;
    5 foo(2);

    打印出 4。

    分析:

    1. line 4:(引擎在 全局作用域里)对 b 进行 LHS 引用;

    2. line 1:(引擎在 foo 作用域里)对 a 进行 LHS 引用;

    3. line 2:(引擎在 foo 作用域里)对 a 进行 RHS 引用;

    4. line2:(引擎在 foo 作用域里) 对 b 进行 RHS 引用,但是在该作用域内找不到 b 变量

    5. 引擎在 全局作用域内找到了 b 变量,并为 b 进行了 RHS 引用。

    异常

    【例】

    1 function foo(a){
    2     console.log( a + b );
    3     b = a;
    4 }
    5 foo(2);

    结果:

    引擎抛出异常:ReferenceError

    分析:引擎在任何作用域中对无法找到变量 b,也就是说,在对 b 进行 RHS 引用时找不到该变量,引擎就会抛出 ReferenceError 的异常。

    另外,如果引擎执行 LHS 查询时在任何作用域内都无法找到目标变量,有两种情况:1.程序运行在“非严格模式”下,全局作用域就会创建一个具有该名称的变量,并返还给引擎;如果运行在“严格模式”下,则同样会抛出 ReferenceError 异常。

    【例】

    非严格模式:

    function foo(a){
        b = a;
        console.log(b);
    }
    foo(2);

    打印出 2:

    严格模式:

    "use strict";
    function foo(a){
        b = a;
        console.log(b);
    }
    foo(2);

    如果 RHS 查询到了一个变量,但是尝试对这个变量的值进行不合理的操作,比如试图对一个非函数类型的的值进行函数调用,或者引用 null 或 undefined 类型的值中的属性,那么引擎会抛出 TypeError 的异常。

    b = null;
    console.log(b.test);

    注:

    ①来自其他网站关于 Javascript 的定义

    mozilla.org : JavaScript 是一个轻量级的、解释型的、面向对象的脚本语言……它是一种基于原型的、多范式的动态脚本语言。

    百度百科:JavaScript 一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为 JavaScript 引擎,为浏览器的一部分。

    参考:阮一峰《Javascript 严格模式详解

     

    更多例题:http://www.cnblogs.com/dee0912/p/4396356.html

  • 相关阅读:
    To select the file to upload we can use the standard HTML input control of type
    Cascading Menu Script using Javascript Explained
    网站首页head区代码规范
    轻松掌握 Java 泛型
    JDK 5.0 中的泛型类型学习
    如何在firefox下获取下列框选中option的text
    是同步方法还是 synchronized 代码? 详解多线程同步规则
    javascript select option对象总结
    Select的动态取值(Text,value),添加,删除。兼容IE,FireFox
    javascript在ie和firefox下的一些差异
  • 原文地址:https://www.cnblogs.com/dee0912/p/4779559.html
Copyright © 2011-2022 走看看