打算把《你不知道的JavaScript》中的知识点整理下,写点自己的心得,同时也敦促自己看书。

先做个整体的介绍,最后会再给个综合的例子。

RHS 查询与简单地查找某个变量的值别无二致,而LHS 查询则是试图找到变量的容器本身,从而可以对其赋值。

LHS查询

LHS查询指的是找到变量的容器本身,从而可以对其进行赋值。也就是找到赋值操作的目标。

LHS查询的时候会沿着作用域链进行查询,找到的话就会将值赋值给这个变量,如果到达作用域顶端仍然找不到,就会在作用域链顶端创建这个变量。

举个例子

var a=2;

var a=2;相当于var a; a=2;

这里的a就是一个LHS引用,我们只是想要为2找到一个赋值的目标,而不会去关心这个目标(这里为a)的值是多少什么的。

因为var a;也就是已经把a添加到当前作用域了,所以LHS查询a的时候,找到了a,即找到了赋值操作的目标。

如果没有var a;那么LHS查询a的时候,就会找不到a,就会在作用域中创建这个变量a。

RHS查询

RHS查询就是普通的查询变量的值,即获取变量的值。

RHS查询的时候会沿着作用域链进行查询,找到的话就会取得这个值并返回,如果到达作用域顶端仍然找不到,就会抛出错误(比如TypeError、ReferenceError)。

举个例子

console.log(a);

这里的a就是一个RHS引用,因为console.log需要获取到a的值才能输出a的值。

当然这里的console.log也是一个RHS引用,这里对console 对象进行RHS 查询,并且检查得到的值中是否有一个叫作log 的方法。

例子中的a因为没有声明过,所以会抛出错误。

综合例子

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

例子中的test函数因为没有执行,所以a=2;也就不会执行,也就不会进行LHS查询,自然就没有变量a啦。

而console.log(a)中对a进行RHS查询时,沿着作用域链查找,找不到a,所以会抛出错误(ReferenceError)。

不过如果立即执行的话就不会抛出错误。

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

在这里括号的作用是立即执行函数,因此赋值语句a=2就会执行,所以会对a沿着作用域链进行LHS查询,

LHS查询找不到a,便在作用域链顶端(全局作用域)创建变量a.

故console.log(a)中对a进行RHS查询时,沿着作用域链查找就可以在全局作用域中找到a了,也就可以取得a的值了。

当然上面的IIFE(立即执行函数)也可以写成另一种形势,执行结果一样。

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

理解LHS和RHS查询对于理解作用域至关重要呀,并且可以帮助我们解决很多bug。

你不知道的JavaScript(1)LHS查询和RHS查询的更多相关文章

  1. JavaScript引擎LHS查找和RHS查找

    要想真正理解Javascript脚本中每一句代码的执行过程,需要弄清楚几个基本概念:1.引擎,从头到尾负责整个 JavaScript 程序的编译及执行过程.2.编译器,引擎的好朋友之一,负责语法分析及 ...

  2. JavaScript之找LHS查询和RHS查询

    LHS和RHS,当变量出现在赋值操作的左侧时进行LHS 查询,出现在右侧时进行RHS 查询. LHS 查询是试图找到变量的容器本身,从而可以对其赋值. RHS 理解成retrieve his sour ...

  3. 作用域中LHS查询和RHS查询

    LHS查询:赋值操作左侧的查询,LHS查询试图找到变量的容器本身,,从而对其赋值. RHS查询:赋值操作右侧的查询,可以理解为"取到某某的值" 举例: function foo(a ...

  4. 你不知道的JavaScript LHS 和 RHS 查找

    今天在学习JavaScript的相关知识时接触到了 LHS(Left Hand Side)和 RHS(Right Hand Side)两种对变量查找的方法,之所以JavaScript要查找变量,那就先 ...

  5. 你不知道的JavaScript上卷笔记

    你不知道的JavaScript上卷笔记 前言 You don't know JavaScript是github上一个系列文章   初看到这一标题的时候,感觉怎么老外也搞标题党,用这种冲突性比较强的题目 ...

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

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

  7. 你不知道的JavaScript之作用域

    什么是作用域 编译原理 分词/词法分析 这个过程会将由字符组成的字符串分解成(对编程语言来说)有意义的代码块,这些代 码块被称为词法单元(token) 解析/语法分析 这个过程是将词法单元流(数组)转 ...

  8. 十分钟快速了解《你不知道的 JavaScript》(上卷)

    最近刚刚看完了<你不知道的 JavaScript>上卷,对 JavaScript 有了更进一步的了解. <你不知道的 JavaScript>上卷由两部分组成,第一部分是< ...

  9. 《你不知道的JavaScript》第一部分:作用域和闭包

    第1章 作用域是什么 抛出问题:程序中的变量存储在哪里?程序需要时,如何找到它们? 设计 作用域 的目的:为了更好地存储和访问变量. 作用域:根据名称查找变量的一套规则,用于确定在何处以及如何查找变量 ...

随机推荐

  1. MVC5 您不能调用控制器“xx”上的操作方法“xx”,因为该方法是一种泛型方法

    在 MVC5 中当使用   routes.MapMvcAttributeRoutes() 添加路由属性是导致在控制器创建的泛型方法调用错误: Cannot call action method 'Sy ...

  2. 多模块项目提示“Module ** must not contain source root **. The root already belongs to module **”的解决办法

    从Project Structure里添加模块,完了点击Apply时弹出提示: Module "paycode"must not contain source root " ...

  3. 如何使用js判断当前页面是pc还是移动端打开的

    1.利用了正则表达式和三目运算符,含义就是如果是移动端打开的话那就跳转到 "https:www.baidu.com/" ,如果不是就跳转到"http://new.baid ...

  4. Hibernate框架第二天

    ### Hibernate的持久化类 ### ---------- **什么是持久化类** 1. 持久化类:就是一个Java类(咱们编写的JavaBean),这个Java类与表建立了映射关系就可以成为 ...

  5. Rest概念学习

    参考文章 http://www.cnblogs.com/shanyou/archive/2012/05/12/2496959.html http://www.cnblogs.com/loveis715 ...

  6. uvm设计分析——factory

    uvm的factory机制,通过实例一个static类型default factory,并且通过宏将所有例化extend出来的object,component register到该factory的内部 ...

  7. MySQL练习题之参考答案

    1.创建表结构和数据 /* Navicat Premium Data Transfer Source Server : localhost Source Server Type : MySQL Sou ...

  8. 设计模式之Facade(外观)(转)

    Facade的定义: 为子系统中的一组接口提供一个一致的界面. Facade一个典型应用就是数据库JDBC的应用,如下例对数据库的操作: public class DBCompare { Connec ...

  9. EasyUI添加进度条

    EasyUI添加进度条 添加进度条重点只有一个,如何合理安排进度刷新与异步调用逻辑,假如我们在javascript代码中通过ajax或者第三方框架dwr等对远程服务进行异步调用,实现进度条就需要做到以 ...

  10. docker能用来干嘛

    http://blog.csdn.net/wangtaoking1/article/details/44340445   什么是Docker Docker 是一个开源项目,诞生于 2013 年初,最初 ...