JavaScript的查询机制LHS和RHS解析


Posted in Javascript onAugust 16, 2019

JavaScript 引擎在查找一个变量的时候,有两种查找机制:LHS 和 RHS。

RHS 的查询是简单地查找到某个变量的值,而 LHS 则是试图找到变量的容器的本身。

一个简单的例子:当我们执行 console.log(a) 时,执行的就是 RHS ,因为这里 a 并没有赋予任何的值。相应的,需要查找并取得 a 的值,这样才能将值传递给 conso.log(..)。

而当我们执行到 a = 2 时,这里对 a 的引用就是 LHS 引用,因为实际上我们并不关心当前的值是什么,只是想要为 =2 这个赋值操作找到一个目标。

需要注意的是:

当我们执行以下代码:

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

这里对 foo 的调用执行了 RHS 引用,但还有一个隐式的 a = 2 的操作,这里又执行了一个 LHS 引用。

我们通常把 function foo(a){} 转变为 var foo,foo = function(){} ,如果这样理解的话,这个函数声明会执行 LHS 查询,但是在引擎执行代码的时候,并不会有线程专门用来将一个函数值“分配给”foo。所以,将函数声明理解成 赋值 的 LHS 查询的形式并不合适。

区分 LHS 和 RHS 是一件很重要的事。如果 RHS 查询在作用域链中找不到需要的变量,会抛出 ReferenceError 的异常。

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

以上代码会抛出异常:b is not defined

相比之下,如果JavaScript引擎执行的是 LHS 查询,如果一直到顶层的作用域(全局作用域)中都没有找到目标变量的话,它就会在全局作用域中声明一个具有目标名称的变量,并将其返回给引擎。(非严格模式下,严格模式下会禁止自动创建或隐式创建全局变量)

function foo(a){
b = a; // b = 2
}
foo(2)

上面的代码执行的 LHS 查询,在非严格模式下,JavaScript 引擎在全局作用域中没有找到 b,所以它就在全局作用域中声明了一个变量 b。所以此时结果不会报错且b被赋值为2。

总结:

作用域是一套规则,用于确定在何处以及如何查找变量(标识符)。如果查找的目的是对变量进行赋值,就会使用 LHS 查询;如果目的是获取变量的值,就会使用 RHS 查询。

= 操作符或调用函数时传入参数的操作都会导致关联作用域的赋值操作。

LHS 和 RHS 查询都会在当前执行作用域中开始,如果有需要(当前没找到),就会向上级作用域继续查找目标标识符(作用域链)。

不成功的 RHS 会导致抛出 ReferenceError 异常。不成功的 LHS 会自动隐式在全局作用域中创建一个全局变量(非严格模式下),该变量使用 LHS 引用的目标作为标识符。(如果是严格模式下也会抛出 ReferenceError 异常)。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jQuery的一个扩展form序列化到json对象
Dec 09 Javascript
15条JavaScript最佳实践小结
Aug 09 Javascript
jQuery判断checkbox是否选中的3种方法
Aug 12 Javascript
JQuery调用绑定click事件的3种写法
Mar 28 Javascript
javascript实现实时输出当前的时间
Apr 27 Javascript
JavaScript高级程序设计(第三版)学习笔记6、7章
Mar 11 Javascript
基于jQuery实现Accordion手风琴自定义插件
Oct 13 Javascript
简单实现jquery焦点图
Dec 12 Javascript
JS实现双击内容变为可编辑状态
Mar 03 Javascript
Vue 中 filter 与 computed 的区别与用法解析
Nov 21 Javascript
小程序外卖订单界面的示例代码
Dec 30 Javascript
Vue实现简易计算器
Feb 25 Javascript
jquery树形插件zTree高级使用详解
Aug 16 #jQuery
微信小程序云开发如何实现数据库自动备份实现
Aug 16 #Javascript
jQuery zTree树插件的使用教程
Aug 16 #jQuery
Vue 权限控制的两种方法(路由验证)
Aug 16 #Javascript
JS中的算法与数据结构之列表(List)实例详解
Aug 16 #Javascript
jQuery zTree插件快速实现目录树
Aug 16 #jQuery
JS中的算法与数据结构之二叉查找树(Binary Sort Tree)实例详解
Aug 16 #Javascript
You might like
如何过滤高亮显示非法字符
2006/10/09 PHP
php中使用Akismet防止垃圾评论的代码
2011/06/10 PHP
初学PHP的朋友 经常问的一些问题。不断更新
2011/08/11 PHP
深入理解ob_flush和flush的区别(ob_flush()与flush()使用方法)
2013/02/06 PHP
Nigma vs Liquid BO3 第一场2.13
2021/03/10 DOTA
线路分流自动跳转代码;希望对大家有用!
2006/12/02 Javascript
jquery中动态效果小结
2010/12/16 Javascript
js获取TreeView控件选中节点的Text和Value值的方法
2012/11/24 Javascript
javascript读取Xml文件做一个二级联动菜单示例
2014/03/17 Javascript
javascript从image转换为base64位编码的String
2014/07/29 Javascript
jquery+html5制作超酷的圆盘时钟表
2015/04/14 Javascript
AngularJS仿苹果滑屏删除控件
2016/01/18 Javascript
Bootstrap模态对话框的简单使用
2016/04/29 Javascript
微信小程序  TLS 版本必须大于等于1.2问题解决
2017/02/22 Javascript
vue2.0实战之使用vue-cli搭建项目(2)
2017/03/27 Javascript
bootstrap日期控件问题(双日期、清空等问题解决)
2017/04/19 Javascript
jQuery插件FusionCharts绘制的3D双柱状图效果示例【附demo源码】
2017/04/20 jQuery
React Native时间转换格式工具类分享
2017/10/24 Javascript
vue使用过滤器格式化日期
2021/01/20 Vue.js
python字符串连接的N种方式总结
2014/09/17 Python
Python中使用tarfile压缩、解压tar归档文件示例
2015/04/05 Python
Python与Java间Socket通信实例代码
2017/03/06 Python
Python实现基于二叉树存储结构的堆排序算法示例
2017/12/08 Python
IntelliJ IDEA安装运行python插件方法
2018/12/10 Python
在pycharm中配置Anaconda以及pip源配置详解
2019/09/09 Python
CSS3 animation实现逐帧动画效果
2016/06/02 HTML / CSS
HTML5 video循环播放多个视频的方法步骤
2020/08/06 HTML / CSS
prAna官网:瑜伽、旅行和冒险服装
2019/03/10 全球购物
iHerb俄罗斯:维生素、补品和天然产品
2020/07/09 全球购物
工程资料员岗位职责
2014/03/10 职场文书
酒店管理求职信范文
2014/04/06 职场文书
员工试用期考核自我鉴定
2014/04/13 职场文书
老干部工作先进集体事迹材料
2014/05/21 职场文书
2014年街道办事处工作总结
2014/12/11 职场文书
行政处罚告知书
2015/07/01 职场文书
Nginx+SpringBoot实现负载均衡的示例
2021/03/31 Servers