---
title: let、const、var的差別
tags: let, const, var, 作用域, JS實戰
description:
---

let、const、var的差別
===

<br>

### 為什麼不建議使用var

:::warning
因為var是全域變數。在使用上容易造成**作用域內或外相互使用上的污染**。
:::

在for迴圈，不管在==迴圈內的作用域==，或是==迴圈作用域以外==都能取到變數```i```的值。

for( var i = 0; i < 10; i++){
    
    console.log(i);
    
}

console.log(i);

<br>

在==判斷式作用域==內宣告的變數```name```，在作用域外一樣能取得。

var answer = ture;

if(answer) {
    
    var name = '姓名';
    
    console.log(name);

}

console.log(name);

<br>

要限制var的作用域，在外層加上==立即函式==。這樣==外層就無法取得==立即函式內的變數i的值。

(function() {
    
    for( var i = 0; i < 10; i++){
    
        console.log(i);
    
    }    
}());

console.log(i);

<br>

### let的特性

- let宣告後==可以重新賦值==，是**能被修改**的。

let name = '小明';
name = '小華';
console.log(name);    //小華

- 在同一個作用域，let==無法重複==宣告。==避免同一個作用域下重複做宣告==。

let name = '小明';
let name = '小華';

:::danger
#### let的作用域與var的作用域有什麼不同
- var的作用域是==函式作用域==。
- let的作用域是==block區塊作用域==。**block就是大括號{}**。
<br>
在第四行let name的作用域，只有在**大括號**內。
所以不同作用域取的同一個變數，有不同的值。

let name = 'john';

{
  let name = 'joe'
  console.log(name);    //joe
}

console.log(name);    //john

:::
<br>

### const的特性

- const宣告後==不可以重新賦值==，是**無法被修改**的。
- const跟let一樣是==無法重複宣告==的，**避免同一個作用域下重複做宣告**。
- 用在**不可修改**的地方，例如網址、或不可修改的值。

:::success
`string`、`boolean`、`number`、`undefined`、`null`是屬於『基本型別』

基本型別只『傳值』
:::
所以`const`用在`string`、`boolean`、`number`、`undefined`、`null` 不能重新指派值。

const name = 'cool';
name = 'cold';  //不可重新指派值
console.log(a);

<br>

:::success
`array`、`object`是屬於『物件型別』，物件型別只『傳參考』
:::
`const`用在`array`、`object` 是==可以修改index、屬性值的==，但**不能重新指派值**。

const a = {name:'big'};
const b = [1,2,3,4];

a.name = 'small';  //可修改屬性值
a = {name:'small'};  //但不可重新指派值

b[0] = 5;  //可修改item值
b = [5,2,3,4];  //但不可重新指派值

console.log(a);
console.log(b);