首頁 > web前端 > js教程 > JavaScript 中的日變數:透過實際範例了解「const」、「let」和「var」。

JavaScript 中的日變數:透過實際範例了解「const」、「let」和「var」。

WBOY
發布: 2024-08-31 06:32:32
原創
724 人瀏覽過

Day astering Variables in JavaScript: Understanding `const`, `let`, and `var` with Real-World Examples.

當您使用 JavaScript 時,您首先要學習的事情之一就是如何聲明變數。變數就像是儲存資訊的容器,例如數字、文字甚至複雜資料。在 JavaScript 中,宣告變數有三種方式:const、let 和 var。其中每一個都有自己的規則和最佳實踐,一開始可能會有點令人困惑。在這篇文章中,我們將透過簡單的範例對其進行分解,以幫助您了解何時以及如何使用每個範例。

範例程式碼

讓我們從一段簡單的程式碼開始:

`javascript
const accountId = 14423;
var accountEmail = "aman@google.com";
讓 accountPassword = "12345";
accountCity = "賈姆謝德布爾";
讓 accountRoll;

// accountId = 13242; // 不允許 - 會拋出錯誤

console.table([accountEmail, accountId, accountRoll, accountPassword]);
`

理解常量

我們宣告的第一個變數是使用 const 的 accountId。當您想要聲明一個其值永遠不會改變的變數時,可以使用 const 關鍵字。一旦將值指派給 const 變量,就無法將其重新指派給其他變數。例如:

const accountId = 14423;
accountId = 13242; // This will throw an error!
登入後複製

在上面的範例中,嘗試重新指派 accountId 將導致錯誤,因為 const 變數在初始分配後是不可變的。

const 重點:

  • 無法重新指派:一旦將值指派給 const 變量,就無法變更。
  • 區塊作用域: 變數只能在宣告它的區塊內存取(例如,在 {} 內)。

理解讓

接下來,我們使用 let 宣告 accountPassword。當您想要宣告一個其值稍後可能會變更的變數時,請使用 let 關鍵字。與 const 不同,您可以重新指派 let 變數:

let accountPassword = "12345";
accountPassword = "67890"; // This is perfectly fine!
登入後複製

但是,與 const 一樣,let 也是區塊作用域的,這意味著它只能在聲明它的區塊內存取。

let 重點:

  • 可以重新賦值:在賦值後,您可以變更 let 變數的值。
  • 區塊作用域:變數只能在宣告它的區塊內存取。

理解變數

最後,我們來談談 var,它是我們聲明 accountEmail 的方式。 var 是 JavaScript 中宣告變數的舊方法。與 let 和 const 相比,它有一些關鍵區別:

var accountEmail = "aman@google.com";
var accountEmail = "john@google.com"; // This is allowed!
登入後複製

如您所見,與 let 和 const 不同,您可以在同一範圍內重新聲明 var 變量,而不會出現任何錯誤。這有時會導致錯誤和意外行為,這就是為什麼許多開發人員更喜歡 let 和 const 的原因。

關於 var 的要點:

  • 可以重新賦值和重新宣告:您可以變更值,甚至可以重新宣告 var 變數。
  • 函數作用域: 與區塊作用域的 let 和 const 不同,var 是函數作用域。這意味著它可以在聲明的函數內訪問,但不限於區塊。

快速比較

以下是總結差異的快速比較:

{
    var x = 10;
    var x = 20; // Allowed, no error

    let y = 10;
    let y = 20; // Not allowed, will throw a syntax error
}
登入後複製

實際範例:使用console.table

在程式碼結尾,我們使用 console.table 以簡潔的表格格式顯示變數的值:

console.table([accountEmail, accountId, accountRoll, accountPassword]);
登入後複製

這會輸出一個表,其中包含 accountEmail、accountId、accountRoll 和 accountPassword 的目前值。這是在調試或檢查工作時可視化變數的便捷方法。

結論

理解 const、let 和 var 之間的差異對於編寫乾淨、無錯誤的 JavaScript 程式碼至關重要。快速回顧一下:

  • 當您希望變數保持常數時,請使用 const。
  • 當你期望變數的值改變時使用let。
  • 避免使用 var,除非您有特定原因使用它(由於其函數範圍的行為)。

透過掌握這三個關鍵字,您將能夠編寫更可靠且可維護的 JavaScript 程式碼。如需更詳細的信息,您可以隨時參考 MDN 文件。

祝您編碼愉快,下一篇見!

以上是JavaScript 中的日變數:透過實際範例了解「const」、「let」和「var」。的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板