1、作用域不同

用var声明的变量,只有函数作用域和全局作用域,没有块级作用域。而let可以实现块级作用域,只能在代码块{}内有效,在{}之外不能访问,如下代码所示:

{
let a = 0;
var b = 1;
} console.log(a) // ReferenceError: a is not defined
console.log(b) // 1

2、let没有变量提升

在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为:暂时性死区,英文为:temporal dead zone,简称 TDZ。

//报错
console.log(a)
let a=10

3、let变量不能重复声明

使用var,多次声明同一个变量,不会报错,只会得到一个变量。

var a=1;
var a=2;

上述例子中,所有的a的声明实际上都引用了一个相同的a。在多人开发一个项目时,容易出现问题。比如都定义了一个变量a,但各自用途不同,后面定义的a会把前面定义的覆盖掉。

而let就相对严格,无法多次声明同一个变量,一个变量只能声明一次,并且无法在 let 语句前去访问该变量

let a=1;
let a=2; //错误

4、for循环中的let与var

for (var i = 0; i < 3; i++) {
setTimeout(function (){console.log("i:" + i);});
}

上述代码打印出来i都是3,这个结果令人感觉奇怪。其实并不奇怪,原因如下所示:

(1)var是全局变量,并且可以允许重复定义,所以在for (var i = 0; i < 3; i++)语句中,i重复定义了3次,最终的值以最后一次定义为准。

(2)javascript是单线程,setTimeout()会等for执行完之后才开始计时,此时i的值为3,最终打印出3

for (let j = 0; j < 3; j++) {
setTimeout(function (){console.log("j:" + j);});
}

上述代码打印出来i是0、1、2,原因分析如下:

(1)变量j是用let声明的,当前的j只在本轮循环中有效,每次循环的j其实都是一个新的变量。

(2)在for循环中,不仅循环体{}会生成块级作用域,循环条件()也会生成块级作用域,循环条件()的块级作用域是循环体{}块级作用域的父级作用域,所以let可以跨越()和{}作用域。

参考:TypeScript let与var的区别

TypeScript let与var的区别的更多相关文章

  1. JavaScript中变量声明有var和没var的区别

    JavaScript中变量声明有var和没var的区别 JavaScript中有var和没var的区别 Js中的变量声明的作用域是以函数为单位,所以我们经常见到避免全局变量污染的方法是 (functi ...

  2. 详解变量声明加 var 和不加 var 的区别

    在全局作用域中声明变量加 var 关键字和不加 var ,js 引擎都会将这个变量声明为全局变量,在实际运行时,两种声明方式的变量的行为也是几乎一致的.但是在全局作用域下是否声明一个变量的 时候加va ...

  3. 前端面试题:JS中的let和var的区别

    最近很多前端的朋友去面试被问到let和var的区别,其实阮一峰老师的ES6中已经很详细介绍了let的用法和var的区别.我简单总结一下,以便各位以后面试中使用. ES6 新增了let命令,用来声明局部 ...

  4. es6入门1-- let与var的区别详解

    一.前言 说到做到,现在暂时放了放JS模式的读书笔记,打算好好看看ES6,毕竟出了这么久了,还是靠JS吃饭的,都不好好学JS新特性,确实说不过去,我本来是想当读书笔记去记录ES6,但是这个确实是属于边 ...

  5. js中const,var,let区别(转载)

    js中const,var,let区别 来源:https://www.cnblogs.com/zzsdream/p/6372729.html 今天第一次遇到const定义的变量,查阅了相关资料整理了这篇 ...

  6. [js]js中变量带var和不带var的区别

    上图已说的很清晰了. 下面代码是赘述 <script> //带var和不带var的区别: // 1.只有带var的才可以预解释,所以在赋值的前操作不会报错. console.log(num ...

  7. javascript中let和var的区别

    let是es6中新增命令,也是用来声明变量的,可能很多小伙伴都像我一样,定义变量的时候都会用var而很少用到let,那么,let和var到底有什么区别呢? let和var的区别体现在作用域上.var的 ...

  8. js中加“var”和不加“var”的区别

    JavaScript 拥有动态类型.这意味着相同的变量可用作不同的类型: var x // x 为 undefined var x = 6; // x 为数字 var x = "Bill&q ...

  9. 在Javascript中 声明时用"var"与不用"var"的区别,== 和 ===的区别

    今天,被问到两个JS问题,当时没回答到重点,问题虽然看起来简单,但是细节却马虎不得,在此做下记录: 1. 在Javascript中 声明时用"var"与不用"var&qu ...

随机推荐

  1. C++的三种继承方式详解以及区别

    目录 目录 C++的三种继承方式详解以及区别 前言 一.public继承 二.protected继承 三.private继承 四.三者区别 五.总结 后话 C++的三种继承方式详解以及区别 前言 我发 ...

  2. MySQL常用数据类型及细节

    目录 1 整数类型 1.1 可选属性 1.1.1 M 1.1.2 UNSIGNED 1.1.3 ZEROFILL 2 浮点类型 2.1 精度误差 3 定点数类型 3.1 数据精度说明 3.2 类型介绍 ...

  3. Java 18为什么要指定UTF-8为默认字符集

    在Java 18中,将UTF-8指定为标准Java API的默认字符集.有了这一更改,依赖于默认字符集的API将在所有实现.操作系统.区域设置和配置中保持一致. 做这一更改的主要目标: 当Java程序 ...

  4. delete-drop语句生成的存储过程

    问题: 开发时有时候需要对很多表进行操作. 例如:清空(删除)所有(某些)表,删除所有表某时间点之后导入的数据(类似于回滚) 解决方式: 对选定的表集合执行相同的查询条件(可为空),如果这个执行结果大 ...

  5. HTTP.sys远程执行代码漏洞检测

    1.漏洞描述:HTTP 协议栈 (HTTP.sys) 中存在一个远程执行代码漏洞,这是 HTTP.sys 不正确地分析特制 HTTP 请求时导致的.成功利用此漏洞的攻击者可以在系统帐户的上下文中执行任 ...

  6. 记一次百万行WPF项目代码的重构记录

    此前带领小组成员主导过一个百万行代码上位机项目的重构工作,分析项目中存在的问题做了些针对性的优化,整个重构工作持续了一年半之久. 主要针对以下问题: 1.产品型号太多导致代码工程的分支太多,维护时会产 ...

  7. apache tomcat 目录session应用信息漏洞

    Tomcat 是一款开源的 Web 应用服务器软件.Tomcat 属于轻量级应用服务器,在中小型系统和并发访问用户不多的场合下被普遍使用,是开发和调试 JSP 程序的首选. 漏洞描述 apache T ...

  8. Vue路由实现之通过URL中的hash(#号)来实现不同页面之间的切换(图表展示、案例分析、附源码详解)

    前言 本篇随笔主要写了Vue框架中路由的基本概念.路由对象属性.vue-router插件的基本使用效果展示.案例分析.原理图解.附源码地址获取. 作为自己对Vue路由进行页面跳转效果知识的总结与笔记. ...

  9. iOS全埋点解决方案-数据存储

    前言 ​ SDK 需要把事件数据缓冲到本地,待符合一定策略再去同步数据. 一.数据存储策略 ​ 在 iOS 应用程序中,从 "数据缓冲在哪里" 这个纬度看,缓冲一般分两种类型. 内 ...

  10. 封装axios请求

    import axios from 'axios' import router from '@/router' axios.defaults.baseURL = system.requestBaseU ...