最近在學習javascript過程當中,接觸了LHS與RHS的概念,剛開始的時候有點理解不清,如今作一些梳理,方便之後進行理解。javascript
LHS與RHS:javascript引擎的兩種查找類型,含義是賦值操做的左側與右側。html
LHS:對哪一個賦值就對哪一個進行LHS引用,能夠理解爲賦值操做的目標。java
RHS:須要獲取哪一個變量的值,就對哪一個變量的值進行RHS引用,理解爲賦值操做的源頭。函數
賦值操做有多種形式,對於以上的兩種對LHS與RHS的解釋,我剛剛接觸,仍是很混亂。學習
個人理解就是,通常在左邊的須要被賦值,就是LHS引用,右邊須要尋找到他的值,就是RHS引用。spa
例如:code
1 function foo(a){ 2 var b=a; 3 rerurn a+b; 4 } 5 var c=foo(2);
以上代碼中有3個LHS與4個RHS,分析以下:htm
第一,var c中的c須要被賦值,在賦值操做的左側,因此對c進行LHS引用blog
第二,變量c須要被賦值,他的值是foo(2),那麼foo(2)的值是多少呢,須要查找foo(2)的值,在賦值操做的右側,因此對foo(2)進行RHS引用ip
第三,隱含賦值操做,將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做爲一個變量沒有定義的時候是會報錯的