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

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

下面先让我们看看它和 var 之间用法的不同

 {

   var a = 10;

   let b = 8;

 }

 a  //10

 b  // Referenceerror :b is not defined

上面在代码块中声明了两个变量并分别赋值输出到控制台,结果a的变量成功输出,b的输出结果产生了报错。可见,let声明的变量只在它所在的代码块中产生作用。同时,我们也能想到它最好的使用方法就是在for循环中使用。

下面我们再举个例子来观察它与 var 之间的区别:

  var a = [ ]

  for(var i = 0;i<6; i++){

    a[i] = function(){

      console.log(i);

    }

  }

  console.log("i的值:",i);

  a[ 4 ]( );

  它的输出结果为:

    i 的值:6

    6

  为什么是 6 呢?一开始我也被吓懵逼了,这有悖于我的常识,以往没注意到的地方,居然这么的low。在我的意识里结果应该 4,而不是 6 。我想了很久也想不明白,以我这种小白的技术,自然是很难搞懂这种资深技术宅的问题。所以,我查了很多资料来解决这个问题,才搞明白。

  在for里用 var 声明的 i 是全局变量,在循环外部也可以访问到,在循环体内每次循环都给 i 重新赋一次值,而 i 却是属于全局的,外部的 i 值最终是 6 ,数组 a[ ]指向的 i 始终都是同一个 i,当循环结束时 a [ ] 函数内部的 i 就是最终 i 的结果  6。

  如果使用let,声明的变量只在当前代码块中起作用

    

  var a = [ ]

  for(let i = 0;i<6; i++){

    a[i] = function(){

      console.log(i);

    }

  }

  console.log("i的值:",i);

  a[ 4 ]( );

 它的输出结果为:

    i 的值:6

    5

  上面代码中,变量i是let声明的,当前的i只在本轮循环有效,所以每一次循环的i其实都是一个新的变量,所以最后输出的是5。你可能会问,如果每一轮循环的变量i都是重新声明的,那它怎么知道上一轮循环的值,从而计算出本轮循环的值?这是因为 JavaScript 引擎内部会记住上一轮循环的值,初始化本轮的变量i时,就在上一轮循环的基础上进行计算。

原文地址:https://www.cnblogs.com/bigharbour/p/11399263.html

时间: 2024-08-26 20:42:40

ES6新增关键字let与var的区别的相关文章

ES6:let和var的区别

let是es6新增的命令,其用法和var差不多,但是还是有些区别的. 一.let是块级命令,var不是块级命令 { let a = 1; var b = 2; } console.log(a); // ReferenceError: a is not defined console.log(b); // 2 同时在代码块里面声明a和b,但是在外面访问的时候只能访问b,说明let的作用域只是在块级里面,用let声明变量可以防止变量泄漏. 在for的循环遍历中就适合用let命令了 for (let

ES6 新增语法

为什么是 ES6 每一次标准的诞生都意味着语言的完善,功能的加强, JavaScript 语言本身也有一些令人不满意的地方 变量提升特性增加了程序运行时的不可预测性 语法过于松散,实现相同的功能,不同的人可能会写出不同的代码 ES6 新增语法 let ES6 中新增的用于声明变量的关键字 let 声明的变量只在所处的块级有效 防止循环变量变成全局变量 不存在变量提升 暂时性死区 和 let 所在的块级区域进行绑定 注意:使用 let 关键字声明的变量才具有块级作用域,使用 var 声明的变量不具

ES6新增—新增循环、箭头函数

5.新增循环: 以前for循环,for in循环 ES6新增循环: for of 循环:遍历(迭代,循环)整个对象,变现类似于for in 循环 两者的区别: for in循环:既可以循环数组,又可以循环json 循环数组:i代表数组的索引 var arr1=['apple','banana','appel','orange']; for(var i in arr1){ console.log(i); //0,1,2,3 } 循环json:name代表json的索引 var json=[a:'a

前端面试题:JS中的let和var的区别

最近很多前端的朋友去面试被问到let和var的区别,其实阮一峰老师的ES6中已经很详细介绍了let的用法和var的区别.我简单总结一下,以便各位以后面试中使用. ES6 新增了let命令,用来声明局部变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效,而且有暂时性死区的约束. 先看个var的常见变量提升的面试题目: 题目1: var a = 99; // 全局变量a f(); // f是函数,虽然定义在调用的后面,但是函数声明会提升到作用域的顶部. console.l

ECMAScript简介以及es6新增语法

ECMAScript简介 ECMAScript与JavaScript的关系 ECMAScript是JavaScript语言的国际化标准,JavaScript是ECMAScript的实现.(前者是后者的规格,后者是前者的实现.但通常两者是可互换的.) ESMAScript的历史 1996年11月,Netscape公司将Js提交给国际化标准组织ECMA,当初该语言能够成为国际化标准. 1997年,ECMAScript 1.0版本推出.(在这年,ECMA发布262号标准文件(ECMA-262)的第一版

【ES6新增语法详述】 &#210864;

目录 1. 变量的定义 let const 2. 模版字符串 3. 数据解构 4. 函数扩展 设置默认值 箭头函数 5. 类的定义 class 6. 对象的单体模式 原文: http://blog.gqylpy.com/gqy/275 "@ ES6新增了关于变量的定义,函数扩展,数据结构,类,模块等概念,本文将详细介绍常用的ES6语法. *** 1. 变量的定义 let ES6中新增了let语法,用来声明变量,用法类似var. ==let定义的变量只在当前代码块内有效.== 如下示例: <

ES6 新增的一些特性

1. let关键字 (1)基本用法:let关键字用来声明变量,它的用法类似于var,都是用来声明变量. (2)块级作用域:let声明的变量,只在let关键字所在的代码块内有效. { var a = 10; let b = 10; } console.log(a); //10 console.log(b); //error: b is not defined var c = 10; { var c = 20; } console.log(c); //20 var d = 10; { let d =

ES6新增语法总结

Array.prototype.keys():返回以索引值为遍历器的对象 1.Let 和 Const 在ES6以前,JS只有var一种声明方式,但是在ES6之后,就多了let跟const这两种方式.用var定义的变量没有块级作用域的概念,而let跟const则会有,因为这三个关键字创建是不一样的   var let const 变量提升 + - - 全局变量 + - - 重复赋值 + + - 重复声明 + - - 暂时死区 - + + 块作用域 - + + 只声明不赋值 + + - 2.类(Cl

【转载】在Javascript中 声明时用&quot;var&quot;与不用&quot;var&quot;的区别

原文链接:http://www.2cto.com/kf/201204/128406.html[侵删] Javascript声明变量的时候,虽然用var关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种方式还是有区别的 Javascript声明变量的时候,虽然用var关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种方式还是有区别的.可以正常运行的代码并不代表是合适的代码. var num = 1: 是在当前域中声明变量. 如果在方法中声明,则为局部变量(local var