1. 程式人生 > >ES6:let和const

ES6:let和const

let      1.作用         * 與var類似,用來宣告一個變數     2.特點         * 在塊作用域內有效         * 不能重複宣告         * 不會預處理 不存在變數提升     3.應用         * 迴圈遍歷加監聽         * 使用let取代var是趨勢          const     1.作用          * 定義一個常量     2.特點         * 不能修改         * 其他特定同let     3.應用         * 儲存不用改變的資料

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>let和const</title>
</head>
<body>
	<button type="">測試1</button>
	<button type="">測試2</button>
	<button type="">測試3</button>

	
</body>
<script type="text/javascript">
	let btns = document.getElementsByTagName('button')
	 for(var i = 0;i < btns.length;i++){
	 	var btn = btns[i]
	 	btn.onclick = function(){
	 		alert(i)// 每次都是3 因為回撥函式會放在事件佇列裡邊 最後執行
	 	}
	 }
	
    // 解決方法
	 for(var i = 0;i < btns.length;i++){
	 	var btn = btns[i];
	 	(function(i){
		btn.onclick = function(){
	 			alert(i)// 這個時候就正常了 是因為閉包是一個私有作用域 每次傳進來的i都會自執行
			}
		})(i);
	}
	// 使用let
	for(let i = 0;i < btns.length;i++){
		var btn = btns[i]
		btn.onclick = function(){
			alert(i)
		}
	}
</script>
</html>

const就不做演示了!!