JavaScript中var与let的异同点
var是JavaScript刚出现时就存在的变量声明关键字,而let作为ES6才出现的变量声明关键字,无疑两者之间存在着很大的区别。那么具体有哪些区别呢?
1.作用域表现形式不同,var是函数作用域,let是块级作用域
{
var monkey='熏悟空';
let pig='猪扒盖';
}
console.log(monkey); //输出undefined
console.log(pig); //报错:pig is not deined
由上面代码可见,let声明的变量只在其所在的代码块有效,在代码块外部无效无法访问,而var声明的变量在该代码块所在的函数作用域内都有效。
2.是否变量提升的区别,var声明的变量会进行变量提升,let声明的变量不会进行变量提升。
console.log(monkey); //undefined
var monkey='熏悟空'; console.log(pig); //报错:pig is not defined
let pig='猪扒盖';
同样的逻辑,为什么var声明的变量在它声明之前调用会显示未定义,而let声明的变量在声明之前调用会抛出异常呢,这就是两者在变量提升上的区别,var声明的变量存在变量提升,let声明的变量不存在变量提升。
那么什么叫变量提升呢,我这里不做概念性的描述,我只说我个人的理解,就是以上代码实际上相当于如下:
var monkey; console.log(monkey); //undefined
monkey='熏悟空'; console.log(pig); //报错:pig is not defined
let pig='猪扒盖';
看见区别了吗,var声明的变量会将声明的变量提取到作用域的最上面进行定义但不赋值,赋值操作还是在你的代码处,所以你在调用var声明的变量时就是一个已经声明但是并未定义值的变量,所以调用结果就是undefined,这就是所谓的变量提升。而let定义的变量不存在这种变量提升。
3.暂时性死区上的区别
暂时性死区:如果在某一作用域内let了一个变量,如果外部作用域中有相同名称的变量,那么就算在作用域内进行了更改,也不会影响到外部作用域
具体表现如下:
for(var i=0;i<5;i++){
setTimeout(function(){
console.log(i)
},1000)
}
for(let i=0;i<5;i++){
setTimeout(function(){
console.log(i)
},1000)
}
请问这两处代码的运行结果分别是什么?
第一处代码运行完毕的结果是1s后顺序打印5个5;第二处代码运行完毕的结果是1s后顺序打印0,1,2,3,4。
请问为什么会存在这种区别?
因为第一处代码的变量i由var关键字声明,不存在关键性死区,即你在1s后setTimeout中访问到的变量i是全局上下文中for循环运行完毕之后的i,所以打印的结果全是5;
而第二处代码的变量i由let关键字声明,产生了关键性死区,存在setTimeout中的i变量是你当时存储时的i的值,这个存储区间的i不会因为外面有相同的i变量且赋了不同的值而改变,他依旧是之前存储进去的值,这就是暂时性死区的表现,也是为什么第二处代码运行完毕是顺序打印0,1,2,3,4的原因。
4.在同一个上下文中var可以重复声明,let不行
let monkey='熏悟空';
let monkey='逼马吻'; //报错:Identifier 'a' has already been declared
var pig='猪扒盖';
var pig='猪肛裂'; //正常访问,变量pig的值被替换
JavaScript中var与let的异同点的更多相关文章
- JavaScript中var和this定义变量的区别
JavaScript中var和this定义变量的区别 在js中声明变量时可以使用var和this,但使用this的有很大一部分参考书是没有的,经过查阅相关资料总结如下: 用var和this声明变量,存 ...
- javascript中var let const三种变量声明方式
javascript中var let const三种变量声明方式 1.var ①var表示声明了一个变量,并且可以同时初始化该变量. ②使用var语句声明的变量的作用域是当前执行位置的上下文:一个函 ...
- JavaScript中var关键字的使用详解
作用 声明作用:如声明个变量. 语法 ? 1 var c = 1; 省略var 在javascript中,若省略var关键字而直接赋值,那么这个变量为全局变量,哪怕是在function里定义的. ? ...
- JavaScript中var、let和const的区别(转载)
一.前言 在ES6(ES2015)出现之前,JavaScript中声明变量就只有通过 var 关键字,函数声明是通过 function 关键字,而在ES6之后,声明的方式有 var . let . c ...
- javascript中var、let和const的区别
在javascript中,var.let和const都可以用来声明变量,那么三者有什么区别呢?要回答这个问题,我们可以从先想想:三种不同的声明会影响变量的哪些方面?这些方面也就是变量的特性,那么变量有 ...
- javascript中对象和数组的异同点
一.JS声明对象或数组 JS对象:{ } JS数组:[ ] 对象 var b={m:'123',n:'abc'};alert(b.m);alert(b.n); 一维数组 var a=[1,2,3];a ...
- javascript中var that=this
在JavaScript中,this代表的是当前对象. $(‘#conten').click(function(){ //this是被点击的#conten var that = this; $(‘.co ...
- javascript中var、let、const的区别
这几天修改别人的js,发现声明变量有的用var,有的用let,那它们有什么区别呢? javascript中声明变量的方式有:var.let.const 1.var (1)作用域: 整个函数范围内,或者 ...
- JavaScript中var a=b=c=d的小发现
看了别人的博客随手记录下 先看一下以下的代码 var a=1,b=2,c=3; (function(){ var a=b=1; })(); console.log(a); console.log(b) ...
随机推荐
- Android DataBinding使用详解
简介 DataBinding是一个自动绑定UI的框架. 使用DataBinding需要在app根目录的build.gradle文件中加入DataBinding配置: android { .... da ...
- Myod 选做
一.题目要求 1.复习c文件处理内容 2.编写myod.c 用myod XXX实现Linux下od -tc -tx XXX的功能 3.main与其他分开,制作静态库和动态库 4.编写Makefile ...
- hdu 5108 Alexandra and Prime Numbers(水题 / 数论)
题意: 给一个正整数N,找最小的M,使得N可以整除M,且N/M是质数. 数据范围: There are multiple test cases (no more than 1,000). Each c ...
- Go语言核心36讲(Go语言进阶技术十二)--学习笔记
18 | if语句.for语句和switch语句 现在,让我们暂时走下神坛,回归民间.我今天要讲的if语句.for语句和switch语句都属于 Go 语言的基本流程控制语句.它们的语法看起来很朴素,但 ...
- Fiddler抓包工具学习及使用
一.Fiddler工作原理 Fiddler是位于客户端和服务器端之间的代理,客户端发送请求,fiddler会拦截该请求,再转发到服务器端,服务器端处理请求做出的响应,也要被fiddler拦截,fidd ...
- 【.NET 与树莓派】用 MPD 制作数字音乐播放器
树莓派的日常家居玩法多多,制作一台属于自己的数字音乐播放机是其中的一种.严格上说,树莓派是没有声卡的,其板载的 3.5 mm 音频孔实际是通过 PWM 来实现音频输出的(通过算法让PWM信号变成模拟信 ...
- SpringCould | Nacos与Feign
服务注册Nacos 介绍 概念 一个更易于构建云原生应用的动态服务发现.配置管理和服务管理平台. Nacos: Dynamic Naming and Configuration Service Nac ...
- webpack 之开发环境优化 HMR
webpack 之开发环境优化 HMR // webpack.config.js /** * HMR hot module replacement 热模块替换 / 模块热替换 * 作用:一个模块发生变 ...
- [linux]centos7.4部署django+Uwsgi+Nginx
前言:我已经写了几个接口用来部署在服务器上的,首先选择django+Uwsgi+Nginx因为配置简单,比较符合python的简单操作功能强大的特点 然后对于django的一些版本在之前的文章写了 参 ...
- python datetime 增减以月为单位的时间段
datetime.timedelta(days=10) # 可以 datetime.timedelta(months=1) # 不可以 替代: from datetime import date ...