JavaScript var、let和const关键字的区别

在JavaScript中，用户可以使用三个关键字来声明变量，分别是var、let和const。本文将介绍var、let和const关键字之间的区别。我们将讨论每个关键字的作用域和其他必要的概念。

JavaScript var关键字： var是JavaScript中最早的声明变量的关键字。

作用域： 全局作用域或函数作用域。var关键字的作用域是全局作用域或函数作用域。这意味着在函数之外定义的变量可以在全局范围内访问，而在特定函数内定义的变量只能在函数内部访问。

示例1： 变量’a’被全局声明。因此，变量’a’的作用域是全局的，可以在程序的任何地方访问。控制台输出如下所示。

Javascript

var a = 10
function f() {
    console.log(a)
}
f();
console.log(a);

输出：

10
10

示例2: 变量‘a’在函数内部被声明。如果用户尝试在函数外部访问它，它将显示错误。用户可以使用 var 关键字声明相同名称的2个变量。同时，用户可以将值重新赋给 var 变量。输出结果在控制台中显示。

Javascript

function f() {
 
    // It can be accessible any
    // where within this function
    var a = 10;
    console.log(a)
}
f();
 
// A cannot be accessible
// outside of function
console.log(a);

输出：

10
ReferenceError: a is not defined

示例3: 用户 可以使用 var 重新声明变量，用户可以更新 var 变量。输出显示在控制台上。

JavaScript

var a = 10
 
// User can re-declare
// variable using var
var a = 8
 
// User can update var variable
a = 7

输出：

7

示例4： 如果用户在声明之前使用var变量，它将以未定义的值进行初始化。输出结果显示在控制台中。

Javascript

console.log(a);
var a = 10;

输出:

undefined

JavaScript let关键字: let关键字是var关键字的一种改进版本。

作用域:块级作用域:let变量的作用域仅限于块级作用域。它无法在特定块({block})之外访问。让我们看一个示例。

示例1: 控制台中显示输出。

Javascript

let a = 10;
function f() {
    let b = 9
    console.log(b);
    console.log(a);
}
f();

输出：

9
10

示例2： 代码返回错误，因为我们在函数块之外访问了let变量。输出显示在控制台中。

JavaScript

let a = 10;
function f() {
    if (true) {
        let b = 9
 
        // It prints 9
        console.log(b);
    }
 
    // It gives error as it
    // defined in if block
    console.log(b);
}
f()
 
// It prints 10
console.log(a)

输出：

9
ReferenceError: b is not defined

示例3： 用户无法重新声明使用 let 关键字定义的变量，但可以更新它。

JavaScript

let a = 10
 
// It is not allowed
let a = 10
 
// It is allowed
a = 10

输出：

Uncaught SyntaxError: Identifier 'a' has already been declared

示例4: 用户可以使用let关键字在不同的代码块中声明同名的变量。

Javascript

let a = 10
if (true) {
    let a = 9
    console.log(a) // It prints 9
}
console.log(a) // It prints 10

输出：

9 
10

示例5： 如果用户在声明之前使用 let 变量，它不会像 var 变量一样初始化为 undefined 并返回错误。

JavaScript

console.log(a);
let a = 10;

将下面的英文翻译成中文，不解释，保留HTML格式：

输出：

Uncaught ReferenceError: Cannot access 'a' before initialization

const JavaScript中的关键字: const 关键字拥有和 let 关键字相同的特性，用户无法更新它。

作用域: 块级作用域: 当用户声明一个 const 变量时，他们需要初始化它，否则会报错。一旦声明，用户无法更新 const 变量。

示例1: 我们尝试改变 const 变量的值，以便返回错误。输出结果会在控制台显示。

JavaScript

const a = 10;
function f() {
    a = 9
    console.log(a)
}
f();

输出：

TypeError:Assignment to constant variable.

示例2： 用户不能修改const对象的属性，但是可以修改const对象的属性值。

JavaScript

const a = {
    prop1: 10,
    prop2: 9
}
 
// It is allowed
a.prop1 = 3
 
// It is not allowed
a = {
    b: 10,
    prop2: 9
}

输出结果：

Uncaught SyntaxError:Unexpected identifier

var ，let 和const 之间的区别：

注意： 有时候，当用户在特定的代码块中改变变量 var 的值时，会遇到问题。因此，用户应该在JavaScript中使用 let 和 const 关键字来声明变量。