ES6之前javascript只有全局作用域和函数作用域,所以经常会遇到变量提升了或者使用闭包的时候出错的问题。

所有a[i]都会输出10

var arr=[];
for (var i=0;i<10;i++){
arr[i]=function(){
console.log(i);
};
}

变量提升,输出undefined

function showName(){
console.log(name);
var name = "Jhon";
}

ES6引入了let和const关键字,从而使javascript像其他语言一样拥有了块级作用域。没有其他语言编程经验的或者由于长期使用ES5编码的习惯问题,有一些细节的地方仍然需要注意一下。

首先说一下let:

let让变量具有了块级作用域,像这样就不会共享变量i,而是输出0-9的数字。

let arr=[];
for (let i=0;i<10;i++){
arr[i]=function(){
console.log(i);
};
}

使用let需要注意:

  • 使用let申明的变量具有块级作用域,即变量声明前后的{}。
  • let声明的全局变量不是全局对象的属性,不可通过window.变量名访问,理论上存在于一个顶级的js代码块中。
  • 形如for ( let  i=0....)的循环再每次迭代时都为i创建新的绑定。所以循环中如果有一个闭包,那么闭包将捕获一个循环值的不同副本,不会共享一个变量。
  • let声明的变量直到控制流到达该变量定义的位置时才被装载,所以到达之前使用会触发错误,即不能先使用后声明。
  • 用let重复声明一个变量会发生语法错误。

const常量:


const和和let类似,只是const声明的变量只可以在声明时赋值,不可随意修改,不然会报错

const MAX_SIZE = 300; //正确
MAX_SIZE = 200; //错误

其他注意事项和let一样


ES6 let和const详解及使用细节的更多相关文章

  1. es6的promise用法详解

    es6的promise用法详解 promise 原理 promise是es6的异步编程解决方案, 是es6封装好的对象: 一个promise有三种状态:Pending(进行中).Resolved(已完 ...

  2. const详解

    详解C++中的const关键字

  3. [js高手之路] es6系列教程 - var, let, const详解

    function show( flag ){ console.log( a ); if( flag ){ var a = 'ghostwu'; return a; } else { console.l ...

  4. ES6中let和const详解

    let和var一样也是用来定义变量,不同之处在于let是块级作用域,只在所定义的块级作用域中生效,一个花括号便是一个块级作用域 {var a="我是var定义的";let b=&q ...

  5. let与const详解

    在ES6中,js首次引入了块级作用域的概念,而什么是块级作用域? 众所就知,在js当中存在预解析的概念,就是变量提升.并且只存在全局作用域和私有作用域.在全局定义的变量就是全局变量,而在函数内部定义的 ...

  6. ES6中的Promise详解

    Promise 在 JavaScript 中很早就有各种的开源实现,ES6 将其纳入了官方标准,提供了原生 api 支持,使用更加便捷. 定义 Promise 是一个对象,它用来标识 JavaScri ...

  7. C++中的指针(*)、引用(&)、const详解(一、定义变量)

    一.前言 本人作为一个工作了5年的程序员,程序生涯最初是从c/c++开始的,但是始终不能很熟悉的理解c语言中的指针和c++中的引用,归其原因,一部分自己没有静下心来思考,一部分原因是其自身的复杂性. ...

  8. 05 ES6模块化规范基础详解

    ES6模块规范 1.1 ES6规范说明 历史上,JavaScript 一直没有模块(module)体系,无法将一个大程序拆分成互相依赖的小文件,再用简单的方法拼装起来.其他语言都有这项功能,比如 Ru ...

  9. ES6之let命令详解

    let与块级作用域 { var foo='foo'; let bar='bar'; } console.log(foo,'var'); //foo varconsole.log(bar ,'bar') ...

随机推荐

  1. 验证整数 Double 转 int 两种写法

    Double  转int 1)之前一直是使用强转 Double num = Double.parseDouble(object.toString());   int n = (int)num;   i ...

  2. vue 2 使用Bus.js进行兄弟(非父子)组件通信 简单案例

    vue2中废弃了$dispatch和$broadcast广播和分发事件的方法.父子组件中可以用props和$emit().如何实现非父子组件间的通信,可以通过实例一个vue实例Bus作为媒介,要相互通 ...

  3. String.getBytes(),源码之下,了无秘密

    @Deprecated public void getBytes(int srcBegin, int srcEnd, byte dst[], int dstBegin) { if (srcBegin ...

  4. vue实例讲解之axios的使用

    本篇来讲解一下axios插件的使用,axios是用来做数据交互的插件. 这篇将基于vue实例讲解之vue-router的使用这个项目的源码进行拓展. axios的使用步骤: 1.安装axios npm ...

  5. struts jar包

    这些错误很让我摸不着头脑,经多方查阅资料后,在Struts 2.2.x中应该导入如下7个JAR文件 1)   commons-fileupload-1.2.1.jar 2)   commons-io- ...

  6. Python数据分析(二): Numpy技巧 (1/4)

    In [1]: import numpy numpy.__version__ Out[1]: '1.13.1' In [2]: import numpy as np  

  7. GCD SUM 强大的数论,容斥定理

    GCD SUM Time Limit: 8000/4000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others) SubmitStatu ...

  8. margin:0px auto和text-align:center区别

    (1)margin:0px auto :作用于块级元素,对块级元素进行居中 (2)text-align:center:作用于内联元素,必须放在要居中的内联元素所在的块级元素. 例: (1) <d ...

  9. Python实战之set学习笔记及简单练习

    ['__and__', '__class__', '__contains__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__' ...

  10. asp.net中利用Jquery+Ajax+Json实现无刷新分页(二)

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="PageTest.aspx.cs ...