js在for循環中添加定時器

最近些項目遇到個需求，在for循環中,給循環出來的元素添加自己定時器，這時候發現定時器只加了最後一個元素上面
具體看個例子你就明白了

for(var i = 0;i<4;i++){
		setInterval(function(){
			console.log(i)//這裏永遠輸出一直是4 
		},1000)
	}

因爲定時器它是異步執行的，而for循環執行速度又很快，所以導致當開始執行定時器時。for循環已經執行完畢，所以它一直會輸出最後一個i
解決方案：通過閉包的形式，把函數體單獨放到一個函數裏，在for循環中去調用，這樣問題就解決了

for(var i = 0;i<4;i++){
		fun(i)
	}
	function fun(i){
	return setInterval(function(){
			console.log(i)//這裏會將每個下標都輸入出來
		},1000)
	}

或者你也可以這樣

	for (var i = 0; i < 4; i++) {
			setInterval(fun(i), 1000)
		}

		function fun(i) {
			return function() {
				console.log(i)
			}
		}

兩種實現方式原理一樣，都是通過閉包的形式去實現，只是寫法有些不同，但打印的結果都是一樣的，希望可以幫助到你們