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. 【ASP.NET Core】运行原理(2):启动WebHost

    本系列将分析ASP.NET Core运行原理 [ASP.NET Core]运行原理[1]:创建WebHost [ASP.NET Core]运行原理[2]:启动WebHost [ASP.NET Core ...

  2. 开源项目CIIP(企业信息管理系统框架).2018.1.0910版更新介绍-上周工作总结

    又狂撸了一周的代码.简化了0904版本的多数操作. 上一次更新时,总共需要10步,这次简化成3步.嗯嗯,自我感觉不错. 重要的:在创建项目时,可以选择常用模块啦! 第一步:启动CIIP.Designe ...

  3. java学习(三)类、实例

    类 public class Dog{ String breed; int age; String color; void barking(){ } void hungry(){ } void sle ...

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

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

  5. 信息提示 - bootStrap4常用CSS笔记

    .alert 基类 .alert-{success.info.warning.danger.primary.secondary.light.dark} 各种类型的配色样式 .fade..show 设置 ...

  6. 【Docker】第四篇 Docker仓库管理

    一.仓库概述 仓库(Repository):Docker仓库主要用于镜像的存储,它是镜像分发.部署的关键.仓库分为公共仓库和私有仓库. 注册服务器(Registry)和仓库区别:注册服务器上往往存放着 ...

  7. NO.3_1:自学python之路------番外:第三方库安装、numpy

    引言 Python因为pip的存在,使得第三方库的发布和获取都比较方便.并且Python对跨平台的支持,使得其相较于C++,Java更加方便使用.在本文中,将会介绍在Windows中安装第三方库的方法 ...

  8. c++虚继承与虚函数

    学习继承与多态时看到这两个概念,记录整理. 虚继承与虚函数都是用virtual关键字实现,虚继承为了防止多重继承,而虚函数为了实现多态. 是几个例子. 虚继承: class A{}; class B: ...

  9. 前端_html

    目录 HTML介绍 标签说明 常用标签 <!DOCTYPE>标签 <head>内常用标签 <body>内常用标签 特殊字符 其他:各种各样的标签 HTML的规范 H ...

  10. JS进阶系列之原型、原型链

    最近在看 JavaScript忍者秘籍 这本书的时候,再加上最近遇到的关于原型.原型链的面试题,所以萌生了要把这些知识梳理一遍的想法,所以以下是我自己对原型.原型链的看法 什么是原型 提到原型,我们可 ...