es6 for循环中let和var区别详解

 更新时间:2020-01-12 19:00:32   作者:佚名   我要评论(0)

let和var区别:


for(var i=0;i<5;i++){
setTimeout(()=>{
console.log(i);//5个5
},100)
}
console.log(i);//5
console.log('=============')

for(let

let和var区别:

for(var i=0;i<5;i++){
  setTimeout(()=>{
    console.log(i);//5个5
  },100) 
}
console.log(i);//5
console.log('=============')

for(let j=0;j<5;j++){
  setTimeout(()=>{
    console.log(j);//0,1,2,3,4
  },100) 
}
console.log(j);//报错 j is not defined

为什么 用let就可以显示正确结果,而var就不可以呢?

var是全局作用域,有变量提升的作用,所以在for中定义一个变量,全局可以使用,循环中的每一次给变量i赋值都是给全局变量i赋值。

let是块级作用域,只能在代码块中起作用,在js中一个{}中的语句我们也称为叫一个代码块,每次循环会产生一个代码块,每个代码块中的都是一个新的变量j;

es6中不是说let声明变量不能重复声明吗?看下边例子:

{
  let a=123;
}
{
  let a=246;
}
console.log(a);//a is not defined;
{ 
  var b=1;
}
{ 
  var b=2;
}
console.log(b);// 2;

{}代表一个块,这个时候let声明的变量只在这个块中起作用,而这个块对var声明的变量不起作用。因为var是全局作用域。

let a=1;
let a=2;
//Uncaught SyntaxError: Identifier 'a' has already been declared
//let不能重复声明

let b=1;
var b=2;

// Uncaught SyntaxError: Identifier 'a' has already been declared
//let不能重复声明


var c=3;
var c=4;
console.log(c)//4;var可以重复声明

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

您可能感兴趣的文章:

  • 详解javascript中var与ES6规范中let、const区别与用法
  • 简述ES6新增关键字let与var的区别
  • ES6深入理解之“let”能替代”var“吗?
  • JavaScript ES6中const、let与var的对比详解
  • JS变量中有var定义和无var定义的区别以及es6中let命令和const命令

相关文章

  • es6 for循环中let和var区别详解

    es6 for循环中let和var区别详解

    let和var区别: for(var i=0;i<5;i++){ setTimeout(()=>{ console.log(i);//5个5 },100) } console.log(i);//5 console.log('=============') for(let
    2020-01-12
  • python利用JMeter测试Tornado的多线程

    python利用JMeter测试Tornado的多线程

    JMeter的简介 &#8195;&#8195;JMeter是Apache组织开发的基于Java的压力测试工具。用于对软件做压力测试,它最初被设计用于Web应用测试,但后来扩展到其他测试领域。
    2020-01-12
  • Java 二分法检索算法代码实现详解

    Java 二分法检索算法代码实现详解

    一,二分法检索算法介绍 二分法检索(binary search)又称折半检索,二分法检索的基本思想是设字典中的元素从小到大有序地存放在数组(array)中。是最常用的搜索
    2020-01-12
  • Linux下PHP+Apache的26个必知的安全设置

    Linux下PHP+Apache的26个必知的安全设置

    PHP是一种开源服务器端脚本语言,应用很广泛。Apache web服务器提供了这种便利:通过HTTP或HTTPS协议,访问文件和内容。配置不当的服务器端脚本语言会带来各种各样
    2020-01-12
  • tensorflow的计算图总结

    tensorflow的计算图总结

    计算图 在 TensorFlow 中用计算图来表示计算任务。 计算图,是一种有向图,用来定义计算的结构,实际上就是一系列的函数的组合。 用图的方式,用户通过用一些简单
    2020-01-12
  • Python3.x+迅雷x 自动下载高分电影的实现方法

    Python3.x+迅雷x 自动下载高分电影的实现方法

    快要过年了,大家都在忙些什么呢?一到年底公司各种抢票,备年货,被这过年的气氛一烘,都归心似箭,哪还有心思上班啊。归心似箭=产出低下=一行代码十个错=无聊。于
    2020-01-12
  • 在微信小程序中渲染HTML内容3种解决方案及分析与问题解决

    在微信小程序中渲染HTML内容3种解决方案及分析与问题解决

    大部分Web应用的富文本内容都是以HTML字符串的形式存储的,通过HTML文档去展示HTML内容自然没有问题。但是,在微信小程序(下文简称为「小程序」)中,应当如何渲
    2020-01-12
  • ES2020 新特性(种草)

    ES2020 新特性(种草)

    这几年,Ecma TC39一年一次更新 ecmascript 规范标准,截止目前,以下特性已进入 finished 状态。现在带大家体验种草 ES2020 新特性。 一:Promise.allSettled
    2020-01-12
  • Python 实现递归法解决迷宫问题的示例代码

    Python 实现递归法解决迷宫问题的示例代码

    迷宫问题 问题描述: 迷宫可用方阵 [m, n] 表示,0 表示可通过,1 表示不能通过。若要求左上角 (0, 0) 进入,设计算法寻求一条能从右下角 (m-1, n-1) 出去的路径。
    2020-01-12
  • html2canvas属性和使用方法以及如何使用html2canvas将HTML内容写入Canvas生成图片

    html2canvas属性和使用方法以及如何使用html2canvas将HTML内容写入Canvas生成图片

    如何使用JS截取HTML页面为图片呢,下面为大家介绍一款JS截图插件html2canvas.js html2canvas.js 能够实现在用户浏览器端直接对整个或部分页面进行截屏。 html2can
    2020-01-12

最新评论