JS：定義變量的var、let有何操作？一、var二、let三、總結

發布時間：2023-07-03 13:03:05 作者：網友整理

最近話不多，直接看代碼和結果好伐？

一、var

定義：

//一般情況
var word = "Hello World";
console.log(word);
//輸出：Hello World

//變量提升？
console.log(word);
var word = "Hello World";
//輸出：undefined

//變量提升！
word = "哈哈哈";
console.log(word);
var word = "Hello World";
//輸出：哈哈哈

//所謂的全局變量，已經在window對象上了
var word = "Hello World";
console.log(window.word);
//輸出：Hello World

//不寫var
word = "Hello World";
console.log(word);
console.log(window.word);
//輸出：
//Hello World
//Hello World

函數：

//一般情況
var word = "Hello World";
function PLAYFULHD() {
  console.log(word);
}
PLAYFULHD();
//輸出：Hello World

//變量提升？
PLAYFULHD();
var word = "Hello World";
function PLAYFULHD() {
  console.log(word);
}
//輸出：undefined

//變量提升？
PLAYFULHD();
function PLAYFULHD() {
  console.log(word);
}
var word = "Hello World";
//輸出：undefined

//變量提升！
word = "嘿嘿嘿";
PLAYFULHD();
function PLAYFULHD() {
  console.log(word);
}
var word = "Hello World";
//輸出：嘿嘿嘿

//不寫var
word = "Hello World";
function PLAYFULHD() {
    var word = "嘿嘿嘿";
    console.log(word);
}
PLAYFULHD();
console.log(word);
//輸出：
//嘿嘿嘿
//Hello World

重復定義：

//重復定義1
var word = "Hello World";
console.log(word);
var word = "哦吼吼";
console.log(word);
//輸出：
//Hello World
//哦吼吼

//重復定義2
var word = "Hello World";
console.log(word);
function PLAYFULHD() {
    var word = "哦吼吼";
    //let word = "哦吼吼"; //效果一樣
    console.log(word);
}
PLAYFULHD();
console.log(word);
//輸出：
//Hello World
//哦吼吼
//Hello World

總結：

全局變量：指變量在函數外定義，網頁中所有腳本和函數均可使用；當頁面關閉后銷毀
局部變量：指變量在函數內定義，重復定義了相同的變量并不改變全局變量的值；當函數執行結束后銷毀；
變量提升？只要存在賦值的操作，就能直接使用，其實可以理解為默許了沒有var就可以定義變量；
一般在定義全局變量時，放在script標簽下的最前面，且局部變量的命名不和全局變量重復；
對于數組和對象，和原始類型的情況不一樣，下面是執行代碼：（數組和對象的情況類似）

//正常情況
arr = ["HHHH"];
console.log(arr);
var arr = ["哈哈哈", "嘿嘿嘿", "哦吼吼"];
//輸出：["HHHH"]

//直接報錯
arr[0] = "HHHH";
console.log(arr);
var arr = ["哈哈哈", "嘿嘿嘿", "哦吼吼"];
//輸出：Uncaught TypeError: Cannot set property '0' of undefined

二、let

必須先定義，再使用；其它情況同var

//直接報錯
word = "哈哈哈";
console.log(word);
let word = "Hello World";
//輸出：Uncaught ReferenceError: Cannot access 'word' before initialization

//不綁定到window
let word = "Hello World";
console.log(word);
console.log(window.word);
//Hello World
//undefined