来源自:http://www.jstips.co/zh_cn/javascript/keyword-var-vs-let/

特此做个笔记

概述

  • 通过 var 定义的变量,它的作用域是在 function 或任何外部已经被声明的 function,是全域的 。
  • 透過 let 定义的变量,它的作用域是在一個块(block)。
function varvslet() {
console.log(i); // i 是 undefined 的,因为变量提升
// console.log(j); // ReferenceError: j 没有被定义 for( var i = 0; i < 3; i++ ) {
console.log(i); // 0, 1, 2
}; console.log(i); // 3
// console.log(j); // ReferenceError: j 没有被定义 for( let j = 0; j < 3; j++ ) {
console.log(j);
}; console.log(i); // 3
// console.log(j); // ReferenceError: j 没有被定义
}

详细的区别

  • 变量提升

    let 不會被提升到整个块的作用域。相比之下,var 可以被提升。

  console.log(c); // undefined。因为变量提升
var c = 2;
  console.log(b); // ReferenceError: b 没有被定义
let b = 3;

循环中的闭包

let 在每次循环可以重新被 bind,确保在它之前结束的循环被重新赋值,所以在闭包中它被用來避免一些问题。

for (var i = 0; i < 5; ++i) {
setTimeout(function () {
console.log(i); // 输出 '5' 五次
}, 100);
}
使用 let 替换 var
// print 1, 2, 3, 4, 5
for (let i = 0; i < 5; ++i) {
setTimeout(function () {
console.log(i); // 输出 0, 1, 2, 3, 4
}, 100);
}

我们应该用 let 替代 var 嗎?

不是的,let 是新的块作用域。语法强调在 var 已经是区块作用域时時,let 应该替换 var ,否则请不要替换 varlet 改善了在 JS 作用域的选项,而不是取代。var 对于变量依旧是有用的,可被用在整個 function 之中。

let 兼容性

  • 在 server 端,比如 Node.js,你现在可以安心的使用 let

  • 在 client 端,通过 transpiler(比如 Traceur),可以安心的使用 let 语法。否则请在这里确认你的浏览器是否支持。



var和ES6的let的更多相关文章

  1. 关于var和ES6中的let,const的理解

    var的作用就不多说了,下面说说var的缺点: 1.var可以重复声明 var a = 1; var a = 5; console.log(a); //5 不会报错 在像这些这些严谨的语言来说,一般是 ...

  2. 关于ES6的let,const与var之间的三生三世

    首先需要明确的是let.const.var都是用来定义变量的 在ES6之前,我们一般都用var来定义变量,例如 : function test(){ var i=1; console.log(i); ...

  3. ES6 基础知识

    let:用来定义变量特点:只能在代码块里面使用,let拥有块级作用域;并且let不允许重复声明; 比如: var a = 12; var a = 5; alert(a); //5; let a = 1 ...

  4. 关于ES6的数组字符串方法

    注:ES6的一些新属性会显示语法错误,不过不会影响效果,在Languages里面也可以调: let:用来定义变量 特点:只能在代码块里面使用,let拥有块级作用域;并且let不允许重复声明;比如: v ...

  5. 关于var、let、const的故事

    对于一门编程语言来说,变量与常量是再正常不过的两种,JavaScript是一直解释型的弱类型语言. JavaScript中变量或者常量可以用var.let.const(后两者是ES6的新特性). 1. ...

  6. 重开ES6

    一.ES6的开发环境搭建 现在的Chrome浏览器已经支持ES6了,但是有些低版本的浏览器还是不支持ES6的语法,这就需要我们把ES6的语法自动的转变成ES5的语法. 1.建立工程目录: 先建立一个项 ...

  7. var和const和let的区别

    简述: 1.前端的变量申明,可以用到var,ES6的const(衡量)/let(变量) 2.在ES5用的都是var,到ES6之后,也就是2015年开始出现const/let. var 不会报错,有声明 ...

  8. ES6系列_2之新的声明方式

    在ES5中我们在声明时只有一种方法,就是使用var来进行声明,ES6对声明的进行了扩展,现在可以有三种声明方式. (1)var:它是variable的简写,可以理解成变量的意思. (2)let:它在英 ...

  9. ES6学习随笔--字符串模板、解构赋值、对象、循环、函数、Promise、Generrator

    在线编译器:babel.github 在nongjs中使用 'use strict' let a = ; 运行node : node --harmony_destructuring xxx.js 代码 ...

随机推荐

  1. CountDownLatch &amp; CyclicBarrier源代码实现解析

    CountDownLatch CountDownLatch同意一条或者多条线程等待直至其他线程完毕以系列的操作的辅助同步器. 用一个指定的count值对CountDownLatch进行初始化. awa ...

  2. [Recompose] Refactor React Render Props to Streaming Props with RxJS and Recompose

    This lesson takes the concept of render props and migrates it over to streaming props by keeping the ...

  3. PCL ubuntu-12.04

    1.apt-get install build-essential cmake cmake-qt-gui 2.sudo add-apt-repository ppa:v-launchpad-joche ...

  4. 51Nod 1405 树的距离之和(dp)

    1405 树的距离之和 基准时间限制:1 秒 空间限制:131072 KB 分值: 40 难度:4级算法题  收藏  关注 给定一棵无根树,如果它有n个节点,节点编号从1到n, 求随意两点之间的距离( ...

  5. 跨域post 及 使用token防止csrf 攻击

    环境: 后台使用的python - flask 前台使用angular框架 1.一个跨域post的样例: 跨域post有多种实现方式: 1.CORS:http://blog.csdn.net/hfah ...

  6. AndroidTouchEvent总结

    默认状态 布局文件 <?xml version="1.0" encoding="utf-8"?> <com.malinkang.touchsa ...

  7. Windows系统的关机、休眠和睡眠状态究的区别

    原文:Windows系统的关机.休眠和睡眠状态究的区别 相信有些小伙伴跟我一样,对电脑的一些常用操作或名词不太熟悉,今天我们就简单来聊聊电脑的关机.休眠和睡眠状态究竟有何区别吧! 如果你在电脑左下角的 ...

  8. LRJ入门经典-0907万圣节的小L306

    原题 LRJ入门经典-0907万圣节的小L306 难度级别:B: 运行时间限制:1000ms: 运行空间限制:256000KB: 代码长度限制:2000000B 试题描述 今天是万圣节,小L同学开始了 ...

  9. Top 16 Java 应用类 - 这些功能再也不用自己写了

    Java中有很多应用类.这些类定义静态方法能够解决非常多常见的问题.以下是通过5万个开源项目统计得到的最热门的16个应用类. 类按热门程序排列.类的方法也是按热门程序排序. 浏览这个类能够看看有哪些功 ...

  10. 解决QML开发中ComboBox中一个已选择项没有清除的问题

    解决QML开发中ComboBox中一个已选择项没有清除的问题 近期使用QML开发一个项目.须要使用ComboBox进行显示.当进行一个操作时,须要向ComboBox加入一个元素,当进行另外一个操作时. ...