javascript中的LHS與RHS


最近在學習javascript過程中,接觸了LHS與RHS的概念,剛開始的時候有點理解不清,現在做一些梳理,方便以后進行理解。

LHS與RHS:javascript引擎的兩種查找類型,含義是賦值操作的左側與右側。

LHS:對哪個賦值就對哪個進行LHS引用,可以理解為賦值操作的目標。

RHS:需要獲取哪個變量的值,就對哪個變量的值進行RHS引用,理解為賦值操作的源頭。

賦值操作有多種形式,對於以上的兩種對LHS與RHS的解釋,我剛剛接觸,還是很混亂。

我的理解就是,一般在左邊的需要被賦值,就是LHS引用,右邊需要尋找到他的值,就是RHS引用。

例如:

1 function foo(a){
2 var b=a;
3 rerurn a+b;
4 }
5 var c=foo(2);

以上代碼中有3個LHS與4個RHS,分析如下:

第一,var c中的c需要被賦值,在賦值操作的左側,所以對c進行LHS引用

第二,變量c需要被賦值,他的值是foo(2),那么foo(2)的值是多少呢,需要查找foo(2)的值,在賦值操作的右側,所以對foo(2)進行RHS引用

第三,隱含賦值操作,將2傳遞給function foo(a){……}函數的參數a,a在賦值操作的左側,對a進行LHS引用

第四,var b=a;中,b需要被賦值,處在賦值操作的左側,所以b進行的LHS,b的值將從a來,那么右側的a的值從何而來呢?這就需要對賦值操作右側的a進行RHS。

第五,return a+b;中,需要找到a與b的值的來源,a與b都在賦值操作的右側,才能得到a+b的值,所以對a與b都是進行RHS引用。

為什么要區分LHS與RHS?

因為在變量還沒有聲明(在任何作用域中都無法找到該變量)情況下,這兩種查詢行為是不一樣的。

例如:

1 function foo(a){
2       console.log(a+b);
3       b=a;
4 }
5 foo(2);

以上代碼對b進行RHS的時候無法找到該變量的值,則會拋出ReferenceError異常,如果是LHS找不到變量,非嚴格模式下,會在全局作用域中,創建一個具有該名稱的變量,嚴格模式下,會拋出與RHS類似的異常。

例如:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript">
          function init(a){
               b=a+3;
               
          }
      init(2);    
      alert(b);//5
    </script>
</head>
<body>
    
</body>
</html>

以上代碼中,對b進行LHS沒有找到該變量,在全局作用域中創建了一個同名的變量b,在函數init外部可以訪問到b變量。

如果將代碼更改為如下:

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <script type="text/javascript">
 7           function init(a){
 8                 var b=a+3;
 9                
10           }
11       init(2);    
12       alert(b);
13     </script>
14 </head>
15 <body>
16     
17 </body>
18 </html>

在function中定義了一個局部變量b,全局作用域中定義,控制台報錯如圖顯示,窗口中沒有任何輸出

將代碼改成如下:

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <script type="text/javascript">
 7           function init(a){
 8                var b=a+3;
 9              
10           }
11       init(2);    
12       alert(window.b);//undefined
13     </script>
14 </head>
15 <body>
16     
17 </body>
18 </html>

將代碼改成如上所示,控制台並沒有報錯, 因為window.b作為window的一個屬性訪問,所以會返回undefined,而b作為一個變量沒有定義的時候是會報錯的

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM