打算把《你不知道的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. FlexViewer之整体框架解析

    参考:https://www.cnblogs.com/naaoveGIS/p/3915912.html GIS之家:https://xiaozhuanlan.com/gishome 小专栏:https ...

  2. struts2实现jQuery的异步交互

    struts2中jQuery的异步交互有两种方式: 1)是利用构造字符串的方式来实现: 使用该方法主要是在服务器端根据前端的请求,返回一个字符串信息,然后前端的jQuery通过解析该字符串信息得到对应 ...

  3. PCH 文件 和 ProjectName-Bridging-Header 配置

    1.简介 PCH文件是Xcode编程中全局引用共享的文件.可以在这里引入头文件或者宏定义来方便程序中多个文件访问. 2.PCH文件创建 打开工程 New File… -> iOS Other - ...

  4. ReactiveCocoa(I)

    ReactiveCocoa常见类 1. RAC中最核心的类RACSiganl: RACSiganl:信号类,一般表示将来有数据传递,只要有数据改变,信号内部接收到数据,就会马上发出数据 解析: 信号类 ...

  5. ASP.NET界面重定向传值

    这么说吧,当程序启动时,ASP.NET会自动创建一些经常使用的类的实例,而这些实例就是ASP.NET的内置对象,常用的实例对象有:Response(来自HttpResponse类).Request(来 ...

  6. mybatis源码解析1--前言

    在开始分析mybatis源码之前,需要定一个目标,也就是我们不是为了读源码而去读,一定是带着问题去读,在读的时候去寻找到答案,然后再读码的同时整理总结,学习一些高级的编码方式和技巧. 首先我们知道my ...

  7. python小练习:读入一个考试得分,判断这个分数是哪个等级,并输出,考虑异常场景

    读入一个考试得分,判断这个分数是哪个等级,并输出. 等级:>=90 优 ,>=80且小于90 良,>=70 且小于80,中,>=60且<70及格  <60 不及格 ...

  8. SQL优化(转)

    1. 负向条件查询不能使用索引 select * from order where status!=0 and stauts!=1 not in/not exists都不是好习惯 可以优化为in查询: ...

  9. v-html对于↵转义的问题

    方法1 用pre标签展示 <pre v-html> </pre> 方法2 浏览器处理换行的时候,会进行自动合并 (1)设置 white-space: pre,禁用自动合并: ( ...

  10. sql之left join、right join、inner join的区别,连接自己时的查询结果测试

    sql之left join.right join.inner join的区别 left join(左联接) 返回包括左表中的所有记录和右表中联结字段相等的记录 right join(右联接) 返回包括 ...