var

  1. console.log(a) // undefined
  2.  
  3. var a = 1

从上述代码中我们可以发现,虽然变量还没有被声明,但是我们却可以使用这个未被声明的变量,这种情况就叫做提升,并且提升的是声明。
对于这种情况,我们可以把代码这样来看

  1. var a
  2.  
  3. console.log(a) // undefined
  4.  
  5. a = 1

接下来我们再来看一个例子

  1. var a = 10
  2.  
  3. var a
  4.  
  5. console.log(a)
  6. 对于这个例子,如果你认为打印的值为undefined那么就错了,答案应该是10,对于这种情况,我们这样来看代码
  7.  
  8. var a
  9.  
  10. var a
  11.  
  12. a = 10
  13.  
  14. console.log(a)
  15. 到这里为止,我们已经了解了var声明的变量会发生提升的情况,其实不仅变量会提升函数也会被提升。
  16. console.log(a) // ƒ a() {}
  17.  
  18. function a() {}
  19.  
  20. var a = 1
  21. 对于上述代码,打印结果会是ƒ a() {},即使变量声明在函数之后,这也说明了函数会被提升,并且优先于变量提升。
  22. 说完了这些,想必大家也知道var存在的问题了,使用var声明的变量会被提升到作用域的顶部。

接下来我们再来看letconst

  1. var a = 1
  2. let b = 1
  3. const c = 1
  4. console.log(window.b) // undefined
  5. console.log(window. c) // undefined
  6.  
  7. function test(){
  8. console.log(a)
  9. let a
  10. }
  11. test()

首先在全局作用域下使用letconst声明变量,变量并不会被挂载到window上,这一点就和var声明有了区别。
再者当我们在声明a之前如果使用了a,就会出现报错的情况, a is not defined

首先报错的原因是因为存在暂时性死区,我们不能在声明前就使用变量,这也是letconst优于var的一点。然后这里你认为的提升和var的提升是有区别的,虽然变量在编译的环节中被告知在这块作用域中可以访问,但是访问是受限制的

总结

  • 函数提升优先于变量提升,函数提升会把整个函数挪到作用域顶部,变量提升只会把声明挪到作用域顶部
  • var存在提升,我们能在声明之前使用。letconst因为暂时性死区的原因,不能在声明前使用
  • var在全局作用域下声明变量会导致变量挂载在window上,其他两者不会
  • letconst作用基本一致,但是后者声明的变量不能再次赋值

    2019-03-02  19:28:08

 

var、let 及 const 区别的更多相关文章

  1. JS中const、var 和let的区别

    今天第一次遇到const定义的变量,查阅了相关资料整理了这篇文章.主要内容是:js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始化. 1 ...

  2. let、var、const区别(表格比较)

    let.var.const区别(表格比较): 区别项 let var const 作用域 块级作用域 全局作用域或函数作用域 块级作用域 是否有变量提升 无 有 无 是否可重复声明 不可 可以 不可 ...

  3. js中三种定义变量 const, var, let 的区别

    js中三种定义变量的方式const, var, let的区别 1.const定义的变量不可以修改,而且必须初始化. 1 const b = 2;//正确 2 // const b;//错误,必须初始化 ...

  4. var和let/const的区别

    let和const是 ES6 新增的命令,用于声明变量,这两个命令跟 ES5 的var有许多不同,并且let和const也有一些细微的不同,再认真阅读了阮一峰老师的文档后,发现还是有一些不知道的细节. ...

  5. var, let ,const区别

    ES6中加入了let,const字符,先说说新的区别: 作用域:let 声明的变量只在它所在的代码块内有效,而且不存在变量提升,即变量可以在声明之前使用,值为undefined.let未声明变量前会报 ...

  6. var、let和const区别

    var.let和const区别 变量提升问题 var声明的变量存在变量提升,而let与const声明的变量不存在变量提升,但存在暂时性死区 即在预编译阶段,js引擎扫描代码时,遇到变量声明,会把var ...

  7. es6的let与es5的var定义变量的区别

    es6的let与es5的var定义变量的区别 自身新手第一次接触let关键字的时候,不知道let与var的区别,本能认为是一样,但非如此,比如下述的代码运行就会报错: let hello = 'hel ...

  8. JS的var和let的区别(详细讲解)

    let是ES6新增的,它主要是弥补var的缺陷,你也可以把let看做var的升级版.下面我就来详细讲讲var和let的区别 相同点: var和let都有函数级作用域 不同点: (1)var是全局作用域 ...

  9. 简述C#中关键字var和dynamic的区别

    C#中关键字var和dynamic的区别如下: 1.var申明的变量必须初始化,dynamic申明的变量无需初始化. 2.var关键字只能在方法内部申明局部变量,dynamic关键字可用于局部变量,字 ...

随机推荐

  1. 常见hash算法

    hash算法的意义在于提供了一种快速存取数据的方法,它用一种算法建立键值与真实值之间的对应关系,(每一个真实值只能有一个键值,但是一个键值可以对应多个真实值),这样可以快速在数组等条件中里面存取数据. ...

  2. Swift LeetCode 目录 | Catalog

    请点击页面左上角 -> Fork me on Github 或直接访问本项目Github地址:LeetCode Solution by Swift    说明:题目中含有$符号则为付费题目. 如 ...

  3. 【自然语言处理篇】--以NLTK为基础讲解自然语⾔处理的原理和基础知识

    一.前述 Python上著名的⾃然语⾔处理库⾃带语料库,词性分类库⾃带分类,分词,等等功能强⼤的社区⽀持,还有N多的简单版wrapper. 二.文本预处理 1.安装nltk pip install - ...

  4. Java进阶篇设计模式之四 -----适配器模式和桥接模式

    前言 在上一篇中我们学习了创建型模式的建造者模式和原型模式.本篇则来学习下结构型模式的适配器模式和桥接模式. 适配器模式 简介 适配器模式是作为两个不兼容的接口之间的桥梁.这种类型的设计模式属于结构型 ...

  5. Mac使用Gradle上传jar到中央仓库(最完整的采坑记录)

    前言 当我们封装完成我们自己做的工具之后,那我们肯定想要发给别人让别人来进行使用,上传到中央仓库是一种引入时最方便的选择. 网上有很多教程,但是大多都是maven和windows的环境. 今天就来记录 ...

  6. zk分布式任务管理

    在我们的系统开发过程 中不可避免的会使用到定时任务的功能,而当我们在生产环境部署的服务超过1台时,就需要考虑任务调度的问题,防止两台或多台服务器上执行同一个任务,这个问题今天咱们就用zookeeper ...

  7. word中如何只修改英文的颜色

    替换->更多->使用通配符,查找[a-zA-Z],替换为^&,字体选红色

  8. 时序数据库连载系列:指标届的独角兽Prometheus

    简介 Prometheus是SoundCloud公司开发的一站式监控告警平台,依赖少,功能齐全.于2016年加入CNCF,广泛用于 Kubernetes集群的监控系统中,2018.8月成为继K8S之后 ...

  9. 用于ViEmu的重置为试用状态的Python脚本

    import winreg import shutil shutil.rmtree("C:\\Users\\Administrator\\AppData\\Local\\Identities ...

  10. 配置多版本jdk

    配置办法https://blog.csdn.net/qq342643414/article/details/78364601 可能会遇到的问题https://www.cnblogs.com/chuij ...