setTimeout在循环结束后执行

Question

我面临的问题是，在循环结束后嵌套在for循环中的setTimeout函数将被执行：

var leds = document.querySelectorAll(".ast");
for (var i = 0; i < leds.length; i++) {
  console.log(i); // This outputs 1,2,3,...
  setTimeout(function() {
    console.log(i); // This outputs 8,8,8,...
  },100);
}

<div class="ast"></div>
<div class="ast"></div>
<div class="ast"></div>
<div class="ast"></div>
<div class="ast"></div>
<div class="ast"></div>
<div class="ast"></div>
<div class="ast"></div>

我读过similar thread，但这似乎无法解决我的问题。

有什么办法解决这个问题吗？