本篇文章给大家介绍一下JavaScript 的 var，let 和 const，有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。
var语句用来在 JavaScript 中声明一个变量，该变量遵守以下规则：
window上以相同的名称创建一个全局属性。当出现在全局作用域内时，var创建一个全局变量。另外它还会在window上创建一个具有相同名称的全局属性：
var city = "Florence"; console.log(window.city); // "Florence"
当在函数内部声明时，变量的作用域为该函数：
var city = "Florence"; function bubble() { var city = "Siena"; console.log(city); } bubble(); // "Siena" console.log(city); // "Florence"
var声明会被提升：
function bubble() { city = "Siena"; console.log(city); var city; // hoists } bubble(); // "Siena"
在没有任何声明的情况下所分配的变量（无论是var，let还是const）在默认情况下会成为全局变量：
function bubble() { city = "Siena"; console.log(window.city); } bubble(); // "Siena"
为了消除这种行为，需要使用严格模式：
"use strict"; function bubble() { city = "Siena"; console.log(window.city); } bubble(); // ReferenceError: assignment to undeclared variable city
任何用var声明的变量都可以在以后进行重新分配或重新声明。重新声明的例子：
function bubble() { var city = "Florence"; var city = "Siena"; console.log(city); } bubble(); // "Siena"
重新分配的例子：
function bubble() { var city = "Siena"; city = "Florence"; console.log(city); } bubble(); // "Florence"
let语句在 JavaScript 中声明一个变量，该变量遵守以下规则：
window上创建任何全局属性。用let声明的变量不会在window上创建任何全局属性：
let city = "Florence"; console.log(window.city); // undefined
当在函数内部声明时，变量的作用域为该函数：
let city = "Florence"; function bubble() { let city = "Siena"; console.log(city); } bubble(); // "Siena" console.log(city); // "Florence"
当在块中声明时，变量的作用域为该块。以下是在块中使用的例子：
let city = "Florence"; { let city = "Siena"; console.log(city); // "Siena"; } console.log(city); // "Florence"
一个带有if块的例子：
let city = "Florence"; if (true) { let city = "Siena"; console.log(city); // "Siena"; } console.log(city); // "Florence"
相反，var并不受到块的限制：
var city = "Florence"; { var city = "Siena"; console.log(city); // "Siena"; } console.log(window.city); // "Siena"
let声明可能会被提升，但是会产生暂存死区：
function bubble() { city = "Siena"; console.log(city); // TDZ let city; } bubble(); // ReferenceError: can't access lexical declaration 'city' before initialization
暂存死区可防止在初始化之前访问let声明。另外一个例子：
function bubble() { console.log(city); // TDZ let city = "Siena"; } bubble(); // ReferenceError: can't access lexical declaration 'city' before initialization
可以看到两个例子中产生的异常都是一样的：证明了“暂存死区”的出现。
任何用let声明的变量都不能重新声明。重新声明引发异常的例子：
function bubble() { let city = "Siena"; let city = "Florence"; console.log(city); } bubble(); // SyntaxError: redeclaration of let city
这是一个有效的重新分配的例子：
function bubble() { let city = "Siena"; city = "Florence"; console.log(city); } bubble(); // "Florence"
const语句用来在 JavaScript 中声明一个变量，该变量遵守以下规则：
window上创建任何全局属性。用 const 声明的变量不会在window上创建任何全局属性：
const city = "Florence"; console.log(window.city); // undefined
当在函数内部声明时，变量的作用域为该函数：
const city = "Florence"; function bubble() { const city = "Siena"; console.log(city); } bubble(); // "Siena" console.log(city); // "Florence"
当在块中声明时，变量的作用域为该块。块语句{}的例子：
const city = "Florence"; { const city = "Siena"; console.log(city); // "Siena"; } console.log(city); // "Florence"
在if块中的例子：
const city = "Florence"; if (true) { const city = "Siena"; console.log(city); // "Siena"; } console.log(city); // "Florence"
const声明可能会被提升，但是会进入暂存死区：
function bubble() { console.log(city); const city = "Siena"; } bubble(); // ReferenceError: can't access lexical declaration 'city' before initialization
用const声明的任何变量都不能重新声明，也不能重新分配。 一个在重新声明时抛出异常的例子：
function bubble() { const city = "Siena"; const city = "Florence"; console.log(city); } bubble(); // SyntaxError: redeclaration of const city
重新分配的例子示例：
function bubble() { const city = "Siena"; city = "Florence"; console.log(city); } bubble(); // TypeError: invalid assignment to const 'city'
| 块作用域 | 暂存死区 | 创建全局属性 | 可重新分配 | 可重新声明 | |
|---|---|---|---|---|---|
var |
❌ | ❌ | ✅ | ✅ | ✅ |
let |
✅ | ✅ | ❌ | ✅ | ❌ |
const |
✅ | ✅ | ❌ | ❌ | ❌ |
英文原文地址：https://www.valentinog.com/blog/var/
作者：Valentino
相关免费学习推荐：js视频教程
以上是了解JS中的var、let和const的详细内容。更多信息请关注PHP中文网其他相关文章！
