yuanyuanbyte/Blog

JavaScript 基础系列之 let、const 以及 var 的区别

yuanyuanbyte opened this issue · 0 comments

本系列的主题是 JavaScript 基础,每期讲解一个技术要点。如果你还不了解各系列内容,文末点击查看全部文章,点我跳转到文末

如果觉得本系列不错,欢迎 Star,你的支持是我创作分享的最大动力。

let、const 以及 var 的作用

var 语句 用于声明一个函数范围或全局范围的变量,并可将其初始化为一个值(可选)。

let 语句声明一个块级作用域的局部变量,并可以初始化为一个值(可选)。

const 语句声明一个常量,是块级范围的,非常类似用 let 语句定义的变量。但常量的值是无法(通过重新赋值)改变的,也不能被重新声明。

  • 使用 const 声明创建一个常量必须有一个初始值,也就是说,必须在声明的同一语句中指定它的值(因为以后不能更改)。

  • const 声明创建一个值的只读引用。但这并不意味着它所持有的值是不可变的,只是变量标识符不能重新分配。在引用内容是对象的情况下,这意味着可以改变对象的内容(例如,其参数)。

let、const 以及 var 的区别

(1) 初始值设置: 在变量声明时,var 和 let 可以不用设置初始值。而const声明变量必须设置初始值。

(2) 给全局添加属性: var声明的变量为全局变量,并且会将该变量添加为全局对象的属性,但是let和const不会(浏览器的全局对象是window,Node的全局对象是global)。

  • 在全局上下文中,使用 var 声明的变量将作为全局对象的不可配置属性被添加。
  • let 和 const 不会在全局声明时(在最顶部的范围)创建 window 对象的属性。

(3) 块级作用域: let和const具有块级作用域,var不存在块级作用域。块级作用域解决了ES5中的两个问题:

  • 内层变量可能覆盖外层变量;
  • 用来计数的循环变量泄露为全局变量。

(4) 变量提升: var存在变量提升,let和const不存在变量提升,即在变量只能在声明之后使用,否在会报错。

(5) 暂时性死区: 在使用let、const命令声明变量之前,该变量都是不可用的。这在语法上,称为暂时性死区(TDZ,temporal dead zone)。使用var声明的变量不存在暂时性死区。

(6) 重复声明: var声明变量时,可以重复声明变量,后声明的同名变量会覆盖之前声明的变量。const和let不允许重复声明变量。

查看全部文章

博文系列目录

  • JavaScript 深入系列
  • JavaScript 专题系列
  • JavaScript 基础系列
  • 网络系列
  • 浏览器系列
  • Webpack 系列
  • Vue 系列
  • 性能优化与网络安全系列
  • HTML 应知应会系列
  • CSS 应知应会系列

交流

各系列文章汇总:https://github.com/yuanyuanbyte/Blog

我是圆圆,一名深耕于前端开发的攻城狮。

weixin