JavaScript开发中变量、常量声明的规矩总结

本文以《JavaScript高级程序设计》第4版作为参考,整理使用JavaScript开发过程中,变量、声明的那些规则或者规矩。

JavaScript是一门用于和网页进行交互的脚本语言,包括以下三个组成部分:

  • ECMAScript:由ECMA-262定义并提供核心功能
  • 文档对象模型(DOM):提供与网页内容交互的方法和接口
  • 浏览器对象模型(BOM):提供与浏览器交互的方法和接口

首先标识符

标识符就是变量、函数、属性或函数参数的名称。标识符由一个或多个下列字符组成。

  • 第一个字符必须是字母、下划线(_)或者美元符号($)
  • 剩下的字符可以是字母、下划线、美元符号或数字
  • 标识符不可以有空格
  • 标识符不能是JavaScript的保留字或关键字,如ifforfunction
  • 标识符可以是任意长度,但最好保持简洁和有意义
  • 标识符是大小写敏感的,例如myVariable和myvariable是不同的标识符

标识符还可以用Unicode字母字符,比如"Ω",Unicode编码是U+03A9,但不推荐使用。可以说除了A-Z、a-z其他字母字符都不推荐使用。

按照惯例,标识符采用小驼峰法书写,即第一个单词字母小写,后面每个单词首字母大写

然后是变量

ECMAScript是弱类型语言,即变量可以保存任意数据类型。有三个声明变量的关键词:varletconst。其中var可以在任何ECMAScript版本中使用,而letconst只能在ECMAScript 6及以后的版本中使用。

实际得益于babel的存在,绝大多数项目都可以直接使用letconst声明变量。

var和let区别

作用域

var是函数作用域,let是块级作用域。函数作用域意味着变量在声明它们的函数内部可见,而块级作用域意味着变量在声明它们的块(如 {})内部可见

变量提升

使用var声明的变量会发生变量提升,即在其作用域内的任何位置都可以访问变量,即使在变量声明之前也可以,当然此时变量值为undefined。而使用let声明的变量不会发生变量提升,只有在变量声明之后才能访问变量。

js 复制代码
  function test1(){
      console.log(age) // undefined
      var age = '28'
  }
  test1()

  function test2(){
     console.log(age) // 报错
     let age = '28'
  }
  test2()

全局声明

在全局作用域中使用var声明的变量会成为window的属性,而使用let声明的不会。

js 复制代码
 var title1 = 'var'
 let title2 = 'let'
 console.log(window.title1)   // var
 console.log(window.title2)  // undefined

for循环中的声明

使用var声明变量参与循环,会导致变量溢出到循环体外。相反使用let则不会,因为其具备块级作用域。

js 复制代码
 for(var i=0;i<5;i++){
       // 循环逻辑
 }
 console.log(i) // 5

 for(let j=0;j<5;j++){
      // 循环逻辑
 }
 console.log(j) // j没有定义

关于这点最为经典的就是for循环里面有setTimeout参与,这个经常是面试被问到的问题,问为什么会如此?

js 复制代码
 for(var i=0;i<5;i++){
    setTimeout(()=>console.log(i))
 }
// 输出 5,5,5,5,5

for(let j=0;j<5;j++){
    setTimeout(()=>console.log(j))
}
// 输出 1,2,3,4,5

var声明之所以会这样是因为循环结束时,变量保存的是循环退出的值:5,没有生成新的迭代变量。相反let声明就会有新的迭代变量生成,所以输出不一样。

const声明

constlet声明的唯一区别是const声明变量时必须初始化,且修改const声明的变量会报错(对象除外)。

常量声明

常量是一种值在声明后不能被重新赋值的变量。综上,使用const关键字来声明常量。按照惯例常量名要全部大写。

最佳实践

私以为开发一定要要求确定性的。而为了保证这点要尽可能用确定性强的开发方式方法。

通过上面的对比可以看出var有很多不确定性,相反letconst有比较强的确定性,有更加明确的声明位置和作用域。所以推荐项目中使用letconst声明变量或常量,这也有助于提升代码质量。

总结一下:

  1. 标识符除了A-Z、a-z其他字母字符都不推荐使用
  2. 标识符采用小驼峰法书写,即第一个单词字母小写,后面每个单词首字母大写
  3. 绝大多数项目都可以直接使用letconst声明变量
  4. 使用const关键字来声明常量
  5. 按照惯例常量名要全部大写
  6. 项目中使用letconst声明变量或常量

本文完。

相关推荐
崔庆才丨静觅8 小时前
hCaptcha 验证码图像识别 API 对接教程
前端
passerby60618 小时前
完成前端时间处理的另一块版图
前端·github·web components
掘了9 小时前
「2025 年终总结」在所有失去的人中,我最怀念我自己
前端·后端·年终总结
崔庆才丨静觅9 小时前
实用免费的 Short URL 短链接 API 对接说明
前端
崔庆才丨静觅9 小时前
5分钟快速搭建 AI 平台并用它赚钱!
前端
崔庆才丨静觅9 小时前
比官方便宜一半以上!Midjourney API 申请及使用
前端
Moment10 小时前
富文本编辑器在 AI 时代为什么这么受欢迎
前端·javascript·后端
崔庆才丨静觅10 小时前
刷屏全网的“nano-banana”API接入指南!0.1元/张量产高清创意图,开发者必藏
前端
剪刀石头布啊10 小时前
jwt介绍
前端
爱敲代码的小鱼10 小时前
AJAX(异步交互的技术来实现从服务端中获取数据):
前端·javascript·ajax