---
# System prepended metadata

title: var、let、const 的差異
tags: [javascript 基礎知識]

---

# var、let、const 的差異
###### tags: `javascript 基礎知識`
學期 JaveScript 的路程上，第一個里程碑的就是宣告變數。
從第一次的 helloworld 之後開始學習的就是如何宣告變數以及賦予變數值，那如何宣告變數呢？我們可以使用 var、let、const 作為宣告的方式，這時候問題就來了，這三種有什麼區別呢？
## 全域變數以及區域變數
在區別這三種宣告方式之前，我們應該要先了解什麼是全域變數什麼是區域變數，這樣我們之後比較好理解不同的宣告方式使用的時機
### 全域變數
在全域宣告的變數可以在程式的任何一個地方呼叫，包含函式內(在全域下，要宣告變數可以不需要 var、let、const)
#### 範例如下
``` JavaScript
a = 1;
console.log(a)
// 1
function show(){
    a+=2
    console.log(a)
}
show()
// 3
```
### 區域變數
變數在特定區域內存活，例如在函式內宣告的變數，是無法在其他函式或者是全域中讀取到的
#### 範例如下
``` JavaScript
function show(){
    var a = 2
}
console.log(a)
//Uncaught ReferenceError: a is not defined 
```
## var、let、const 的不同
### var
var 是在 function scope （函式作用域）的宣告變數的方式，他的特性是只會在函式內存活，你無法在全域的狀況下讀取到他
```JavaScript
function show(){
    var a = 2
}
console.log(a)
//Uncaught ReferenceError: a is not defined 
```
早在 ES6 之前宣告變數都是使用 var 但是問題是他會在特定情況下污染到全域的變數，例如說區塊語句if、else、for、while所以在 ES6 之後就比較少用 var 最為宣告變數的手法

### let、const 
let、const 是在 block scope (區塊作用域)宣告店數的方式，區塊作用域的定義就是他只在{ ... }大括號裡面存活，我們無法在全域或者是其他大括號裡面去讀取該變數
#### 範例如下
```JavaScript
function show(){
    let a = 2
    const b =2
}
console.log(a,b)
//Uncaught ReferenceError: a is not defined 
```
而 let 與 const 的不同點在於，const 為宣告常數，也就是說以const 宣告的變數在基本型別上，難以再去做變更。



## 參考文章
JS 筆記 - 全域變數與區域變數
https://hsuchihting.github.io/javascript/20200224/3133182567/
JavaScript 宣告: var、let、const
https://www.iware.com.tw/blog-458.html
用 1 分鐘簡單地了解 — JavaScript中 var 與 let 的主要差別
https://realdennis.medium.com/%E9%96%92%E8%81%8A-var%E8%88%87let%E7%9A%84%E6%87%B6%E4%BA%BA%E5%8C%85-javascript-b5a3f40ee28d
[JavaScript] Javascript 的作用域 (Scope) 與範圍鏈 (Scope Chain)：往外找
https://medium.com/itsems-frontend/javascript-scope-and-scope-chain-ca17a1068c96