news 2026/6/22 20:31:50

JavaScript 变量

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
JavaScript 变量

一、变量的核心概念

变量就像一个带标签的盒子,你可以把数据(数字、文字、对象等)存进去,之后通过标签(变量名)来访问或修改里面的数据。JavaScript 中声明变量有 3 种方式,对应不同的特性。

二、变量的声明方式

1. 三种声明关键字(ES6+)
关键字作用域变量提升重复声明能否修改核心特点
var函数作用域 / 全局有(提升到作用域顶部,值为 undefined)允许ES5 及之前的声明方式,易出问题
let块级作用域({}内)有 “暂时性死区”(不可提前访问)不允许ES6 推荐,替代 var
const块级作用域有 “暂时性死区”不允许不能(常量)声明时必须赋值,值不可改(引用类型仅地址不可改)
2. 代码示例:三种声明方式对比

javascript

运行

// 1. var声明(函数/全局作用域,可重复声明) var a = 10; var a = 20; // 允许重复声明 console.log(a); // 输出 20 // 2. let声明(块级作用域,不可重复声明) let b = 10; // let b = 20; // 报错:Identifier 'b' has already been declared if (true) { let b = 30; // 块内独立变量,不影响外部 console.log(b); // 输出 30 } console.log(b); // 输出 10 // 3. const声明(常量,不可修改) const c = 100; // c = 200; // 报错:Assignment to constant variable. const obj = { name: "Adobe" }; obj.name = "JavaScript"; // 允许修改引用类型的属性(地址未变) console.log(obj.name); // 输出 JavaScript

三、变量的命名规则(必须遵守)

  1. 开头字符:只能以字母(a-z/A-Z)、下划线(_)、美元符号($)开头,不能以数字开头。
  2. 字符组成:后续字符可以是字母、数字、下划线、美元符号。
  3. 大小写敏感nameName是两个不同的变量。
  4. 禁用关键字:不能使用 JavaScript 保留字(如letconstiffunction等)。
  5. 规范建议
    • 普通变量:小驼峰命名(如userNametotalPrice);
    • 常量:全大写 + 下划线(如MAX_NUMPI)。
错误 / 正确命名示例:

javascript

运行

// 错误命名 var 123num = 1; // 数字开头 var let = 2; // 使用关键字 var user-name = 3; // 含非法字符(-) // 正确命名 var num123 = 1; var _userAge = 20; var $price = 99; const MAX_COUNT = 100;

四、变量提升与暂时性死区

1. 变量提升(仅var

var声明的变量会被 “提升” 到作用域顶部,但赋值不会提升:

javascript

运行

console.log(x); // 输出 undefined(变量提升,未赋值) var x = 10; console.log(x); // 输出 10
2. 暂时性死区(let/const

let/const声明的变量,在声明语句之前访问会报错,这就是 “暂时性死区”,避免了提前使用未定义的变量:

javascript

运行

// console.log(y); // 报错:Cannot access 'y' before initialization let y = 20; console.log(y); // 输出 20

五、变量的作用域

  1. 全局作用域:在函数 / 块外部声明的变量,整个脚本都能访问(var/let/const声明的全局变量,前者挂载到window,后两者不挂载)。
  2. 函数作用域var声明的变量仅在函数内可访问。
  3. 块级作用域let/const声明的变量仅在{}内(如if/for/while块)可访问。

javascript

运行

// 全局作用域 var globalVar = "全局var"; let globalLet = "全局let"; function test() { // 函数作用域 var funcVar = "函数内var"; let funcLet = "函数内let"; console.log(globalVar); // 可访问全局变量 if (true) { // 块级作用域 let blockLet = "块内let"; console.log(funcVar); // 可访问函数内变量 } // console.log(blockLet); // 报错:blockLet is not defined(块外不可访问) } test(); console.log(funcVar); // 报错:funcVar is not defined(函数外不可访问)

总结

  1. 声明方式:优先使用let(可变变量)和const(常量),避免var(作用域不清晰、可重复声明)。
  2. 命名规则:字母 / 下划线 /$ 开头,大小写敏感,禁用关键字,遵循小驼峰 / 全大写规范。
  3. 核心特性let/const有块级作用域和暂时性死区,const声明时必须赋值且不可修改值(引用类型仅地址不可改)。
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/6/23 17:19:35

基于Web的智能家教服务平台设计与实现-计算机毕业设计源码+LW文档

摘 要 在智能家教服务平台的运营实践中,智能化的管理方式相较于传统的手工管理手段,其优势显得尤为突出。它不仅大幅度削减了运营所需的人力资源成本,还有力地推动了网站管理向标准化、制度化和程序化的方向迈进,从而有效杜绝了管…

作者头像 李华
网站建设 2026/6/23 19:15:18

Open-AutoGLM异地设备协同管理实战(20年专家私藏方案曝光)

第一章:Open-AutoGLM异地设备管理核心理念Open-AutoGLM 是一种面向分布式环境的智能设备管理框架,专为跨地域、多终端的自动化运维场景设计。其核心理念在于通过统一的语义理解与指令生成机制,实现自然语言到设备操作的无缝映射,降…

作者头像 李华
网站建设 2026/6/23 19:07:41

在Bug爆发前“排雷”:预防性测试

在快速迭代的软件开发世界中,Bug的爆发往往像一场突如其来的风暴,轻则导致用户抱怨,重则引发系统崩溃和业务损失。传统的测试方法侧重于在代码完成后进行检测和修复,但这常被视为“事后救火”,成本高且效率低。相比之下…

作者头像 李华
网站建设 2026/6/23 19:13:19

你真的懂Open-AutoGLM回滚吗?:从原理到实操的4层防护体系构建

第一章:你真的懂Open-AutoGLM回滚吗?在持续集成与模型部署实践中,Open-AutoGLM 的版本控制机制常被忽视,而回滚操作正是保障系统稳定性的关键防线。当新版本模型引发推理异常或服务延迟时,能否快速、准确地执行回滚&am…

作者头像 李华
网站建设 2026/6/23 19:10:07

毕业设计 yolo深度学习动物识别

文章目录 0 前言1 深度学习实现动物识别与检测2 卷积神经网络2.1卷积层2.2 池化层2.3 激活函数2.4 全连接层2.5 使用tensorflow中keras模块实现卷积神经网络 3 YOLOV53.1 网络架构图3.2 输入端3.3 基准网络3.4 Neck网络3.5 Head输出层 4 数据集准备4.1 数据标注简介4.2 数据保存…

作者头像 李华
网站建设 2026/6/23 9:17:47

31、SharePoint Web Parts 开发全解析

SharePoint Web Parts 开发全解析 1. Silverlight Web Parts 简介 Silverlight Web Parts 能为用户提供更丰富的界面体验。幸运的是,我们无需编写大量自定义代码来创建此类 Web Part,因为微软发布了项目扩展,其中包含 Web Part 模板。该扩展及相关文档可从 MSDN Code Gal…

作者头像 李华