打算把《你不知道的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. node.js初识12

    1.express框架属于后端的框架 cnpm install --save express --save的作用是将下载的保存在package.json中 你可以点击http://www.expres ...

  2. Minecraft 1.8.9 FML Mod 开发教程

    Mod开发教程 https://fmltutor.ustc-zzzz.net/

  3. docker-php-ext-install.md(https://gist.github.com/giansalex/2776a4206666d940d014792ab4700d80)

    ```bash RUN apt update RUN apt upgrade -y RUN apt install -y apt-utils RUN a2enmod rewrite RUN apt i ...

  4. C#中换行的代码

    1.Windows 中的换行符"\r\n"2.Unix/Linux 平台换行符是 "\n".3.MessageBox.Show() 的换行符为 "\n ...

  5. install apache-activemq

    进入bin/linux-x86-64下 cd apache-activemq-5.14.1/bin/linux-x86-64/ 启动 ./activemq start 五.启动成功后,访问 activ ...

  6. tp视图模板

    <?php namespace Home\Controller; use Think\Controller; class IndexController extends Controller { ...

  7. 《大话设计模式》c++实现 建造者模式

    一.UML图 关键词:Subject维护一个Observer列表,Subject执行Notify()时就执行列表中的每个Observer的Update(). 二.概念 观察者模式:定义了一种一对多的依 ...

  8. spring 源码导入eclipse(sts)

    一. 准备工作 1.下载安装sts(springsource推荐使用) 下载地址: http://www.springsource.org/downloads/sts-ggts 2.下载安装gradl ...

  9. springboot用@Autowired和@PostConstruct注解把config配置读取到bean变成静态方法

    springboot用@Autowired和@PostConstruct注解把config配置读取到bean变成静态方法 @SpringBootApplication public class Sen ...

  10. inux 驱动程序开发中输入子系统总共能产生哪些事件类型(EV_KEY,EV_ABS,EV_REL)

    inux 驱动程序开发中, 输入子系统总共能产生哪些事件类型?,以及分别是什么意思?详见如下: Linux中输入设备的事件类型有EV_SYN 0x00 同步事件EV_KEY 0x01 按键事件,如KE ...