JavaScript变量

JavaScript变量知识点大全 – 编程小白专用

JavaScript变量知识点大全

编程小白也能轻松理解的JavaScript变量指南

变量是JavaScript中最基础也是最重要的概念之一。可以把变量想象成一个”盒子”,用来存放程序运行过程中需要的数据。本指南将用最通俗易懂的方式讲解JavaScript变量的所有重要知识点。

什么是变量?

变量就是存储数据的容器。你可以把它想象成一个贴有名字标签的盒子,里面可以存放不同类型的数据,比如数字、文字、列表等。

为什么需要变量?

  • 存储程序中需要使用的数据
  • 保存计算结果
  • 让代码更容易理解和维护
  • 减少重复计算
// 变量就像贴标签的盒子
let age = 25; // 盒子名字叫age,里面放数字25
let name = “小明”; // 盒子名字叫name,里面放文字”小明”
let isStudent = true; // 盒子名字叫isStudent,里面放布尔值true

变量命名规则

给变量起名字需要遵循一定的规则,就像给孩子起名字也要符合法律规定一样。

必须遵守的规则:

  • 名字可以包含字母、数字、下划线(_)和美元符号($)
  • 名字必须以字母、下划线(_)或美元符号($)开头
  • 区分大小写(age和Age是不同的变量)
  • 不能使用JavaScript的保留字(如let、if、for等)

推荐的命名规范:

  • 使用有意义的英文单词(如userAge而不是a)
  • 对于多个单词,使用驼峰命名法(如userName)
  • 常量通常全部大写(如MAX_SIZE)
  • 布尔变量通常以is或has开头(如isLoggedIn)

💡 好名字的标准:看一眼就知道这个变量是干什么的!

声明变量的三种方式

在JavaScript中,创建变量(术语叫”声明变量”)有三种不同的方式:

🚩 1. var – 老派方式(ES5及之前)

最古老的声明方式,现在不推荐使用,但你需要了解它。

var age = 25; // 声明一个变量age

✅ 2. let – 现代方式(ES6引入)

推荐使用的变量声明方式,作用域更可控。

let name = “小明”; // 声明一个变量name

🔒 3. const – 常量声明(ES6引入)

用于声明值不会改变的常量,一旦赋值就不能再修改。

const PI = 3.14159; // 声明一个常量PI

⚠️ 注意:使用const声明的变量必须立即赋值,且之后不能改变它的值!

变量作用域

作用域就是变量的”活动范围”,决定了在哪些地方可以访问这个变量。

全局作用域

在函数外面声明的变量,整个程序都可以访问它。

let globalVar = “我是全局变量”; // 全局作用域

function show() {
  console.log(globalVar); // 可以访问
}

函数作用域(var的特点)

使用var声明的变量,作用域在它所在的函数内部。

function myFunction() {
  var functionVar = “我在函数内部”; // 函数作用域
}
console.log(functionVar); // 错误!外面访问不到

块级作用域(let/const的特点)

使用let或const声明的变量,作用域在它所在的代码块({})内部。

if (true) {
  let blockVar = “我在代码块内部”; // 块级作用域
}
console.log(blockVar); // 错误!外面访问不到

变量提升(Hoisting)

JavaScript引擎执行代码前,会把变量声明”提升”到当前作用域的顶部。

var的变量提升

使用var声明的变量会被提升,但赋值不会被提升。

console.log(hoisted); // 输出:undefined
var hoisted = “我被提升了”;
// 实际执行顺序:
// var hoisted; // 声明提升到顶部
// console.log(hoisted); // 此时hoisted是undefined
// hoisted = “我被提升了”; // 赋值保持原位

let/const的变量提升

现代方式也有提升,但在赋值前访问会报错(暂时性死区)。

console.log(modern); // 报错:不能在初始化前访问
let modern = “现代方式”;

💡 最佳实践:在使用变量之前声明它!避免依赖变量提升的特性。

变量的数据类型

JavaScript中的变量可以保存不同类型的数据,主要有两大类:原始类型和引用类型。

原始类型(基本类型)

  • Number:数字(如 25, 3.14)
  • String:字符串文本(如 “Hello”)
  • Boolean:布尔值(true或false)
  • undefined:未定义的值
  • null:空值
  • Symbol:唯一值(ES6新增)
  • BigInt:大整数(ES2020新增)

引用类型

  • Object:对象({name: “小明”})
  • Array:数组([1, 2, 3])
  • Function:函数(function() {})
  • Date:日期
  • 等等…
// 基本类型示例
let age = 30; // Number
let name = “张三”; // String
let isAdmin = true; // Boolean

// 引用类型示例
let user = { name: “李四”, age: 25 }; // Object
let colors = [“红”, “绿”, “蓝”]; // Array

最佳实践与总结

变量使用黄金法则

  • ✅ 优先使用const,其次使用let
  • ❌ 避免使用var(除非有特殊原因)
  • 👍 给变量起有意义的名字
  • 📍 在作用域顶部声明变量
  • 🔑 初始化变量时赋值

如何选择 let vs const

const:当变量的值在程序中不会改变时使用(如配置值、数学常数)

let:当变量的值需要在程序中改变时使用(如计数器、用户输入)

// 好的写法
const PI = 3.14159; // 不会改变的值
let count = 0; // 会改变的值

// 不好的写法
var oldWay = “不要这样写”;
let a = 10; // 名字没有意义

💡 记住:变量是程序的基石,理解变量是成为编程高手的第一步!

JavaScript变量知识点总结 | 专为编程小白设计 | 实际项目中推荐使用const和let

希望这份指南能帮助您更好地理解JavaScript变量!

发表评论

您的邮箱地址不会被公开。 必填项已用 * 标注

滚动至顶部