本文深入解析JavaScript中for循环的关键细节。重点讲解如何利用立即执行函数隔离循环变量i以避免污染全局作用域，通过预计算数组长度提升循环效率，并详细对比return、break和continue三种跳出或跳过循环的方式及其实际效果。
for循环基础与示例
为了更直观地理解，建议直接参考下方的代码示例。for循环在开发中使用频率极高，其基础用法相对简单。
(function() {
for(var i=0, len=demoArr.length; i<len; i++) {
if (i == 2) {
// return; // 函数执行被终止
// break; // 循环被终止
continue; // 循环被跳过
};
console.log('demo1Arr['+ i +']:' + demo1Arr[i]);
}
})();
for循环关键注意事项
在使用for循环时，有几个关键点需要特别注意：
- 首先，for循环中的变量i在循环结束后仍然存在于当前作用域中。为了防止其影响作用域内的其他变量，建议采用立即执行函数（IIFE）的方式将循环逻辑隔离起来，即使用()();包裹代码块。
- 其次，应避免使用for(var i=0; i<demo1Arr.length; i++){}这种写法。因为这种方式会在每次循环迭代时重新计算数组长度，导致效率低于预先计算长度的方式。此外，将变量声明提前到for循环之前执行，有助于提高代码的可读性。
- 例如，可以先声明变量：var i = 0, len = demo1Arr.length;
- 然后在循环中判断：for(; i<len; i++) {};
循环控制与跳出机制
关于跳出或控制循环执行流程，主要有以下几种方式：
- 使用return语句会终止整个函数的执行。
- 使用break语句会直接终止当前循环的执行。
- 使用continue语句则会跳过当前迭代，直接进入下一次循环判断。
完整代码实例
以下是一个完整的代码实例供参考：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>遍历详解: for</title>
<script src="../script/jquery-2.0.3.js"></script>
</head>
<body>
</body>
<script>
var demo1Arr = ['Javascript', 'Gulp', 'CSS3', 'Grunt', 'jQuery', 'angular'];
(function() {
for(var i=0, len=demo1Arr.length; i<len; i++) {
if (i == 2) {
// return; // 函数执行被终止
// break; // 循环被终止
continue; // 循环被跳过
};
console.log('demo1Arr['+ i +']:' + demo1Arr[i]);
}
})();
</script>
</html>