以前无论声明变量还是常量,总是使用var一勺端,知道接触了es6之后,发现原来变量、常量的声明其实是很讲究的。

  这里简单来谈谈var、const与let。

  1、var。var声明的变量没有块级作用域,而且存在变量名提升的情况。这里举例说明。

<script>
var num = 123;
function foo(){
console.log(num); // undefined
var num = 46;
console.log(num) //
}
foo()
</script>

  为什么第一个输出值会是undefined,而不是123呢?因为这里存在着变量名的提升,其实上述语句相当于:

<script>
var num = 123;
function foo(){
var num;
console.log(num); // undefined
num = 46;
console.log(num) //
}
foo()
</script>

  上面主要体现了var存在着变量名的提升,那么它没有块级作用域又是怎么体现的呢?最常见的是在条件语句里面,如if语句、for语句。这里以if语句为例。

<script>
var num = 123;
if(true){
console.log(num) //
   var num = 456;
console.log(num) //
}
console.log(num) //
</script>

  这里为什么第一个输出值不是undefined,第三个输出值不是123呢?原因是这样的,因为var不存在块级作用域,且变量名会提升,所以上述代码其实相当于:

<script>
var num;
num = 123
if(true){
  console.log(num) //
  num = 456;
  console.log(num) //
}
console.log(num) //
</script>

  所以在我看来,var其实是有利有弊的,利就是不用去管什么常量与变量的,直接使用var就行,弊就是不存在块级作用域且变量名会提升,这会在无形之中给我们带来许多意想不到的问题

  2、const(es6中用来定义常量的一个关键字(当然了,其他语言里也存在着const,这里仅指在js中)。常用来声明常量,且常量不可修改,必须初始化,存在着块级作用域。

  (1)、不存在名称提升问题。以代码说事儿。

<script>
function foo(){
console.log(num);
const num = 456;
console.log(num)
}
foo()
</script>

  运行上述代码会发现会报错 Uncaught ReferenceError: num is not defined 。这里说明,使用const来定义的常量名并没有提升。

  

  (2)、声明时必须初始化。假如用const声明的常量并没有初始化呢?会有问题吗?直接上代码

<script>
const num;
console.log(num)
</script>

  这里运行后发现会报错。 Uncaught SyntaxError: Missing initializer in const declaration 意思是:语法错误,在const声明中没有初始化。

  同样的代码,只是const声明初始化,结果会不会有变化呢?答案是不言而喻的了。

  

  (3)、存在着块级作用域。什么叫块级作用域呢?上代码: 

<script>
const num = 456
if(true){
const num = 789;
console.log(num); //
}
console.log(num) //
</script>

  可见在if语句内声明的常量在if语句外并不能访问到,这里与var不同。这里是以if语句为例的,当然在for语句亦或是函数内都是这样的,存在着块级作用域

  

  3、let(es6中用来定义变量的一个关键字)。let定义的变量存在着块级作用域,在函数内定义的变量,对函数外部无影响。

  (1)、在函数内部定义的变量,对函数外部无影响,即存在着块级作用域。  

<script>
let num = 789;
function foo(){
let num = 46;
console.log(num) //
}
foo()
console.log(num) //
</script>

  (2)、不存在着变量名的提升。

<script>
function foo(){
console.log(num); // Uncaught ReferenceError: num is not defined
let num = 46;
console.log(num)
}
foo()
</script>

  运行后发现会报错,可见使用let声明的变量,并不像var那样存在着变量名的提升问题。

浅析const、let与var的更多相关文章

  1. c# 把一个匿名对象赋值给一个Object类型的变量后,怎么取这个变量? c# dynamic动态类型和匿名类 详解C# 匿名对象(匿名类型)、var、动态类型 dynamic 深入浅析C#中的var和dynamic

    比如有一个匿名对象,var  result =......Select( a=>new {  id=a.id, name=a.name});然后Object  obj =  result ;我怎 ...

  2. ES6之用let,const和用var来声明变量的区别

    var(掌握) 不区分变量和常量   用var声明的变量都是变量,都是可变的,我们可以随便对它进行运算操作.这样当多个人进行同一个项目时,区分变量和常量会越来越难,一不小心就会把设计为常量的数据更改了 ...

  3. 浅析const标识符在C++函数的功能

    范例: class matrix { public: matrix(){}; const double getvalue(const unsigned row, const unsigned colu ...

  4. var和dynamic的应用 var、动态类型 dynamic 深入浅析C#中的var和dynamic ----demo

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  5. ES6中的var let const应如何选择

    javascript世界里面的每个人都在说有关ECMAScript 6 (ES6,也称作ES 2015)的话题,对象的巨大变化 ( 类 , super() , 等), 函数 (默认参数等), 以及模块 ...

  6. var与let、const的区别

    var与let.const 一.var声明的变量会挂载在window上,而let和const声明的变量不会: var a = 100;console.log(a,window.a); // 100 1 ...

  7. JS中的块级作用域,var、let、const三者的区别

    1. 块作用域{ } <script type="text/javascript"> { var a = 1; console.log(a); // 1 } conso ...

  8. javascript---lat const var 的区别

    首先,ECMAScript和JavaScript关系:      ECMAScript是一个国际通过的标准化脚本语言.JavaScript由ECMAScript和DOM.BOM三者组成.可以简单理解为 ...

  9. var let const

    你真的永远都不用var了吗? javascript的一些争论已经浮现出了一些经典的案例,因此,es6的拥护者你们应该讲var遗忘吗?这篇博客将带你走进被遗忘的角落 首先举例反对者的几个观点: 1.如果 ...

随机推荐

  1. mysql case when group by实例

    mysql 中类似php switch case 的语句. select xx字段, case 字段 when 条件1 then 值1 when 条件2 then 值2 else 其他值 END 别名 ...

  2. 百度文库的实现——java利用openoffice,批量word转pdf

    百度文库的主要功能就是将上传的word文档,转码成pdf格式再展示出来.其中有四种方法可以实现这样的操作: 方法一:用apache pio 读取doc文件,然后转成html文件用Jsoup格式化htm ...

  3. [摘抄]VC6.0移植到VS2008(vs2005)后的错误总结(未全部验证)

    ============================================================================================= 201405 ...

  4. idea为tomcat设置虚拟地址

    1.设置tomcat的server.xml <Host name="localhost" appBase="webapps" unpackWARs=&qu ...

  5. PHP字符串处理与正则表达式

    字符串 1. PHP中的字符串是一种基本数据类型,PHP对unicode没有本地支持. 2. 字符串可以可以通过花括号来访问每一个字符,并且每个花括号只能存放一个字符:     $str = 'abc ...

  6. jsonp及cors

    一. jsonp实现原理是利用script标签可以获取不同源资源的特点,来达到跨域访问某个资源的目的.具体行为如下: 创建一个script标签,将请求地址写入它的src属性,将这个script外链插入 ...

  7. VS2010 Extension实践(2)

    在上一篇(VS2010 Extension (1)实践)里,主要展示了如何使用MEF扩展VS2010,来扩展编辑控制和展现自己的UI:在实现QuickToolbar的时候,发现MEF仅仅提供了很基本的 ...

  8. 漂亮的提示框SweetAlert使用教程

    一.简介 所使用过的弹出框插件,SweetAlert是最好用的.发展至今,已经有两个版本,一个是原版 t4t5/sweetalert , 一个是分支版 limonte/sweetalert2 ,更新相 ...

  9. 每天学一点Docker(5)——了解Docker架构

    Docker的核心组件: 1.Docker客户端 - Client 2.Docker服务器 - Docker deamon 3.Docker镜像 - Image 4.仓库 - Registry 5.D ...

  10. python的time模块常用内置函数

    1.Python time time()方法 Python time time() 返回当前时间的时间戳(1970纪元后经过的浮点秒数). time()方法语法: time.time() 举例: #! ...