[JavaScript] var、let、const 異同總整理

🔍小範例大學問👊

1. 有無初始值:

var a;
//undefined
let b;
//undefined;
const c;
//Uncaught SyntaxError: Missing initializer in const declaration.
//說明:缺少初始值設定。

2. 重複宣告同一變數:

var a = 1;
var a = 2;
//2
let b = 1;
let b = 2;
//Uncaught SyntaxError: Identifier 'b' has already been declared.
//說明:變數b已被宣告。
const c = 1;
const c = 2;
//Uncaught SyntaxError: Identifier 'c' has already been declared.
//說明:變數c已被宣告。

3. 重新賦予新值:

var a = 1;
a = 2;
//2
let b = 1
b = 2;
//2
const c = 1;
c = 2;
//Uncaught TypeError: Assignment to constant variable.
//被宣告後,則其所分配的值無法再被更改。

4. Hoisting ( 提升 ):

💬說明:在執行任何程式碼前,JavaScript 會把{“var"和"函式"宣告}先放進記憶體裡面,這樣做的優點是:可以在程式碼宣告之前使用它。

console.log(a);
var a = 1;
//undefined
//說明:變數a已被放入記憶體,但值不會被放入。程式碼可改寫為如下
var a
console.log(a);
a = 1;
console.log(b);
let b = 1;
//Uncaught ReferenceError: Cannot access 'b' before initialization.
console.log(c);
const c = 1;
//Uncaught ReferenceError: Cannot access 'c' before initialization.

💡 全域變數 (global variable)和區域變數 (local variable):

let a  = 1;

 function ya(){
     let b = 2;
     console.log(b);
 }

console.log(a);
ya();
//1
//2
//a為全域變數、b為區域變數

5. 區域變數的可見度(function):

function ya(){
    var a  = 1;
 }
 console.log(a);
//Uncaught ReferenceError: a is not defined.
//變數未被宣告

💬說明:不管是var、let還是const,在函式(function)內所宣告的變數就只能在函式內,無法及於全域。

6. 迴圈內變數的可見度(if、loop):

if (true){
    var a = 1;
}
console.log(a);
//1
if (true){
    let b = 1;
}
console.log(b);
//Uncaught ReferenceError: a is not defined.
//變數未被宣告
if (true){
    const c = 1;
}
console.log(c);
//Uncaught ReferenceError: a is not defined.
//變數未被宣告

💬說明:只有var會讓迴圈內的變數影響全域。

📌總整理

varletconst
初始值✔️✔️
重複宣告✔️
賦予新值✔️✔️
程式碼執行前已先拉至記憶體✔️
函式內宣告變數影響全域
迴圈內宣告變數影響全域✔️

參考文章

發表迴響

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com 標誌

您的留言將使用 WordPress.com 帳號。 登出 /  變更 )

Twitter picture

您的留言將使用 Twitter 帳號。 登出 /  變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 登出 /  變更 )

連結到 %s

%d 位部落客按了讚: