JavaScript 变量声明详解const 、let、 var

        前端必不可少的学习就是JavaScript，到后面出现的ES6，都是其中的关键。那么，js学习最基础的是什么呢？当然是js的语法规则等内容啦，而其中的变量命名则是开端。js命名有三个：var、let、const。现在就让我们来看看，这三个命名方式有些什么奥秘？

一、var

        使用 var 定义变量，可以保存任何类型的值。若不初始化变量，变量会保存 undefined。
        1. 函数级作用域
        使用 var 定义的变量会成为包含它的函数的局部变量。变量 a 在函数内部使用 var 定义，调用函数 func，会创建这个变量并给它赋值。函数执行结束后，变量就会被销毁，所以上述代码最后一行会报错，显示变量 a 未定义。

function func() {
    var a = 'hi' // 局部变量
}
func()
console.log(a)

        若在函数内部，不使用 var 操作符，直接给变量 a 赋值，那么 a 就成为了全局变量，可以在函数外部访问到。在浏览器环境下，a 成为window对象的属性。
        2. 变量提升
        使用var声明变量，会自动提升到函数作用域顶部；如下这样会输出undefined：

function func() {
    var a
    console.log(a)
    a = 1
}
func()

        3. 重复声明
        使用 var 重复声明同一个变量，后者会覆盖前者。

function func() {
    var a = 1
    var a = 2
    console.log(a)
}
func()

        4. 全局变量挂载到 window
        浏览器环境中，全局作用域下，使用 var 声明的变量，会挂载到 window 对象上。

var a = 1
console.log(window.a === a) // true

二、let

        let也可以声明变量，只不过是块级作用域变量，和var操作符有很大的区别。
        1. 块级作用域
        let声明的作用域，具有块级作用域，即被{}包裹的部分，超出此包裹便失效。

if (true) {
    let a = 10
}
console.log(a) // undefined

        2. 不可重复声明
        变量在当前作用域内不可重复声明，否则会报错（Uncaught SyntaxError: Identifier 'a' has already been declared）。

if (true) {
    let a = 1
    let a = 2
}
// 混合声明同一变量也会报错
let a
var a // 报错

        3. 不存在变量提升（暂时性锁区）
        使用let声明的变量，不能在声明之前访问它。JavaScript 也会注意出现在块后面的 let 声明，只不过在此之前不能以任何方式来引用未声明的变量。在let声明之前的执行瞬间被称为暂时性死区。

if (true) {
    console.log(a)
    let a = 1
}

        4. 全局变量不会挂载到 window
        和 var 不同，即使在全局作用域下，使用let声明的变量也不会挂载到window对象。

var a = 1
let b = 2
console.log(window.a === a) // true
console.log(window.b === b) // false

        5. 不同的作用域互不影响
        变量处在不同的{}时，也就是处于不同的作用域，它们的使用互相不受影响。

function func() {
  let a = 'hello'
  if (true) {
    let a = 'world'
    console.log(a)
  }
  console.log(a)
}
func()

        6. 变量的类型
        js中的变量是松散类型的，可以保存任何类型数据，变量只不过是一个名称。

let a = 1
a = "hello"
a = [1, 2, 3]
a = {age: 32}

三、const
        const 变量只能在声明的时候赋值，后面不能再被赋值。
        1. 声明变量时必须同时初始化
        声明的同时没有初始化变量，会导致报错

const a // 报错

        2. const 修饰的变量具有内部可变性
        使用 const 定义了一个变量后，不能再更改它的值，这里的值针对的是基本类型的值；还有引用类型的指针，而不包括引用类型的值，可以通过其属性进行数据修改。
说明：基本数据类型的值就保存在内存地址中，所以 const 定义的基础数据类型不可被改变。 而引用数据类型指向的内存地址只是一个指针，通过指针来指向实际数据，也就是说，不可被改变的是指针，而不是数据，所以const定义的引用数据类型的常量可以通过属性来修改其数据。

四、总结及建议

    建议：    1）先声明，后使用

        2）建议优先使用：const > let > var

参考文章：

JavaScript 变量声明var、let、const详解 - 掘金

人生海海，码途徐徐，在每一段经历中，留下成长的印记，爱自己爱生活爱思考！