目录

一、var、let、const的相同点

二、var、let、const的不同

    区别一：var 存在变量提升 而 let 与 const 不存在变量提升

    区别二：var定义的变量可以声明多次，而let、const定义的变量只能声明

    区别三：var、let声明的变量可以再次赋值，而const声明的变量不能再次赋值

   区别四：var声明的变量没有自身的作用域，而ler、const声明的变量有自身的作用域

---

一、var、let、const的相同点

var、let、const三者都可以声明变量

var a = 10;
let b = 20;
const c = 30;
console.log(a, b, c);

---

二、var、let、const的不同

    区别一：var 存在变量提升 而 let 与 const 不存在变量提升

console.log(str);
var str = 'hello';

// 相当于
var str;
console.log(str);
str = 'hello';

 可以看出，str是在log后定义的，但var存在变量提升，即当log打印str时，会去找有没有定义str，若有，则将定义提前，但赋值的顺序仍在log后面，故log打印的结果是undefined

console.log(str);
let str = 'hello';
console.log(str1);
let str1 = 'hi~~';

根据上面的结果，也理解到了变量提升的机制，这是var才有的机制，let、const不存在变量提升。在log打印前并没有对str、str1进行定义，故会报错 

    区别二：var定义的变量可以声明多次，而let、const定义的变量只能声明

var a = 1;
var a = 2;
console.log(a);

 

 根据结果可以看出，var定义多次变量时，后面所定义的内容会覆盖前面的，但不会报错

let a = 1;
let a = 2;
console.log(a);

const b = 1;
const b = 2;
console.log(b);

 根据结果可以看出，let、const所定义的变量出现多次声明后会报错。也可以从报错信息看出，a、b已被定义

    区别三：var、let声明的变量可以再次赋值，而const声明的变量不能再次赋值

var a = 1;
a = 2;
console.log(a);

let b = 1;
b = 2;
console.log(b);

打印结果的结果都是2，说明var、let声明的变量可以再次赋值 

const c = 1;
c = 2;
console.log(c);

 报错的内容是 对常数变量进行赋值，说明const定义的是常量，常量是不能修改的。但是要注意，只是const声明的常量，但常量里面所包含的内容还是可以改的

const obj = {
    c: 4
}
obj.c = 1234;
console.log(obj);

obj = 1234;
console.log(obj);

 

const arr = [1, 2, 3];
arr[0] = 'hello';
console.log(arr);

 根据这两个案例，再次说明了只是const声明的常量，但常量里面所包含的内容还是可以改的

   区别四：var声明的变量没有自身的作用域，而ler、const声明的变量有自身的作用域

在JS中是没有块级作用域的，例如在函数内var声明的变量，在函数外也可以调用，但let、const声明的变量有自身的作用域，在函数内定义的变量只能在函数内使用

if (true) {
    var num1 = 1;
}
console.log(num1);

if (true) {
    let num2 = 2;
}
console.log(num2);

if (true) {
     const num3 = 3;
}
console.log(num3);