当前位置：首页 > news >正文

一分钟学会JavaScript 变量

news 来源：原创 2025/5/16 3:13:45

引言

JavaScript 作为前端开发的核心语言之一，对于初学者来说，掌握变量和数据类型是迈向编程之路的重要一步。在这篇博客中，我们将以简单易懂的方式介绍 JavaScript 中的变量声明。

在 JavaScript 中，我们使用不同的关键字来声明变量，常见的有 var、let 和 const，它们各自有不同的特点和使用场景。

1. `var`

var 是 ES5 中声明变量的方式，它存在变量提升的特性。变量提升意味着你可以在变量声明之前访问它，不过此时变量的值为 undefined。

// 变量提升示例
console.log(name); // 输出: undefined
var name = 'John';
console.log(name); // 输出: John

在上面的代码中，虽然 name 变量在 console.log 之后才声明，但由于变量提升，第一次 console.log 不会报错，而是输出 undefined。

var 还有一个特点是它的作用域是函数作用域。也就是说，在函数内部声明的 var 变量，只能在该函数内部访问。

function example() {
    if (true) {
        var age = 20;
    }
    console.log(age); // 输出: 20
}
example();

这里的 age 变量虽然是在 if 语句块中声明的，但由于 var 的函数作用域特性，在 if 语句块外部仍然可以访问。

2. `let`

let 是 ES6 引入的声明变量的方式，它解决了 var 存在的一些问题。let 没有变量提升，并且它的作用域是块级作用域，即 {} 内的代码块。

// 没有变量提升
// console.log(city); // 报错: ReferenceError: city is not defined
let city = 'New York';
console.log(city); // 输出: New York

// 块级作用域示例
{
    let country = 'USA';
    console.log(country); // 输出: USA
}
// console.log(country); // 报错: ReferenceError: country is not defined

let 允许变量重新赋值。

let number = 10;
number = 20;
console.log(number); // 输出: 20

3. `const`

const 同样是 ES6 引入的，用于声明常量。一旦使用 const 声明并赋值，该常量的值就不能再修改。

const PI = 3.14;
// PI = 3.1415; // 报错: TypeError: Assignment to constant variable.
console.log(PI); // 输出: 3.14

需要注意的是，const 声明的常量必须在声明时就赋值，否则会报错。而且，对于引用类型（如对象和数组），虽然常量本身不能重新赋值，但可以修改其内部的属性或元素。

const person = { name: 'Alice', age: 25 };
person.age = 26;
console.log(person.age); // 输出: 26

const numbers = [1, 2, 3];
numbers.push(4);
console.log(numbers); // 输出: [1, 2, 3, 4]