JavaScript中的变量声明：var、let与const的区别与实践规范-优快云博客

本文链接：https://blog.youkuaiyun.com/likeflower950/article/details/145495349

在JavaScript中，我们经常需要声明变量来存储数据。在ES6之前，我们主要使用var关键字来声明变量。但随着ES6的引入，let和const也成为了声明变量的重要方式。本文将详细讲解var、let和const之间的区别，并提供一些实践规范。

一、var、let与const的区别

1. 作用域

var声明的变量具有函数作用域或全局作用域，而let和const声明的变量具有块级作用域。
这意味着在一个代码块（使用大括号{}包围的代码区域）内，使用let或const声明的变量只在该代码块内有效。

2. 变量提升

使用var声明的变量会发生“变量提升”（hoisting），即变量可以在声明之前使用，但此时变量的值为undefined。
而let和const声明的变量不会发生变量提升，如果在声明之前使用这些变量，会报错。

3. 重复声明

使用var可以重复声明同一个变量，而let和const则不允许重复声明。

4. 常量特性

const声明的是一个常量，一旦声明并赋值后，就不能再次修改其值（注意，如果const声明的是一个对象或数组，那么对象的属性和数组的元素是可以修改的，只是不能改变对象或数组本身的引用）。

二、代码示例

// var的作用域和变量提升
function varExample() {
    console.log(a); // undefined，因为变量提升
    var a = 10;
    if (true) {
        var a = 20; // 这里的a和上面的a是同一个变量
        console.log(a); // 20
    }
    console.log(a); // 20
}

// let的作用域
function letExample() {
    // console.log(b); // 报错，因为let不会变量提升
    let b = 10;
    if (true) {
        let b = 20; // 这里的b是块级作用域的变量，与上面的b不同
        console.log(b); // 20
    }
    console.log(b); // 10
}

// const的常量特性
function constExample() {
    const c = 10;
    // c = 20; // 报错，因为const声明的是常量
    const obj = { key: 'value' };
    obj.key = 'new value'; // 这是允许的，因为改变的是对象的属性
    // obj = {}; // 报错，因为不能改变const声明的对象的引用
}