js中const,let,var的区别及作用域

要说他们的区别，首先需要了解作用域的概念

作用域永远都是任何一门编程语言中的重中之重，因为它控制着变量与参数的可见性与生命周期。首先理解两个概念：块级作用域与函数作用域。

1.块级作用域

任何一对花括号 {} 中的语句集都属于一个块，在这之中定义的所有变量在代码块外都是不可见的，我们称之为块级作用域。比如if(){} ,for(){}中的花括号都是块级作用域

2.函数作用域

很明显是function(){}的形式，定义在函数中的参数和变量在函数外部是不可见的

而三个变量中 var是忽视块级作用域的，也就是说在块级作用域中用var定义，在外部是可以访问到变量值得，var只有在函数作用域中声明外部才不能访问。而且var声明的变量会被声明提前，被提升到作用域顶部，并被赋值为undefinded

const和let是有块级作用域概念的，也就是说在块级作用域中用const或者let定义，外部无法访问变量！且不可以声明提前

具体的区别和案例我在下面列举

 

1.const

const就是一个定义的常量，在声明的时候就必须要赋值，且这个值不能再被改变，否则会报错。

重点：

1）当声明时不赋值报错

const a;

2） 当试图改变const常量时报错

const a=1;
a=2;

3）在同一作用域中重复定义报错

const a=1;
const a=2;

 

4）不会被声明提前（与var有区别）

console.log(a)
const a=2;

5）可以声明块级作用域的变量，块级作用域外无法访问内部变量！

if(true){
	const a=1;
}
console.log(a)

2.let

let和var比较相似，区别就是let不能被声明提前且可以声明块级作用域的变量，还有就是不能被重复声明

1）可以声明时不赋值

let a;
a=1;
console.log(a)

2）在同一作用域中不可以重复定义

let a;
let a=1;
console.log(a)

或

let a=1;
var a=1;
console.log(a)

都报错

3）不会被声明提前（与var有区别）

console.log(a)
let a=1;

 

4）可以声明块级作用域的变量，块级作用域外无法访问内部变量！

if(true){
	let a=1;
}
console.log(a)

for(let a=0;a<10;a++){
	
}
console.log(a)

let a=1;
if(true){
	let a=2;
}
console.log(a) //1

 

 3.var

var我们最熟悉了，就是声明变量用的，但它不能定义块级作用域变量，且会被声明提前

1）可重复定义 

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

2) 声明时可以不赋值

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

3）js程序在正式执行之前，会将所有var 声明的变量和function声明的函数，预读到所在作用域的顶部，但是对var 声明只是将声明提前，赋值仍然保留在原位置

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

相当于变成了这样

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

4）无法定义块级作用域变量，在块级作用域中定义相当于定义了一个全局变量

for(var a=0;a<10;a++){
	
}
console.log(a)  //10

console.log(a) //undefined
if(true){
	var a=1;
}
console.log(a) //1

小结：建议多使用let，毕竟for中的i一般不想被泄露出来，而且if中定义的变量一般只想在条件成立时才定义，实现这些都需要用let，而且let没有变量被声明提前的困扰，其他两者没有太大区别，所以还是改成用let声明变量吧~