1.let关键字

  

var arr = [ ];
for(var i=0; i<10; i++){
arr [i] = function(){
alert(i)
}
}
arr [8](); //结果:10

  看代码,不难猜测代码的意图是想给数组a的元素赋值,每一个元素是一个函数,运行后弹出相对应的数字,比如:运行arr[8]();想alert出一个数字8,运行arr[1](); 想alert出一个数字1,依次类推。但是结果并不是我们预想的那样。运行后实际弹出的是10;不管你运行的是arr[8]还是arr[5],或者是数组内的其他元素,都是alert出一个数字:10。但这并不是我们想要的,为什么会是10呢?这主要是因为‘变量提升’。

那什么又是变量提升呢?看看下面代码你就明白了

var a = 1;
(function(){
alert(a);
var a = 2;
})();//结果:undefined
//相当于
var a = 1;
(function(){
var a;
alert(a);
var a = 2;
})();//结果:undefined
 
var arr = [ ];
for(let i=0; i<10; i++){
arr[i] = function(){
alert(i)
}
}
arr[8](); //结果:8

  为什么用let就可以,用var就跑偏了呢?这是因为let声明的变量仅仅在自己的块级作用域起作用,出了这个块级作用域就不起作用。

  如果你用let这样重写刚刚那段代码的话:

var a = 1;
(function(){
alert(a);
let a = 2;
})(); // 结果:报错a未定义

  用let关键字来定义a;这样a在代码块内就不会提升了。那为什么又报错了呢,因为用let声明的变量,在其块级作用域内是封闭的,是不会受到外面的全局变量a影响的,并且要先声明再使用,所以a的值即不是1(因为不受外面的影响),也不是undefined(因为先声明后使用),更不是2,未声明定义就使用,只有报错啦。

用let关键字也算是提醒我们,平时记得先声明定义再使用的好习惯

使用let应该注意:

注意1:同一个块级作用域内,不允许重复声明同一个变量。

{
var a =1;
let a =2; //报错,因为a已经用var声明过
}
{
let a =1;
let a= 2; //还是报错,a已经用let声明过。
}

注意2:函数内不能用let重新声明函数的参数

function say(word){
let word = 'hello Jack'; //报错:用let重新声明word参数
alert(word)
}
say('hello Lili'); //say()函数内用let重新声明了word这个参数,会报错的,千万别这么干

总结:用let声明变量只在块级作用域起作用,适合在for循环使用,也不会出现变量提升现象。同一个代码块内,不可重复声明的相同变量,不可重复声明函数内的参数。

es6 let关键字的更多相关文章

  1. ES6 — 新增关键字let、const

    ECMAScript 是什么? 首先,我们都知道JavaScript由三部分组成:ECMAScript,DOM,BOM: 其中的ECMAScript是Javascript的语法规范. ECMAScri ...

  2. es6 super关键字

    rhttp://es6.ruanyifeng.com/#docs/class-extends super关键字,既可以当作函数使用,也可以当作对象使用.这俩种的使用是不一样的 第一种:函数使用 代表父 ...

  3. ES6新增关键字let与var的区别

    最近看了很多文章,偶然间看到ES6中新增了一个关键字 let ,它具有与 var 关键字相似的功能.一开始使用它时,发现它让我对之前一些习以为常的东西产生了怀疑. 下面先让我们看看它和 var 之间用 ...

  4. es6 const关键字

    const是constant(常量)的缩写,const和 let一样,也是用来声明变量的,但是const是专门用于声明一个常量的,顾名思义,常量的值是不可改变的.以前用var声明的变量,想怎么改就怎么 ...

  5. 使用JavaScript ES6的新特性计算Fibonacci(非波拉契数列)

    程序员面试系列 Java面试系列-webapp文件夹和WebContent文件夹的区别? 程序员面试系列:Spring MVC能响应HTTP请求的原因? Java程序员面试系列-什么是Java Mar ...

  6. 深入ES6 模块系统

    深入ES6 模块系统 本文转载自:众成翻译 译者:neck 链接:http://www.zcfy.cc/article/4436 原文:https://ponyfoo.com/articles/es6 ...

  7. 关于const关键字

    const:ES6新增关键字,用于声明创建一个值的只读引用. 我们都知道,const一般用来定义常量,在声明的时候需要赋初始值,而且初始值一旦赋值,便不能改变. 但是以上说的是针对于基本类型数据的定义 ...

  8. es5继承和es6类和继承

    es6新增关键字class,代表类,其实相当于代替了es5的构造函数 通过构造函数可以创建一个对象实例,那么通过class也可以创建一个对象实列 /* es5 创建一个person 构造函数 */ f ...

  9. PHP 基础笔记

    数据类型 字符串 整数 浮点数 布尔值 数组 对象 NULL 未定义的变量,数据类型为 NULL. PHP 中数组和对象是不同的类型,而 js 中数组即为对象.(ps: es6 已经内置了 class ...

随机推荐

  1. 3931: [CQOI2015]网络吞吐量

    3931: [CQOI2015]网络吞吐量 链接 分析: 跑一遍dijkstra,加入可以存在于最短路中的点,拆点最大流. 代码: #include<cstdio> #include< ...

  2. 做题记录 To 2019.2.13

    2019-01-18 4543: [POI2014]Hotel加强版:长链剖分+树形dp. 3653: 谈笑风生:dfs序+主席树. POJ 3678 Katu Puzzle:2-sat问题,给n个变 ...

  3. 使用最新版的Adobe Photoshop CC 2017

    1. 装之前建议把之前老的Photoshop删干静.打开官网 https://www.adobe.com/cn/products/photoshop.html  点免费使用 ,会下载一个安装器Crea ...

  4. linux 修改文件最大数

    ulimit -a 查看所有 open files (-n) 1024 是linux操作系统对一个进程打开的文件句柄数量的限制(也包含打开的套接字数量) ulimit -SHn 10000 ##临时修 ...

  5. JS截图(html2canvas)

    JS截图(html2canvas) • 引入js <script type="text/javascript" src="js/html2canvas.js&quo ...

  6. php+mysql 数据库分表分段备份程序--宋正河

    <?php //宋正河 转载请注明出处 set_time_limit(0); header('content-type:text/html;charset=utf-8'); mysql_conn ...

  7. Android Bitmap

    一 图片表示原理 图片是由每个像素点来组成 像素点就是小方块 图片的大小等于 宽*高*每个像素点的大小 二 加载图片OOM异常 解决办法 其中big.jpg是一张21.2MB的高清图 public c ...

  8. 通过python将xml文件转换成html文件

    #数据类型的转换 def main():    maxwidth = 100  #用于规范字段的长度    print_start()    count=0    while True:        ...

  9. [工具]chrome添加crx扩展程序(附禁止复制破解扩展)

    Hello亲爱的观众朋友们大家好,我是09. 今天带来墙内用户安装chrome插件的方法. 1.打开扩展程序 2.把crx往里拖,欧了. ps.顺带安利chrome禁止复制破解扩展Enable Cop ...

  10. MD5加密--项目案例

    在项目中最尝使用MD5这种非对称加密的就是用户信息登录了.下面我就以一个简单的登录案例来说明MD5的用法 首先来看几张图: 用户登录页:需要选择要登录的系统,同时输入用户的用户名和密码,验证码才能进入 ...