ES6新增指令：let

let的介紹

let是ES6新增的指令。

作用：聲明變量。

類似于：var。

與var的差別：使用let聲明的變量，隻在其所在的代碼塊内有效。

定義回顧

聲明變量：可以用var，也可以不用var。

是否允許變量提升：允許。

是否允許重複聲明同一個變量：允許。

變量的作用域：全局作用域、函數作用域。

在全局作用域中，無論是否使用var，定義的變量都是全局變量。

在函數作用域中，使用var定義函數局部變量，不使用var定義全局變量。

全局變量全局可用，函數局部變量在函數内可用。

代碼塊：用{}栝起來的代碼片段。

基本文法

let聲明的變量，隻在其所在其所在的代碼塊内有效。

let不存在變量提升。

let不允許重複聲明。

let不允許在函數的一級作用域内重新聲明參數。

let存在的塊級作用域，它聲明的這個變量或“綁定”這個區域，形成“暫時性死區”，使其不再受外部影響。

就是說，一個變量，無論其在外部是否聲明，隻要在某個塊級作用域内使用let重新聲明了，那麼在這個塊級作用域内該變量在聲明前是不可以使用的。

使用場景

for循環的計數器

let聲明的循環變量i隻在本輪循環有效，每一次循環的i都是一個新變量。特别的JavaScript引擎内部會記住上一輪循環的值，初始化本輪的變量i時，是在上一輪循環的基礎上進行計算。

另外，for循環設定循環變量的那部分是一個父作用域，而循環體内部是一個單獨的自作用域。

代碼片段

part 1：var聲明變量回顧

<script type="text/javascript">
	var a = 1;
	console.log(a);  // 1
	b = 2;
	console.log(b);  // 2
	console.log(c);  //undefined
	var c = 3;
	var a = 4;
	function showA(){
		console.log(a);
		d = 5;
		console.log(d);
	}
	showA();  // 4,5
	console.log(d);  //5
	function showB(){
		console.log(b);
		var e = 6;
		console.log(e);
	}
	showB();  //2,6
	console.log(e);  //報錯
</script>
           

part 2：let聲明的變量時局部變量

<script type="text/javascript">
	{
		var a = 1;
		let b = 2;
	}
	console.log(a);  //1
	console.log(b);  //報錯
</script>
           

part 3：for循環中使用var定義循環參數，該參數會變味全局參數

<script type="text/javascript">
	var a = [];
	for(var i = 0; i < 10; i++){
		a[i] = function(){
			console.log(i);
		}
	}
	a[6]();  //10
</script>
           

part 4：for循環中使用let定義循環參數，改參數是塊級作用域内的參數

<script type="text/javascript">
	for(let i = 0; i < 10; i++){

	}
	console.log(i);  //報錯
</script>
           

part 5：對比part3，用var定義循環變量

<script type="text/javascript">
	var a = [];
	for(let i = 0; i < 10; i++){
		a[i] = function(){
			console.log(i);
		}
	}
	a[6]();  // 6
</script>
           

part 6：for循環中，外層是一個父作用域，裡面的每層循環是一個自作用域，互不影響

<script type="text/javascript">
	for(let i = 0; i < 3; i++){
		let i = 'abc';
		console.log(i);  //abc,abc,abc
	}
</script>
           

part 7：let聲明的變量不允許變量提升

<script type="text/javascript">
	console.log(a);  //報錯
	let a = 1;
</script>
           

part 8：塊級作用域中用let聲明的變量會形成【暫時性死區】，即使在全局聲明了該變量，也不能在let聲明前調用

<script type="text/javascript">
	let a = 1;
	console.log(a);  //1
	{
		a = 2;
		let a;
		console.log(a);  // 報錯
	}
</script>
           

part 9：let聲明的變量不允許重複聲明

<script type="text/javascript">
	let a = 1;
	console.log(a);  // 1
	let a = 2;
	console.log(a);  //報錯
</script>
           

part 10：不允許在函數的一級作用域内使用let重新聲明參數

<script type="text/javascript">
	function showName(name){
		let name = 'sunny';
		console.log(name);
	}
	showName('lily');   // 報錯
</script>
           

part 11：可以在函數的二級或三級等作用域内使用let重新聲明參數，且與一級作用域中的參數互不影響

<script type="text/javascript">
	function showName(name){
		console.log(name);
		{
			let name = 'sunny';
			console.log(name);
		}
	}
	showName('lily');   //lily,sunny
</script>