在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的更多相关文章

  1. js中局部变量必须用var去声明

    js中的变量与其他的脚本语言都是很不一样的,在function中你如果不用var 声明一个变量,那么这个变量将在全局可见,也就相当于创建了全局变量.所以在function中声明变量尽量都是用var来声 ...

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

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

  3. js中变量声明有var和没有var的区别

    转js中var用与不用的区别 2015年07月13日 16:08:22 阅读数:3627 Javascript声明变量的时候,虽然用var关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种 ...

  4. JS中的let和var的区别

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

  5. js中函数提升及var变量提示

    其中,在javascript中,函数声明及var声明的变量会得到提升.但是函数声明会先于var声明的变量被提升.即便function写在后面. 看下面的例子: var aa = 221; functi ...

  6. js中不容小觑的var声明

    在学习vue相关课程中,有一次跟着老师敲代码,写出了如下代码: var Child = { template:`<div @click='handleClick'><slot> ...

  7. js中定义变量之②var let const的区别

    var 上一篇文章有讲过,是js定义变量的关键词. 但是在es6中,新添加了两个关键词,用于变量声明的关键词:let 和const 接下来就说一下var let 和const的区别: 首先说var 用 ...

  8. js中定义变量加var与不加var的区别?

    var 不一定是用来定义局部变量的 jscript的全局变量和局部变量的分界是这样的:                  过程体(包括方法function,对象Object o ={})外的所有变量不 ...

  9. js中关键字 const , let , var 的用法区别

    1.const定义的变量不可以修改,而且必须初始化. 2.var定义的变量可以修改,如果不初始化会输出undefined,不会报错. 3.let是块级作用域,函数内部使用let定义后,对函数外部无影响 ...

随机推荐

  1. linux常用C函数目录

    字符测试篇 isalnum isalpha isascii iscntrl isdigit isgraphis islower isprint isspace ispunct isupper isxd ...

  2. 详解Spring中的Profile

    前言 由于在项目中使用Maven打包部署的时候,经常由于配置参数过多(比如Nginx服务器的信息.ZooKeeper的信息.数据库连接.Redis服务器地址等),导致实际现网的配置参数与测试服务器参数 ...

  3. 简明python教程 --C++程序员的视角(五):面向对象的编程

    面向对象的编程 在大多数时候你可以使用过程性编程,但是有些时候当你想要编写大型程序或是寻求一个更加合适的解决方案的时候,你就得使用面向对象的编程技术. 对象可以使用普通的属于对象的变量存储数据.属于一 ...

  4. Length of Last Word leetocde java

    题目: Given a string s consists of upper/lower-case alphabets and empty space characters ' ', return t ...

  5. Restful安全认证及权限的解决方案

    一.Restful安全认证常用方式 1.Session+Cookie 传统的Web认证方式.需要解决会话共享及跨域请求的问题. 2.JWT JSON Web Token. 3.OAuth 支持两方和三 ...

  6. 新鲜出炉!9个超高分辨率的iPhone 6原型素材打包下载

    iPhone 6 出场,设计师又有得忙活了,但是新鲜的资源你们在哪里?!今天我们收集了一组精致的iPhone 6 模型素材,超高分辨率,多种视图,全都打包完毕,点一下就可以拿回家!赶紧来取吧!——   ...

  7. 你应该抓紧学习Python,它是开发Web应用最强大的语言

    Python和少数几种编程语言,如MySQL.Perl.PHP和与LAMP打包的网络结构一起的Apache,已经成为Linux的一个基本组件.即 使从它诞生开始,Python就与其他动态编程语言如Ru ...

  8. 实用的表格内省略号和换行(兼容IE6)

    让连续的英文数字字符换行显示 word-break: break-all; 让单行文字超出的时候使用点点点表示 white-space: nowrap; overflow: hidden; text- ...

  9. 网络结构设计——负载均衡之LVS学习笔记(四)

    LVS按个人理解的说就是将一台Linux服务器当作路由器等功能的技术.LVS---Linux虚拟服务器. LVS实现了三种IP负载均衡技术VS/NAT.VS/TUN.VS/DR. 今天简单分享一下我在 ...

  10. Ubuntu16.04下Neo4j图数据库官网安装部署步骤(图文详解)(博主推荐)

    不多说,直接上干货! 说在前面的话  首先,查看下你的操作系统的版本. root@zhouls-virtual-machine:~# cat /etc/issue Ubuntu LTS \n \l r ...