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

    变量的赋值执行两个动作,

    1、编译器会在当前作用域中申明一个变量(如果之前没有申明过)。

    2、在运行时引擎会在作用域中查找该变量,如果能找到就会对他赋值。

  首先我们要知道JavaScript程序都是通过JavaScript引擎编译执行来完成的,那我们首先要知道引擎及他的好朋友编译器和作用域是什么

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

  2、编译器:引擎的好朋友之一,负责语法分析及代码生成等脏活累活。

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

-------《你不知道的JavaScript 上卷》

  编译器在编译执行过程的第二步中生成了代码,引擎执行它时,会通过查找变量来判断它是否已经声明过,查找的过程由作用域进行协助,但是引擎执行怎样的查找,会影响最终的查找结果。所谓的LHS和RHS查找,相信你一定能猜到“L”和“R”代表左侧和右侧,具体是什么的左侧和右侧呢?是赋值操作的左侧和右侧,但赋值操作不单单只是赋值操作符哦。

  为了能够完成的理解JavaScript的工作原理,你需要开始像引擎(和他的朋友们)一样思考,从它们的角度提出问题,并从他们的角度回答这些问题,我们首先来看一个例子:

  // 代码部分 

  function foo(a) {

    console.log( a ); //2

  }

  foo( 2 );

  让我们把上面这段代码的处理过程想象成一段对话,这段对话可能是下面这样的。

    引擎: 我说作用域, 我需要为 foo 进行 RHS 引用。 你见过它吗?

    作用域: 别说, 我还真见过, 编译器那小子刚刚声明了它。 它是一个函数, 给你。

    引擎: 哥们太够意思了! 好吧, 我来执行一下 foo。

    引擎: 作用域, 还有个事儿。 我需要为 a 进行 LHS 引用, 这个你见过吗?

    作用域: 这个也见过, 编译器最近把它声名为 foo 的一个形式参数了, 拿去吧。

    引擎: 大恩不言谢, 你总是这么棒。 现在我要把 2 赋值给 a。

    引擎: 哥们, 不好意思又来打扰你。 我要为 console 进行 RHS 引用, 你见过它吗?

    作用域: 咱俩谁跟谁啊, 再说我就是干这个。 这个我也有, console 是个内置对象。给你。

    引擎: 么么哒。 我得看看这里面是不是有 log(..)。 太好了, 找到了, 是一个函数。

    引擎: 哥们, 能帮我再找一下对 a 的 RHS 引用吗? 虽然我记得它, 但想再确认一次。

    作用域: 放心吧, 这个变量没有变动过, 拿走, 不谢。

    引擎: 真棒。 我来把 a 的值, 也就是 2, 传递进 log(..)。

-------《你不知道的JavaScript 上卷》

  LHS和RHS的含义是“赋值操作的左侧和右侧”并不一定意味着是“=赋值操作符的左侧或右侧。赋值操作还有其他几种形式,因此在概念上最好将其理解为“赋值操作符的目标是谁(LHS)”以及“谁是赋值操作的源头(RHS)”。

  在上面的例子中要注意的是:console.log(..) 本身也需要一个引用才能执行,因此会对console 对象进行RHS 查询,并且检查得到的值中是否有一个叫作log 的方法。这里不会再对log进行RHS查询。因为对console查询完毕后,对象属性访问规则会接管对log属性的访问。也就是说,如果是访问对象的属性就不存在LHS查询和RHS查询了,找不到就返回undefined。

你不知道的JavaScript LHS 和 RHS 查找的更多相关文章

  1. 读书笔记-你不知道的JavaScript(上)

    本文首发在我的个人博客:http://muyunyun.cn/ <你不知道的JavaScript>系列丛书给出了很多颠覆以往对JavaScript认知的点, 读完上卷,受益匪浅,于是对其精 ...

  2. 你不知道的JavaScript(1)LHS查询和RHS查询

    打算把<你不知道的JavaScript>中的知识点整理下,写点自己的心得,同时也敦促自己看书. 先做个整体的介绍,最后会再给个综合的例子. RHS 查询与简单地查找某个变量的值别无二致,而 ...

  3. javascript中的LHS和RHS

    最近在拜读<你不知道的javascript>,接触到一个比较陌生的概念,LHS查询和RHS查询. 简单的一句话来讲,当变量出现在赋值操作符的左侧时进行LHS查询,出现在右侧时进行RHS查询 ...

  4. 【转】javascript中的LHS与RHS

    原文链接:http://www.cnblogs.com/yangxiaoguai132/p/5064625.html 最近在学习javascript过程中,接触了LHS与RHS的概念,刚开始的时候有点 ...

  5. javascript中的LHS与RHS

    最近在学习javascript过程中,接触了LHS与RHS的概念,刚开始的时候有点理解不清,现在做一些梳理,方便以后进行理解. LHS与RHS:javascript引擎的两种查找类型,含义是赋值操作的 ...

  6. JavaScript 的查询机制——LHS 与 RHS

    JavaScript 引擎在查找一个变量的时候,有两种查找机制:LHS 和 RHS. RHS 的查询是简单地查找到某个变量的值,而 LHS 则是试图找到变量的容器的本身. 一个简单的例子:当我们执行 ...

  7. 你不知道的Javascript(上卷)读书笔记之一 ---- 作用域

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

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

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

  9. 你不知道的javaScript上卷(第一章 作用域是什么)

    在写这篇博客时这本书我已经是看过一遍了,为了加深印象和深入学习于是打算做这系列的前端经典书籍导读博文,大家如果觉得这本书讲的好可以自己买来看看,我是比较喜欢看纸质版书的,因为这样才有读书的那种感觉. ...

随机推荐

  1. vue的依赖注入provide和inject

    一.解决的场景问题: 根父组件A有一个方法getMap,该组件A下的所有子组件B,子组件C,子组件D,或者子组件B下的子组件E等层层嵌套情况下,在某种情况下,都需要访问父组件的getMap方法,那么常 ...

  2. Jquery生成二维码(微信中长按图片识别二维码功能)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. CNN-3: VGGNet 卷积神经网络模型

    1.VGGNet 模型简介 VGG Net由牛津大学的视觉几何组(Visual Geometry Group)和 Google DeepMind公司的研究员一起研发的的深度卷积神经网络,在 ILSVR ...

  4. AlgorithmMap Dev Log

    Log 2019.08.29 ------------------------------------------------------------------------------------- ...

  5. LC 144. / 94. / 145. Binary Tree Preorder/ Inorder/ PostOrder Traversal

    题目描述 144. Binary Tree Preorder Traversal 94. Binary Tree Inorder Traversal 145. Binary Tree Postorde ...

  6. Django中的Object Relational Mapping(ORM)

    ORM 介绍 ORM 概念 对象关系映射(Object Relational Mapping,简称ORM)模式是一种为了解决面向对象与关系数据库存在的互不匹配的现象的技术. 简单的说,ORM是通过使用 ...

  7. vue-cookies的使用

    安装vue-cookies npm install vue-cookies --save 使用vue-cookies // 在main.js中 // require var Vue = require ...

  8. 【C#】课堂知识点#2

    课堂上老师讲了几点,自己觉得挺重要的,记录下来 1.代码字体调大,方便调试 2.虚心请教,没有谁比谁厉害,不会就虚心多请教,baidu并不能解决所有问题.沟通交流也是一种能力 3.只有每行写对了,才继 ...

  9. Web前后端分离开发(CRUD)及其演变概括

    今天学习了前后端分离开发模式又从网上查了一些资料就写了一篇博客分享: 一.为什么分离前后端 1.1早期开发 1.2后段为主mvc模式 1.2.1Structs框架介绍 1.2.2Spring mcv开 ...

  10. array_chunk — 将一个数组分割成多个

    说明 array_chunk ( array $array , int $size [, bool $preserve_keys = false ] ) : array 将一个数组分割成多个数组,其中 ...