JS中var、let和const是什么

这篇文章主要介绍了JS中var、let和const是什么,具有一定借鉴价值,需要的朋友可以参考下。希望大家阅读完这篇文章后大有收获。下面让小编带着大家一起了解一下。

创新互联公司专注于洛南网站建设服务及定制,我们拥有丰富的企业做网站经验。 热诚为您提供洛南营销型网站建设,洛南网站制作、洛南网页设计、洛南网站官网定制、小程序开发服务,打造洛南网络公司原创品牌,更为您提供洛南网站排名全网营销落地服务。

var

var 语句用来在 JavaScript 中声明一个变量,该变量遵守以下规则:

  • 作用域范围是函数作用域或全局作用域的。
  • 不受暂存死区(TDZ)的限制。
  • 它会在 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"

意外的全局变量

在没有任何声明的情况下所分配的变量(无论是 varlet 还是 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

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

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是什么内容对大家有帮助,同时也希望大家多多支持创新互联,关注创新互联行业资讯频道,遇到问题就找创新互联,详细的解决方法等着你来学习!


文章题目:JS中var、let和const是什么
分享链接:http://pwwzsj.com/article/ipdeog.html