JavaScript核心概念 - LHS、RHS是什麼?

原始碼語法錯誤

首先,當我們在原始碼上使用到錯誤的語法時,console 都會顯示錯誤,這是原始碼在直譯器編譯過程中發生了錯誤。從下圖來看,我們在賦予字串這個值時,少了一個引號,console.log 則是少了括號,造成直譯器無法編譯。
 
原始碼語法錯誤
因此,我們在撰寫 JavaScript 時,可能會很常在變數與值的語法上發生一些錯誤,接下來我們將了解 LHS 和 RHS 概念,用來排除錯誤。
LHS 和 RHS 概念是對變數與值的查詢、操作,其區分如下:

  • LHS (Left-hand Side)
    • 用來賦予值到左側的變數上
  • RHS (Right-hand Side)
    • 取得來自於右側變數上的值

LHS (Left-hand Side)

從圖中的範例我們可以看到,在編譯過程中宣告一個變數並將值賦予到左側的變數上,這個過程稱為 LHS 。
但是,若我們將左側改成字串,並賦予 1 這個值呢?
我們可以發現 console 會出現錯誤,這個錯誤是指左邊的變數是無法被賦予的,因此當我們在開發時出現這樣的錯誤就可以對此進行修正。另外,這段錯誤是屬於編譯過程中所發生的錯誤,在這樣的情形下會連編譯的結果都無法生成。
 
LHS編譯錯誤

RHS (Right-hand Side)

從圖中的範例我們可以看到,宣告一個 ASin 變數並從右邊的 style 變數取得他的值,我們稱為 RHS,同樣的第一個 console.log() 從右邊的 ASin 取得值,並呈現在 console 中也是 RHS 。
那 RHS 可能會發生什麼樣的錯誤呢?
當我們 console.log()去取一個未宣告的變數時,他就會產生錯誤。但是,這邊要注意的是,我們可以發現 console.log(ASi) 是我們在輸入執行後才產生沒有定義的錯誤,並不是在編譯過程就產生錯誤,所以我們可以下一個結論,RHS 在編譯過程中不會產生錯誤,而是在執行時才發現錯誤
 
RHS概念

0%