js中的let和var
在ES6中,应该尽量使用const和let来声明变量,而尽量避免使用var。
var的缺点是它的作用域比较混乱,使用let能够保证清晰的作用域。
下面看一个小例子。
var x = 3;
if(x==3) {
var x = 7;
}
console.log(x)//输出x=7
let y=4
if(y==4){
// var y=5//报错:y已经定义过
}
console.log(y)//输出4
给你出道题:编写一个html页面,一打开页面,就alert三次,每次alert的文本显示当前是第几次alert
<html>
<script>
for (var i = 0; i < 3; i++) {
setTimeout(function () {
alert("这是第" + i + "次")
}, 1000 * i)
}
</script>
</html>
写完运行,发现每次显示都是第3次。这是因为循环已经运行完了,i=3,然后才开始alert。
那么问题来了,如何把i的状态保存下来?
<html>
<script>
for (var i = 0; i < 3; i++) {
setTimeout(function () {
var j=i//使用var是没有用处的,使用let就对了
alert("这是第" + j + "次")
}, 1000 * i)
}
</script>
</html>
使用var j=i把i的状态保存下来,会发现并无卵用。因为3次循环var j是一个变量,而不是三份!我们想要实现的是保留三份j,这时使用let就可以实现了。
那么问题来了,let是ES6才有的,没有let之前人们是如何操作的呢?
<html>
<script>
for (var i = 0; i < 3; i++) {
(function (val) {
setTimeout(function () {
alert("这是第" + val + "次")
}, 1000 * i)
})(i)
}
</script>
</html>
由上面的小例子可以看出,let有严格的作用域而var没有。
正是因为let有严格的作用域,所以let会进行许多运行时检查,比如禁止重复定义。
let还有一种作用域的用法。
var x = 5;
var y = 0;
let (x = x+10, y = 12) {
console.log(x+y); // 27
}
console.log(x + y); // 5
参考资料
阮一峰-Javascript 严格模式详解
海洋天堂-js中let和var
js中的let和var的更多相关文章
- js中局部变量必须用var去声明
js中的变量与其他的脚本语言都是很不一样的,在function中你如果不用var 声明一个变量,那么这个变量将在全局可见,也就相当于创建了全局变量.所以在function中声明变量尽量都是用var来声 ...
- 前端面试题:JS中的let和var的区别
最近很多前端的朋友去面试被问到let和var的区别,其实阮一峰老师的ES6中已经很详细介绍了let的用法和var的区别.我简单总结一下,以便各位以后面试中使用. ES6 新增了let命令,用来声明局部 ...
- js中变量声明有var和没有var的区别
转js中var用与不用的区别 2015年07月13日 16:08:22 阅读数:3627 Javascript声明变量的时候,虽然用var关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种 ...
- JS中的let和var的区别
最近很多前端的朋友去面试被问到let和var的区别,其实阮一峰老师的ES6中已经很详细介绍了let的用法和var的区别.我简单总结一下,以便各位以后面试中使用. ES6 新增了let命令,用来声明局部 ...
- js中函数提升及var变量提示
其中,在javascript中,函数声明及var声明的变量会得到提升.但是函数声明会先于var声明的变量被提升.即便function写在后面. 看下面的例子: var aa = 221; functi ...
- js中不容小觑的var声明
在学习vue相关课程中,有一次跟着老师敲代码,写出了如下代码: var Child = { template:`<div @click='handleClick'><slot> ...
- js中定义变量之②var let const的区别
var 上一篇文章有讲过,是js定义变量的关键词. 但是在es6中,新添加了两个关键词,用于变量声明的关键词:let 和const 接下来就说一下var let 和const的区别: 首先说var 用 ...
- js中定义变量加var与不加var的区别?
var 不一定是用来定义局部变量的 jscript的全局变量和局部变量的分界是这样的: 过程体(包括方法function,对象Object o ={})外的所有变量不 ...
- js中关键字 const , let , var 的用法区别
1.const定义的变量不可以修改,而且必须初始化. 2.var定义的变量可以修改,如果不初始化会输出undefined,不会报错. 3.let是块级作用域,函数内部使用let定义后,对函数外部无影响 ...
随机推荐
- FastJson和Gson和Json数据解析分析和用法
首先分析下目前号称最快的FastJson,这个是所有人都验证过的,解析速度确实比较快,不过也需要根据数据量来看,数据量小的时候,Gson性能要稍微优于FastJson,但在数据量大解析的情况下,Fas ...
- 《阿里巴巴JAVA开发手册》里面写超过三张表禁止join这是为什么?
分库分页.应用里做join 多表join性能很差 参考: 1.https://www.zhihu.com/question/56236190
- PHP自己定义安装
① 自己定义安装(先要在管理里停止apache服务,再卸载apache.再安装时不须要重新启动电脑) apache+php+mysql+phpmyadmin自行安装 我们建议大家,安装的时候安装到同一 ...
- Paint、Canvas、Matrix使用解说(一、Paint)
username=tianjian4592">我正在參加 CSDN 2015博客之星评选 感恩分享活动,假设认为文章还不错,请投个票鼓舞下吧:http://vote.blog.csdn ...
- OTL翻译(7) -- otl_exception类
otl_exception 这个类是OTL用来抛出异常的类.如果数据库API返回一个非0的错误值,则OTL会将会抛出一个otl_exception的异常.一个otl_exception异常有可能是一个 ...
- SQL Server中数据的修改是如何落盘的?
SQL Server 维护着一个叫做buffer cache的东西, 在buffer cache中SQL Server 读取必须被取回的data pages. 数据在修改时并不是直接写到磁盘上的, 而 ...
- Candy leetcode java
题目: There are N children standing in a line. Each child is assigned a rating value. You are giving c ...
- 微软 WCF的几种寄宿方式,寄宿IIS、寄宿winform、寄宿控制台、寄宿Windows服务
WCF寄宿方式是一种非常灵活的操作,可以在IIS服务.Windows服务.Winform程序.控制台程序中进行寄宿,从而实现WCF服务的运行,为调用者方便.高效提供服务调用.本文分别对这几种方式进行详 ...
- Javascript 操作 Sql中的Xml 字段
在一个项目当中,我们需要把数据库中的Xml字段中的信息表现在页面中,如果用Sql进行操作,读取.这样的话,必然导致太复杂,于是我想到了,如果把Xml字段先读出来,然后用Js去操作,这样岂不是简单了许多 ...
- C# 特性(Attribute)(二)
AttributeUsage类是另外一个预定义特性类,它帮助我们控制我们自己的定制特性的使用.它描述了一个定制特性如和被使用. AttributeUsage有三个属性,我们可以把它放置在定制属性 ...