以for循环的方式了解var与let的区别
var是ES5定义变量的一种声明方式。
let是ES6定义变量的一种声明方式---可定义局部变量,即定义块级作用域。
- 以下列简单的函数进行表现二者作用域的不同
在ES6之前,我们都是用var来声明变量,而且JS只有函数作用域和全局作用域,没有块级作用域,所以{}限定不了var声明变量的访问范围。
{
var i=0
}
console.log(i) //输出0
ES6新增的let,可以声明块级作用域的变量。
{
let i=0
}
console.log(i) //输出“Uncaught ReferenceError: i is not defined”以简单
- 以简单示例表现二者提升变量的不同
因为变量被提升了,但是输出在赋值之前,所以,未找到aicoder的值,输出“undefined”
console.log(aicoder); // “undefined”
var aicoder = 'aicoder.com'
在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”。
console.log(aicoder); // 错误:Uncaught ReferenceError: Cannot access 'aicoder' before initialization
let aicoder = 'aicoder.com'; // 这之后就可以安全使用aicoder
- 与for循环的独特应用
for (var i = 0; i < 5; i++) {
setTimeout(() => {
console.log("var", i)
}, 1000)
}
输出:一秒后,输出5个5
因为var,导致最后i成为5
函数执行顺序:
->开始同步
->for循环5次,并向异步中推5个timeout函数
->同步结束
->开始异步
->同时开始执行5个timeout函数(因为i是全局变量,所以,外部for循环结束时,i为5,则timeout函数i也发生变化,变为5)
->异步结束
->打印结果:一秒后,同时输出5个5
---------------------------------------------------------------------------------
for (let i = 0; i < 5; i++) {
setTimeout(() => {
console.log("let", i)
}, 1000)
}
输出:一秒后,同时输出01234
因为let,let限制了参数作用域
函数执行顺序:
->开始同步
->for循环5次,并向异步中推5个timeout函数
->同步结束
->开始异步
->同时开始执行5个timeout函数(虽然i在变化,但传入timeout函数的i已经拥有了块作用域,所以并不会因为外部的改变而改变)
->异步结束
->打印结果:一秒后,同时输出01234
---------------------------------------------------------------------------------
ES6的let让js真正拥有了块级作用域,也是向这更安全更规范的路走,虽然加了很多约束,但是都是为了让我们更安全的使用和写代码。
以for循环的方式了解var与let的区别的更多相关文章
- JavaScript的几种循环使用方式及性能解析
循环的类型 一:for var arr = [1, 2, 3, 4, 5, 6]; for (var i = 0, len = arr.length; i < len; i++) { conso ...
- ArrayList和LinkedList的几种循环遍历方式及性能对比分析(转)
主要介绍ArrayList和LinkedList这两种list的五种循环遍历方式,各种方式的性能测试对比,根据ArrayList和LinkedList的源码实现分析性能结果,总结结论. 通过本文你可以 ...
- ArrayList和LinkedList的几种循环遍历方式及性能对比分析
最新最准确内容建议直接访问原文:ArrayList和LinkedList的几种循环遍历方式及性能对比分析 主要介绍ArrayList和LinkedList这两种list的五种循环遍历方式,各种方式的性 ...
- ArrayList和LinkedList的几种循环遍历方式及性能对比分析(转载)
原文地址: http://www.trinea.cn/android/arraylist-linkedlist-loop-performance/ 原文地址: http://www.trinea.cn ...
- HashMap循环遍历方式及其性能对比(zhuan)
http://www.trinea.cn/android/hashmap-loop-performance/ ********************************************* ...
- HashMap循环遍历方式及其性能对比
主要介绍HashMap的四种循环遍历方式,各种方式的性能测试对比,根据HashMap的源码实现分析性能结果,总结结论. 1. Map的四种遍历方式 下面只是简单介绍各种遍历示例(以HashMap为 ...
- 【转】ArrayList和LinkedList的几种循环遍历方式及性能对比分析
原文网址:http://www.trinea.cn/android/arraylist-linkedlist-loop-performance/ 主要介绍ArrayList和LinkedList这两种 ...
- Java 集合 ArrayList和LinkedList的几种循环遍历方式及性能对比分析 [ 转载 ]
Java 集合 ArrayList和LinkedList的几种循环遍历方式及性能对比分析 @author Trinea 原文链接:http://www.trinea.cn/android/arrayl ...
- jQuery中的for循环var与let的区别
今天在写jQuery请求接口中发现一个问题: 在用AJAX发送请求中又嵌套了一个AJAX请求,发现在内层请求的success中对第一次success中的循环变量 i 无法获取,具体代码如下: $.aj ...
随机推荐
- 该内存不能read 或written数值 叙述(居然还有具体的讲究)
该内存不能read 或written数值 叙述 0 0x0000 作业完成. 1 0x0001 不正确的函数. 2 0x0002 系统找不到指定的档案. 3 0x0003 系统找不到指定的路径. 4 ...
- 获得QQ聊天输入框中的内容
// 首先得到输入框的句柄.通过spy++这类工具分析,聊天窗体的类名为“#32770”// 但当前系统里不只一个类名为“#32770”的窗体,这就需要全体遍历一次.// 类名为“#32770”标题含 ...
- Golang环境搭建,Notepad++配置Golang开发环境,Golang发送邮件
http://blog.csdn.net/u011012932/article/details/53102264 http://blog.csdn.net/u011012932/article/det ...
- DataVeryLite入门教程(一) 配置篇
DataVeryLite 是基于.net 4.0的数据库持久化ORM框架. 目前支持的数据库有Sqlserver,Mysql,Oracle,Db2,PostgreSql,Sqlite和Access. ...
- Kafka基本概念介绍
Kafka官方介绍:Kafka是一个分布式的流处理平台(0.10.x版本),在kafka0.8.x版本的时候,kafka主要是作为一个分布式的.可分区的.具有副本数的日志服务系统(Kafka™ is ...
- Zookeeper详解-概述(一)
ZooKeeper是一种分布式协调服务,用于管理大型主机.在分布式环境中协调和管理服务是一个复杂的过程.ZooKeeper通过其简单的架构和API解决了这个问题.ZooKeeper允许开发人员专注于核 ...
- 18 HTML标签以及属性全
基本结构标签: <HTML>,表示该文件为HTML文件 <HEAD>,包含文件的标题,使用的脚本,样式定义等 <TITLE>---</TITLE>,包含 ...
- 【UVA - 11624】Fire!
-->Fire! 直接上中文 Descriptions: 乔在迷宫中工作.不幸的是,迷宫的一部分着火了,迷宫的主人没有制定火灾的逃跑计划.请帮助乔逃离迷宫.根据乔在迷宫中的位置以及迷宫的哪个方块 ...
- java源码解析之String类(三)
上一节我们主要讲了String类的一些不是很常用的方法,其中需要掌握的如下,我就不再赘述了 public int length() public boolean isEmpty() public by ...
- Python初探-基础篇
python和其他语言其实是相似的,如果你会了另一门语言,那学习这个语言,会很快上手 1.mac下自带的有python,版本为2.7.0(可以用home brew python3 安装最新版本的pyt ...