1. 程式人生 > 其它 >var let const的區別

var let const的區別

var

1、var 定義的變數會進行預解析,在js程式碼執行之前,瀏覽器會預設把所有帶var 的宣告的變數進行提前宣告或定義

console.log(num);//undefined
 var num = 10;

2.var定義的變數可以反覆去定義,當宣告的變數名相同時,後面用var 宣告的變數會覆蓋前面的

   var num1 = 1;
   var num1 = 2
   var num1 = 3;
   console.log(num1) //3

3.var 在迴圈體中使用時,迴圈體外面也可以訪問到

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

4.在迴圈繫結事件的過程中,var定義的變數無法被儲存,迴圈會直接執行完

//建立10個li標籤
//給li標籤註冊點選事件
 var lis = document.getElementsByTagName('li');
        for (var i = 0; i < lis.length; i++) {
            lis[i].onclick = function() {
                console.log(i)
            }
        }
//無論點選哪一個li標籤,輸出的結果都是10,因為var 無法儲存被定義的變數,迴圈結束之後,i是10.

let與const

在es6之前js只有全域性作用域和區域性作用域,es6中新增了塊級作用域,let和const都支援塊級作用域的使用.

let

1.let只有在宣告之後才能進行呼叫。通過 let 宣告的變數直到它們的定義被執行時才初始化。如果在初始化之前進行呼叫,會報錯。

console.log(num)//Uncaught ReferenceError: Cannot access 'num' before initialization
 let num = 10;

2.在迴圈中用let定義的變數,在迴圈外無法訪問

 for (let i = 0; i < 10; i++) {
            console.
log(i) } console.log(i)//Uncaught ReferenceError: i is not defined

3.用let進行宣告的變數不能重複宣告

let num1 = 10;
let num1 = 10;//Uncaught SyntaxError: Identifier 'num1' has already been declared

4.在迴圈繫結事件的過程中,let宣告的變數可以被儲存

var lis = document.getElementsByTagName('li');
        for (let i = 0; i < lis.length; i++) {
            lis[i].onclick = function() {
                console.log(i)
            }
        }
        //當依次點選10個li標籤時,會依次輸出0,1,2,3,4,5,6,7,8,9 不會像var變數宣告的i那樣,無法進行儲存。

const

1.const宣告的變數必須進行初始化,也就是要對其進行賦值,而let定義的變數不用初始化

let num1 = 10;
let num2;//let可以宣告不賦值
const num3;//Uncaught SyntaxError: Missing initializer in const declaration
const num4 = 10;//let必須給定義的變數進行賦值

2.用const定義的物件的屬性可以修改。但是不能改變物件的地址

  const obj = {
            name: 'mike',
            age: 20,
            sex: 'man'
        }
 const obj2 = {};
        console.log(obj);//{name: "mike", age: 20, sex: "man"}
        obj.name = 'andy';
        obj.age = 30;
        obj.sex = 'women';
        console.log(obj);//{name: "andy", age: 30, sex: "women"}
        //改變物件的地址,會報錯
        obj = obj2;//Uncaught TypeError: Assignment to constant variable.