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


Posted in Javascript onJanuary 12, 2020

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 相关文章推荐
网易JS面试题与Javascript词法作用域说明
Nov 09 Javascript
Jqyery中同等与js中windows.onload的应用
May 10 Javascript
用jQuery中的ajax分页实现代码
Sep 20 Javascript
javaScript 利用闭包模拟对象的私有属性
Dec 29 Javascript
js 验证密码强弱的小例子
Mar 21 Javascript
jQuery中not()方法用法实例
Jan 06 Javascript
js实现仿MSN带关闭功能的右下角弹窗代码
Sep 04 Javascript
JavaScript中使用数组方法汇总
Feb 16 Javascript
Bootstrap3制作图片轮播效果
May 12 Javascript
Boostrap栅格系统与自己额外定义的媒体查询的冲突问题
Feb 19 Javascript
vue中v-cloak解决刷新或者加载出现闪烁问题(显示变量)
Apr 20 Javascript
Vue中使用vux配置代码详解
Sep 16 Javascript
js 计数排序的实现示例(升级版)
Jan 12 #Javascript
JS实现动态无缝轮播
Jan 11 #Javascript
原生js实现无缝轮播图
Jan 11 #Javascript
JS实现轮播图效果
Jan 11 #Javascript
js实现带搜索功能的下拉框
Jan 11 #Javascript
js实现select下拉框选择
Jan 11 #Javascript
js实现二级联动简单实例
Jan 11 #Javascript
You might like
用PHP制作静态网站的模板框架
2006/10/09 PHP
其他功能
2006/10/09 PHP
phpMyAdmin自动登录和取消自动登录的配置方法
2014/05/12 PHP
PHP给文字内容中的关键字进行套红处理
2016/04/12 PHP
php防止表单重复提交实例讲解
2019/02/11 PHP
一个JS翻页效果
2007/07/23 Javascript
js 关于=+与+=日期函数使用说明(赋值运算符)
2011/11/15 Javascript
JS连连看源码完美注释版(推荐)
2013/12/09 Javascript
js jquery分别实现动态的文件上传操作按钮的添加和删除
2014/01/13 Javascript
原生javascript模仿win8等待提示圆圈进度条
2014/04/24 Javascript
angular.foreach 循环方法使用指南
2015/01/06 Javascript
深入理解JavaScript系列(48):对象创建模式(下篇)
2015/03/04 Javascript
javascript高级编程之函数表达式 递归和闭包函数
2015/11/29 Javascript
微信小程序 loading 详解及实例代码
2016/11/09 Javascript
Angular JS 生成动态二维码的方法
2017/02/23 Javascript
JS实现新建文件夹功能
2017/06/17 Javascript
React服务端渲染(总结)
2017/07/01 Javascript
node.js部署之启动后台运行forever的方法
2018/05/23 Javascript
vuex页面刷新后数据丢失的方法
2019/01/17 Javascript
vue如何实现自定义底部菜单栏
2019/07/01 Javascript
js canvas实现五子棋小游戏
2021/01/22 Javascript
探索Python3.4中新引入的asyncio模块
2015/04/08 Python
详细解读Python中解析XML数据的方法
2015/10/15 Python
Python实现定时任务
2017/02/08 Python
Pycharm学习教程(1) 定制外观
2017/05/02 Python
Django中的Model操作表的实现
2018/07/24 Python
Django框架之登录后自定义跳转页面的实现方法
2019/07/18 Python
Python MOCK SERVER moco模拟接口测试过程解析
2020/04/13 Python
python3实现语音转文字(语音识别)和文字转语音(语音合成)
2020/10/14 Python
TUMI澳大利亚网站:美国旅行箱包品牌
2017/03/27 全球购物
英国PC组件和在线电脑商店:SCAN
2019/04/18 全球购物
新年寄语大全
2014/04/12 职场文书
端午节活动总结
2014/08/26 职场文书
法人授权委托书
2014/09/16 职场文书
个人学习总结范文
2015/02/15 职场文书
Django使用channels + websocket打造在线聊天室
2021/05/20 Python