TypeScript中let和var的区别介绍

目录

• 1、作用域不同
• 2、let没有变量提升
• 3、let变量不能重复声明
• 4、for循环中的let与var

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的区别的文章就介绍到这了,更多相关TypeScript let与var区别内容请搜索自由互联以前的文章或继续浏览下面的相关文章希望大家以后多多支持自由互联！