js知识点汇总之let const 和 var的区别

let const 和 var的区别

作用域

ES5 中的作用域有:全局作用域、函数作用域,ES6 中新增了块级作用域。块作用域由 { } 包括,if 语句和 for 语句里面的 { } 也属于块作用域。

var关键字

  1. 没有块级作用域的概念
// global scope
{var a = 10;
}
console.log(a); // 10

在全局中输出a为10说明var不存在块级作用域的概念

  1. 有全局作用域,函数作用域的概念

    var b = 20;
    function test() {var a = 10;console.log(a);console.log(b);
    }
    test();
    console.log(a);
    // 10 20 a is not defined
    
  2. 不初始化值默认为 undefined,存在变量提升

    console.log(a); //undefined
    var a;
    a = 10;
    
  3. 全局作用域用 var 声明的变量会挂载到 window 对象下

//Global Scope
var a = 10;
console.log(a);  //10
console.log(window.a);  //10
console.log(this.a);  //10
  1. 同一作用域中允许重复声明
//Global Scope
var a = 10;
var a = 20;
console.log(a);  //20checkscope();
function checkscope(){//Local Scopevar b = 10;var b = 20;console.log(b);  //20
}

上面代码中,在 Global Scope 中声明了 2a,以最后一次声明有效,打印为 20。同理,在 Local Scope 也是一样的。

let 关键字

  1. 有块级作用域的概念
{//Block Scopelet a = 10;
}
console.log(a);  //ReferenceError: a is not defined

上面代码中,打印 a 报错,说明存在 Block Scope 的概念。

  1. 不存在变量提升(不可以在声明之前使用)
{//Block Scopeconsole.log(a);  //ReferenceError: Cannot access 'a' before initializationlet a = 10;
}

上面代码中,打印 a 报错:无法在初始化之前访问。说明不存在变量提升。

  1. 暂时性死区
{//Block Scopeconsole.log(a);  //ReferenceError: Cannot access 'a' before initializationlet a = 20;
}if (true) {//TDZ开始console.log(a);  //ReferenceError: Cannot access 'a' before initializationlet a; //TDZ结束console.log(a);  //undefineda = 123;console.log(a);  //123
}

上面代码中,使用 let 声明的变量 a,导致绑定这个块级作用域,所以在 let 声明变量前,打印的变量 a 报错。

这是因为使用 let/const 所声明的变量会存在暂时性死区。

什么叫做暂时性死区域呢?翻译成人话就是:

当程序的控制流程在新的作用域(module、functionblock 作用域)进行实例化时,在此作用域中用 let/const 声明的变量会先在作用域中被创建出来,但因此时还未进行词法绑定,所以是不能被访问的,如果访问就会抛出错误。因此,在这运行流程进入作用域创建变量,到变量可以被访问之间的这一段时间,就称之为暂时死区。

再简单理解就是:

ES6 规定,let/const 命令会使区块形成封闭的作用域。若在声明之前使用变量,就会报错。
总之,在代码块内,使用 let/const 命令声明变量之前,该变量都是不可用的。
这在语法上,称为 “暂时性死区”temporal dead zone,简称 TDZ)。

其实上面不存在变量提升的例子中,其实也是暂时性死区,因为它有暂时性死区的概念,所以它压根就不存在变量提升了。

  1. 同一块作用域中不允许重复声明
{//Block Scopelet A;var A;  //SyntaxError: Identifier 'A' has already been declared
}
{//Block Scopevar A;let A;  //SyntaxError: Identifier 'A' has already been declared
}
{//Block Scopelet A;let A;  //SyntaxError: Identifier 'A' has already been declared
}

const 关键字

  1. 必须立即初始化,不能留到以后赋值
// Block Scope 
const a; // SyntaxError: Missing initializer in const declaration } 

上面代码中,用 const 声明的变量 a 没有进行初始化,所以报错。

  1. 常量的值不能改变
//Block Scope 
{const a = 10; a = 20; // TypeError: Assignment to constant variable
}

上面代码中,用 const 声明了变量 a 且初始化为 10,然后试图修改 a 的值,报错。

const 实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/16197.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

AGI系列(2):掌握AI大模型提示词优化术,从容应对各种提问场景

在上一篇大模型提示词的文章中,笔者介绍一种通用提示词优化的方法,这种方法基本上可以覆盖大部分人的一般场景需求。 没看到上文的读者,可以通过如下链接去看下: 👉👉👉 AGI系列(1&a…

全网首发UNIAPP功能多的iapp后台源码

全网首发UNIAPP功能多的iapp后台源码,众所周知UN Dev Assist 后台是一款既不免费又不好用的后台今天直接分享。 搭建教程在里面了,自己查看。 源码下载:https://download.csdn.net/download/m0_66047725/89291994 更多资源下载:…

【Python】处理不平衡数据集的高级方法:ADASYN详解

原谅把你带走的雨天 在渐渐模糊的窗前 每个人最后都要说再见 原谅被你带走的永远 微笑着容易过一天 也许是我已经 老了一点 那些日子你会不会舍不得 思念就像关不紧的门 空气里有幸福的灰尘 否则为何闭上眼睛的时候 又全都想起了 谁都别说 让我一个人躲一躲 你的承诺 我竟然没怀…

汇编原理(二)

寄存器:所有寄存器都是16位(0-15),可以存放两个字节 AX,BX,CX,DX存放一般性数据,称为通用寄存器 AX的逻辑结构。最大存放的数据为2的16次方减1。可分为AH和AL,兼容8位寄存器。 字:1word 2Byte…

JVM学习-Class文件结构②

访问标识(access_flag) 在常量池后,紧跟着访问标记,标记使用两个字节表示,用于识别一些类或接口层次的访问信息,包括这个Class是类还是接口,是否定义为public类型,是否定义为abstract类型,如果…

健身房会员管理系统服务预约小程序的作用是什么

拥有完美身材/减肥/锻炼等前往健身房是个不错的选择,商家生意开展需要吸引同城客户并转化,客户也有自己的判断需要找到更全面的场地;完善客户消费流程利于品牌发展和不断获客转化。 运用【雨科】平台搭建健身房管理系统小程序,多…

MySQL事务篇1:事物的四大特性(ACID)、三类数据读取问题与隔离级别

一、什么是事务? MySQL的事务(Transaction)是一组由数据库管理系统(DBMS)执行的一个或多个SQL语句的集合,这些SQL语句作为一个单独的工作单元执行。事务的主要目的是确保数据库的一致性和完整性&#xff0c…

蓝桥杯2023(十四届)省赛——飞机降落(双马尾DFS)

飞机降落(DFS) 蓝桥杯2023年第十四届省赛真题-飞机降落 - C语言网 (dotcpp.com) 一开始我是真的没想到用DFS做,我还在想用什么策略排序呢。需要再刷!!! 双马尾的意思其实是刷了两次... 一刷&#xff1a…

leecode 637 二叉树的层平均值

leetcode 二叉树相关-层序遍历专题 二叉树的层序遍历一般来说,我们是利用队列来实现的,先把根节点入队,然后在出队后将其对应的子节点入队,然后往复此种操作。相比于二叉树的遍历递归,层序遍历比较简单,有…

CHI协议_1

作者:someone链接:https://www.zhihu.com/question/304259901/answer/3455648666来源。 1. AMBA CHI简介 一致性总线接口(CHI)是AXI一致性扩展(ACE)协议的演进。它是Arm的AMBA总线的一部分。AMBA是一种免…

美团Java社招面试题真题,最新面试题

如何处理Java中的内存泄露? 1、识别泄露: 使用内存分析工具(如Eclipse Memory Analyzer Tool、VisualVM)来识别内存泄露的源头。 2、代码审查: 定期进行代码审查,关注静态集合类属性和监听器注册等常见内…

VueJS ReactJS实现AI问答小助手(2)——流式TTS文字转实时语音播放

TTS(Text-to-speech)文字转语音使用的是阿里云的服务,文档地址: https://help.aliyun.com/zh/isi/developer-reference/streaming-text-tts-wss 文档只给出了一些配置项的说明,以及java端的代码示例,但没有web端的。所以这篇笔记可以给web开发者参考。 首先,AI答复的消息…

.NET File Upload

VS2022 .NET8 &#x1f4be;基础上传示例 view {ViewData["Title"] "File Upload"; }<h1>ViewData["Title"]</h1><form method"post" enctype"multipart/form-data" action"/Home/UploadFile"…

Android 系统日志(Log) JNI实现流程源码分析

1、JNI概述 Java Native Interface (JNI) 是一种编程框架&#xff0c;使得Java代码能够与用其他编程语言&#xff08;如C和C&#xff09;编写的本地代码进行交互。JNI允许Java代码调用本地代码的函数&#xff0c;也允许本地代码调用Java代码的函数。下面是对JNI机制的详细概述…

【单片机】STM32F070F6P6 开发指南(一)STM32建立HAL工程

文章目录 一、基础入门二、工程初步建立三、HSE 和 LSE 时钟源设置四、时钟系统&#xff08;时钟树&#xff09;配置五、GPIO 功能引脚配置六、配置 Debug 选项七、生成工程源码八、生成工程源码九、用户程序下载 一、基础入门 f0 pack下载&#xff1a; https://www.keil.arm…

【OpenCV 基础知识 19】拉普拉斯变换

功能&#xff1a; cvLaplace 是计算图像的 Laplacian 变换 &#xff0c;是Intel开源项目opencv中的函数 函数形式&#xff1a; void cvLaplace( const CvArr* src, CvArr* dst, int aperture_size3 ); 参数列表&#xff1a; Src 输入图像. Dst 输出图像. aperture_size算子内…

离线初始化k8s

导出和导入所有必要的 Kubernetes 镜像&#xff0c;使用阿里云作为源。 在能访问外网的机器上拉取镜像 首先&#xff0c;在有外网访问的机器上运行以下命令来拉取所有 Kubernetes v1.29.5 版本需要的镜像&#xff1a; kubeadm config images pull --image-repository regist…

大模型应用:基于Golang实现GPT模型API调用

1.背景 当前OpenAI提供了开放接口&#xff0c;支持通过api的方式调用LLM进行文本推理、图片生成等能力&#xff0c;但目前官方只提供了Python SDK。为了后续更方便集成和应用&#xff0c;可以采用Golang对核心推理调用接口进行封装&#xff0c;提供模型调用能力。 2.相关准备…

Spark运行模式详解

Spark概述 Spark 可以在多种不同的运行模式下执行&#xff0c;每种模式都有其自身的特点和适用场景。 部署Spark集群大体上分为两种模式&#xff1a;单机模式与集群模式。大多数分布式框架都支持单机模式&#xff0c;方便开发者调试框架的运行环境。但是在生产环境中&#xff…

软件web化的趋势

引言 在信息技术飞速发展的今天&#xff0c;软件Web化已成为一个不可忽视的趋势。所谓软件Web化&#xff0c;即将传统的桌面应用软件转变为基于Web的应用程序&#xff0c;使用户能够通过浏览器进行访问和使用。传统软件通常需要在用户的计算机上进行安装和运行&#xff0c;而W…