我遇到了以下问题，我根本无法理解，它是如何获得输出的。谁能解释一下？
<html>
<head></head>
<body>
<script>
const arr = [10, 12, 15, 21];
for (var i = 0; i < arr.length; i++) {
setTimeout(function() {
console.log('Index: ' + i + ', element: ' + arr[i]);
}, 3000);
}
</script>
</body>
</html>
预期：
Index: 0, element: 10
Index: 1, element: 12
Index: 2, element: 15
Index: 3, element: 21
输出
Index: 4, element: undefined (4 times)
这没有任何意义，这是输出。