扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
这篇文章主要介绍了JS中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 | ✅ | ✅ | ❌ | ❌ | ❌ |
感谢你能够认真阅读完这篇文章,希望小编分享JS中var、let和const是什么内容对大家有帮助,同时也希望大家多多支持创新互联,关注创新互联行业资讯频道,遇到问题就找创新互联,详细的解决方法等着你来学习!
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流