var、let、const区别?

(1) 是否存在变量提升?
(2) 是否存在暂时性死区?
(3) 是否存在块级作用域?
(4) 是否能够重复声明变量?
(5) 是否能修改声明的变量?

在ES5中只有 var和 function可用来声明变量,这两种声明变量的方法是有缺陷的,因为它存在变量提升(预解析)的问题,所以在ES6中新增的let、const这两种声明变量的方法用来弥补ES5中var的缺陷。

变量提升:
变量在声明之前可以使用,并且代码不会报错,会返回undefined

预解析:
在浏览器拿到js代码将要执行之前,会整体的解读一遍js文件,把其中的var声明的变量和function提前定义

(1) 是否存在变量提升?
var声明的变量存在变量提升,它会将声明的变量提升到当前作用域的最顶端,使得变量在声明之前可以使用,返回一个undefined。

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

let、const声明的变量不存在变量提升,这两个方法声明的变量要在声明后使用,否则就会报错!

//ReferenceError  引用错误
console.log(b) //Cannot access 'b' before initialization 初始化前无法访问“b”
let b=2

console.log(c) //Cannot access 'c' before initialization 初始化前无法访问“c”
const c=3

(2) 是否存在暂时性死区?

暂时性死区:
在用let和const声明一个变量之前,都不能使用这个变量,否则就会报错,在这之前的代码块,对于这个变量来说都叫暂时性死区。

var声明的变量不具有暂时性死区,let和const声明的变量具有 暂时性死区。
如果块级作用域内存在let命令,他所声明的变量就会绑定在这个区域,不会再受外部影响。

var num=123;
if(true){
	//ReferenceError
	num=123;//Cannot access 'num' before initialization  初始化前无法访问“num”
	let num;
}
if{}ES6中新增的块级作用域,由于在if{}中使用let声明了变量,这个变量就绑定在这个块级作用域了,在声明前使用就会报错。

(3) 是否存在块级作用域?
let和const声明的变量具有块级作用域,var声明的变量不具有块级作用域。

块级作用域:
在ES5中有全局作用域和局部作用域(函数作用域),并没有块级作用域这个概念。块级作用域是ES6中的新增的,块级作用域由{ }包裹,if语句和for语句中的{ }就属于块级作用域。

使用块级作用域,外层作用域无法获取到内层作用域,非常安全明了。即使外层作用域和内层作用域都使用相同的变量名,也不会互相干扰。

注意: 块级作用域必须有{ },如果没有{ },JavaScript引擎就会认为不存在块级作用域。

如果没有块级作用域,可能会造成一些不适合的场景:
1.内层变量可能会覆盖外层变量
2.用来计数的循环变量可能会泄露为全局变量

//1.内层变量可能会覆盖外层变量
var a=1;
function fn(){
	console.log(a) //undefined
	if(false){
		var a=2; //var声明的变量具有变量提升,虽然有块级作用域,但是var声明的变量会跨域这个域。
	}
}
fn()
//2.用来计数的循环变量可能会泄露为全局变量
var b='HelloWord';
for(var i=0;i<b.length;i++){
	console.log(b[i]);
}
console.log(i);//9 i循环结束后,泄露成了全局变量
//1.解决内层变量可能会覆盖外层变量
var c=1;
function fn1(){
	console.log(c) //1 访问的外层变量
	if(false){
		let c=2; //let声明的变量不具有变量提升,变量存在于块级作用域中。
	}
}
fn1()
//2.解决用来计数的循环变量可能会泄露为全局变量
var d='HelloWord';
for(let k=0;k<d.length;k++){
	console.log(d[k]);//k存在于块级作用域中,和其绑定
}
console.log(k);//报错  k is not defined

(4) 是否能够重复声明变量?
let和const声明的变量不可以重复声明,var声明的变量可以重复声明

var a=1;
var a=2;
console.log(a)//2

let b=3;
let b=4;
console.log(b)//SyntaxError: Identifier 'b' has already been declared  标识符“b”已声明

const c=5;
const c=6;
console.log(c)//SyntaxError: Identifier 'c' has already been declared  标识符“c”已声明

(5) 是否能修改声明的变量?
const声明的变量不可修改,let和var声明的变量可以修改

因为const声明的是一个常量,一旦声明常量的值就不能被改变。const一旦声明变量,就必须立即初始化,不能留到以后再赋值。

var a=1;
 	a=2;
console.log(a)//2

let b=3;
	b=4;
console.log(b)//4

const c=5;
	  c=6;
console.log(c)//报错 不能进行重复声明   TypeError: Assignment to constant variable


const obj={
	name:'皮卡丘',
	age:18
}
obj.name='卡比兽'
console.log(obj) //{name: "卡比兽", age: 18}

注释:const声明的变量,如果赋值为一个引用数据类型的值,那么是可以修改值里边的内容的,只要不去修改这个变量所指向的内存空间的地址即可
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值