在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. 一道面试题：用shell写一个从1加到100的程序

    [试题描述] 请用shell写一个简短的程序,实现1+2+...+100的功能. [程序] 方法一: #!/bin/bash ..} do let sum+=$i done echo $sum 方法二 ...

  2. 2、COCOS2D-X内存管理机制

    在C++中.动态内存分配是一把双刃剑,一方面,直接訪问内存地址提高了应用程序的性能,与使用内存的灵活性.还有一方面.因为程序没有正确地分配与释放造成的比如野指针,反复释放,内存泄漏等问题又严重影响着应 ...

  3. HBase目录

    1. HBase介绍及简易安装(转) 2. java操作Hbase实例 3. HBase入门基础教程之单机模式与伪分布式模式安装(转) 4. HBase教程 5. 用Java操纵HBase数据库(新建 ...

  4. java中需要用equals来判断两个字符串值是否相等

    在C++中,两个字符串比较的代码可以为: (string1==string2) 但在java中,这个代码即使在两个字符串完全相同的情况下也会返回false Java中必须使用string1.equal ...

  5. mini-parser

    https://leetcode.com/problems/mini-parser/ /** * // This is the interface that allows for creating n ...

  6. js 获取读取cookie

    // --- 设置cookie function setCookie(sName, sValue, expireHours) {     var cookieString = sName + &quo ...

  7. 【Hadoop】Combiner的本质是迷你的reducer，不能随意使用

    问题提出: 众所周知,Hadoop框架使用Mapper将数据处理成一个<key,value>键值对,再网络节点间对其进行整理(shuffle),然后使用Reducer处理数据并进行最终输出 ...

  8. IOS网络访问详解

    第一.访问网络的方式 同步请求:数据的请求过程是由主线程发起的,网络加载需要一定的时间,因此会堵塞主线程 异步请求:数据的请求在多线程中完成 同步请求无法取消,异步请求的过程中可以取消,同步请求无法监 ...

  9. Java--解压缩zip包

    Test.java import java.io.IOException; public class Test { public static void main(String[] args) thr ...

  10. isPostback 的原理及作用（很easy）

    1.IsPostBack用来推断表单是否是回发. (不是第一次请求),是点击表单的提交button回发过来的.是否是回发与get请求还是Post请求无关.可是普通情况下回发都是Post请求. 一般Ge ...