一、前言

在ES6(ES2015)出现之前,JavaScript中声明变量就只有通过 var 关键字,函数声明是通过 function 关键字,而在ES6之后,声明的方式有 var 、 let 、 const 、 function 、 class ,本文主要讨论 var 、 let 和 const 之间的区别。

二、var

如果使用关键字 var 声明一个变量,那么这个变量就属于当前的函数作用域,如果声明是发生在任何函数外的顶层声明,那么这个变量就属于全局作用域。举例说明:

var a = ; //此处声明的变量a为全局变量
function foo(){
var a = ;//此处声明的变量a为函数foo的局部变量
console.log(a);//
}
foo();
console.log(a);//

如果在声明变量时,省略 var 的话,该变量就会变成全局变量,如全局作用域中存在该变量,就会更新其值。如:

var a = ; //此处声明的变量a为全局变量
function foo(){
a = ;//此处的变量a也是全局变量
console.log(a);//
}
foo();
console.log(a);//

三、提升

提升是指无论 var 出现在一个作用域的哪个位置,这个声明都属于当前的整个作用域,在其中到处都可以访问到。注意只有变量声明才会提升,对变量赋值并不会提升。如下例所示:

console.log(a);//undefined
var a = ;

该代码段跟下列代码段是一样的逻辑:

var a;
console.log(a);//undefined
a = ;

而如果对未声明过的变量进行操作,就会报错

console.log(b);//假设b未声明过,Uncaught ReferenceError: b is not defined

四、let

let 声明的变量,具有如下几个特点:

  1. let 声明的变量具有块作用域的特征。
  2. 在同一个块级作用域,不能重复声明变量。
  3. let 声明的变量不存在变量提升,换一种说法,就是 let 声明存在暂时性死区(TDZ)。

如下面几个例子所示

let a = ;
console.log(a);//
console.log(b);//Uncaught ReferenceError: b is not defined
let b = ;
function foo(){
let a = ;
let a = ;//Uncaught SyntaxError: Identifier 'a' has already been declared
}

以下是一个经典的关于 var 和 let 的一个例子:

for (var i = ; i < ; i++) {
setTimeout(function(){
console.log(i);
},)
};

该代码运行后,会在控制台打印出10个10.若修改为:

for (let i = ; i < ; i++) {
setTimeout(function(){
console.log(i);
},)
};

则该代码运行后,就会在控制台打印出0-9.

五、const

const 声明方式,除了具有 let 的上述特点外,其还具备一个特点,即 const 定义的变量,一旦定义后,就不能修改,即 const 声明的为常量。

例如:

const a = ;
console.log(a);//
a = ;
console.log(a);//Uncaught TypeError: Assignment to constant variable.

但是,并不是说 const 声明的变量其内部内容不可变,如:

const obj = {a:,b:};
console.log(obj.a);//
obj.a = ;
console.log(obj.a);//

所以准确的说,是 const 声明创建一个值的只读引用。但这并不意味着它所持有的值是不可变的,只是变量标识符不能重新分配。

六、总结

  1. var 声明的变量属于函数作用域,let 和 const 声明的变量属于块级作用域;
  2. var 存在变量提升现象,而 let 和 const 没有此类现象;
  3. var 变量可以重复声明,而在同一个块级作用域,let 变量不能重新声明,const 变量不能修改。

JavaScript中var、let和const的区别(转载)的更多相关文章

  1. JS中 var,let与const的区别

    1.在ES6(ES2015)出现之前,JavaScript中声明变量就只有通过 var 关键字,函数声明是通过 function 关键字,而在ES6之后,声明的方式有 var . let . cons ...

  2. JavaScript中var和this定义变量的区别

    JavaScript中var和this定义变量的区别 在js中声明变量时可以使用var和this,但使用this的有很大一部分参考书是没有的,经过查阅相关资料总结如下: 用var和this声明变量,存 ...

  3. javascript中var let const三种变量声明方式

    javascript中var let const三种变量声明方式 1.var  ①var表示声明了一个变量,并且可以同时初始化该变量. ②使用var语句声明的变量的作用域是当前执行位置的上下文:一个函 ...

  4. JavaScript中值类型和引用类型的区别

    JavaScript的数据类型分为两类:原始类型和对象类型.其中,原始类型包括:数字.字符串和布尔值.此外,JavaScript中还有两个特殊的原始值:null和undefined,它们既不是数字也不 ...

  5. JavaScript中object和Object有什么区别

    JavaScript中object和Object有什么区别,为什么用typeof检测对象,返回object,而用instanceof 必须要接Object呢 ————————————————————— ...

  6. JavaScript中=、==、===以及!=、!==的区别与联系

    JavaScript中=.==.===以及!=.!==的区别与联系   在JavaScript中,“=”代表赋值操作:“==”先转换类型再比较,“===”先判断类型,如果不是同一类型直接为false. ...

  7. var和let/const的区别

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

  8. javascript中var、let和const的区别

    在javascript中,var.let和const都可以用来声明变量,那么三者有什么区别呢?要回答这个问题,我们可以从先想想:三种不同的声明会影响变量的哪些方面?这些方面也就是变量的特性,那么变量有 ...

  9. javascript中var、let、const的区别

    这几天修改别人的js,发现声明变量有的用var,有的用let,那它们有什么区别呢? javascript中声明变量的方式有:var.let.const 1.var (1)作用域: 整个函数范围内,或者 ...

随机推荐

  1. 【LOJ6074】【2017 山东一轮集训 Day6】子序列 DP

    题目描述 有一个由前 \(m\) 个小写字母组成的串 \(S\),有 \(q\) 个询问,每次给你 \(l,r\),问你 \(S_{l\ldots r}\) 有多少个非空子序列. \(m=9,n=\l ...

  2. Java【第五篇】基本语法之--数组

    数组概述 数组是多个相同类型数据的组合,实现对这些数据的统一管理数组属引用类型,数组型数据是对象(Object),数组中的每个元素相当于该对象的成员变量数组中的元素可以是任何数据类型,包括基本类型和引 ...

  3. centos7关闭ipv6

    方法一: 编辑文件 /etc/sysctl.conf ,新增以下两行 net.ipv6.conf.all.disable_ipv6 = net.ipv6.conf.default.disable_ip ...

  4. busybox(三)最小根文件系统

    目录 busybox(三)最小根文件系统 引入 构建终端 构造inittab 配置应用程序 构建C库 制作映像文件yaffs title: busybox(三)最小根文件系统 tag: arm dat ...

  5. python django初识ajax

    什么是json json是轻量级文本数据交互格式 json独立语言 符合的json对象 ["one", "two", "three"] { ...

  6. 小程序图片转Base64

    在小程序中,有些业务要用到 图片的 base64 wx.chooseImage({ success: res => { wx.getFileSystemManager().readFile({ ...

  7. LINUX常用操作快捷方式

    1. tab  命令补全 这个按键地球人都知道了! 2. Esc+ . 补全最后一次键入的字符 3.Ctrl + a 跳到命令开头 4.Ctrl+e 跳到命令结尾 5 Ctrl+ u 光标处到命令行开 ...

  8. Chrome firefox ie等浏览器空格&nbsp;宽度不一样

    用半角空格 或者全角空格   相当于半格中文字符的宽度, 相当于一个中文字符宽度. 注:在chrome中两个 占一个汉字的宽度;,而在IE.firefox中四个 才占一个汉字的宽度.

  9. 万维网WWW详解

    万维网WWW(World Wide Web)并非某种特殊的计算机网络,万维网是一个个大规模的.联机式的信息储藏所,英文简称Web. 万维网使用链接的方式能非常方便地从英特网上的一个站点访问到一个站点, ...

  10. Max Area of Island

    Given a non-empty 2D array grid of 0's and 1's, an island is a group of 1's (representing land) conn ...