let和var的区别，解密ES6

一、变量提升

var存在变量提升，而let不存在变量提升，所以用let定义的变量一定要在声明后再使用，否则会报错。

var

//var定义的变量存在变量提升，变量会把声明提升到整个作用域的最前面

//例子1

console.log(a); //undefined

var c=10;

//等价于

var c;

console.log(a); //undefined

c=10;

/------------------------/

//例子2

var a=100;

function func(){

console.log(a); //undefined

var a=10;

console.log(a); // 10

}

func(); //调用函数

//等价于

var a=100;

function func(){

var a;

console.log(a); //undefined

a=10;

console.log(a); // 10

}

func(); //调用函数

//注意：

//对于不声明而直接赋值的变量，相当于全局变量，赋值之后才可以使用，赋值之前会报错

console.log(a); //报错：a is not defined

a=100;

console.log(a); //100

let

//let定义的变量不存在变量声明，变量在声明前使用会报错

//例子1

console.log(a); //报错 a is not defined

let a=100;

//例子2

function func(){

console.log(a);

let a=100;

}

func();//调用函数

二、作用域

var：只有全局作用域和函数作用域概念，没有块级作用域的概念。

let：只有块级作用域的概念 ，由 { } 包括起来，if语句和for语句里面的{ }也属于块级作用域。

var

//全局作用域例子

//也就是除了在函数内部定义的变量，其他都是全局变量。

for(var i=0;i<100;i++){

;

}

console.log(i); // 100

//函数作用域例子，如下 b会输出10 ，而a会报错“a is not defined”，为什么呢？

//因为对于不声明而直接赋值的变量（b），相当于全局变量。

//而对于在函数里声明赋值的变量（a），它只在函数内部有效，外部无法访问，否则会报错

function func(){

b=10;

var a=100;		

}

func();//调用函数

console.log(b); // 10

console.log(a); //报错 a is not defined

考一考

/*补知识

函数的语法：自调用函数，也就是会定义并调用该函数

(function(){

})();

*/

//考一考

(function(){

var a=b=100;			

})();

console.log(b);

console.log(a);

//问题:a和b分别会输出什么呢？

//答案：b会输出100，而a会报错“a is not defined”

//为什么呢？

//首先，将该函数分解为我们所熟悉的写法

(function(){

var a=100;

b=100;			

})();

console.log(b); // 100

console.log(a); // 报错 a is not defined;

//由此，可以看出了吧？这是前面所说的“函数的作用域”：b相当于全局变量，而a只作用于该函数内，外部访问不了。

let

只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。在代码块中，使用let命令声明变量之前，该变量都是不可用的，这在语法上称为“暂时性死亡”

//例子1

//会报错“a is not defined”,因为在if代码块内，使用let声明变量之前，该变量都是不可用的，否则会报错

if(true){

a=123;

let a;

}

//例子2

//会报错“i is not defined”,因为用let定义的i只在for循环体内有效

for(let i=1;i<100;i++){

;

}

console.log(i)

三、重复声明

var：变量可以多次声明

let：变量不允许重复声明，let不允许在相同作用域内，重复声明同一个变量。不能在函数内部，重新声明同一个参数

var

var a=10;

function func(){

console.log(a); // undefined

var a=11;

console.log(a); // 11

}

func();

console.log(a); // 10

var a;

console.log(a); // 10

var a =12;

console.log(a); // 12

//这个其实涉及到的是var的变量可重复声明和变量提升

//以上其实可以等价于

var a;

a=10;

function func(){

var a;

console.log(a); // undefined

a=11;

console.log(a); // 11

}

func();

console.log(a); // 10

console.log(a); // 10

a =12;

console.log(a); // 12

//这样，相信很容易得出正确的答案

let

//例子1

//会报错“Identifier ‘a’ has already been declared”

var a=1;

let a=2;

//例子2

//不会报错，因为a可以在不同作用域内声明的。

let a=‘hello’;

{

let a='hi';

console.log(a); // hi

}

console.log(a); // hello

//例子3

//会报错" Identifier ‘a’ has already been declared"，因为var定义的变量会发生变量提升。

let a=‘hello’;

{

var a='hi';

console.log(a); 

}

console.log(a);

//例子4

//会报错“Identifier ‘a’ has already been declared”，

//不能在函数内部重复声明同一个参数，因为参数变量是默认声明的，所以不能用let或const再次声明

function func(a){

let a='hello';

console.log(a);

}

func(‘hi’);

大概就这些了_{发现有错误的或者有疑问的可以在下面评论哦}互相学习学习