下载掌阅APP，畅读海量书库
立即打开
“小娃娃，我且问你，可否知道循环遍历的法术？”
“循环遍历不就是for循环或者while循环吗，这有何难？”说着，叶小凡就随便打出了一段代码。
“嗯，你使用的是for循环。 如果你希望一遍又一遍地运行相同的代码，并且每次的值都不同，那么使用循环是很方便的 。就好像你刚才写的，你想要重复使用console.log输出一个东西，使用for循环的确可行。那你可知while循环？”
叶小凡想了一下，说道：“感觉while循环和for循环差不多吧，就是它们在语法上稍微有点区别。”说着，叶小凡随手打出一段代码，将刚才的for循环改写成了while循环。
“ i ++ 是自增运算符，表示把当前的变量自增一个单位 。 而 ++ i和i ++ 是有区别的，前者代表先自增一个单位，再运算 ； 后者相反，表示先运算，再自增一个单位 。但是由于这段代码中的i++占单独一行，没有对i进行使用，所以不管是++i还是i++，只要这句话执行完毕，i的值都会自增。”
听到这里，叶老满意地点了点头。
“小娃娃，看来你的基础不错，那你说说while循环和for循环除了语法还有什么区别。
“这……”叶小凡一时语塞。
“小娃娃，你且看好，你方才写的for循环中有一个小括号。小括号里面有3个表达式，分别为“var i=0”，“i<10”还有“i++”。第1个语句是在循环开始之前执行的，“var i=0”的意思是定义了一个变量i，是整数，初始值为0。第2个语句是“i<10”，表示进入循环体的条件。”
“循环体就是那个用大括号（{}）扩起来的部分吗？”叶小凡问道。
“没错，不论是for循环还是while循环，循环体就是这个部分，这个部分里面的代码是需要被多次执行的。现在我再给你说说最后一个语句“i++”，这个语句是在刚才我们所说的大括号里面的代码被全部执行之后才会被执行的。一般来说，上面这段语句里面的代码可以控制循环变量i自增一个单位或者自减一个单位。”
“自增我知道，无非就是i++或者++i，为什么要自减呢？”
“关于这个问题，是和第2个语句相关联的。比如你刚才写的代码。”说着，叶老指向叶小凡刚才写的代码。
“你的循环判断条件是当i<10的时候才会进入循环体，也就是后面用大括号扩起来的部分，对吧？”叶老问道。
“没错，最开始的时候i=0，第一次循环中i自然是小于10的，于是就进入了循环体，像这样。”说着，叶小凡催动内力，让这段JavaScript代码开始执行。
当执行到这一行代码的时候，叶小凡特意让代码停了下来，调试代码。效果如图1-3所示。
“嗯，很好，我且问你，现在代码停在了这一行，如果我再往下执行一步，那么会到第4行还是停留在第3行呢？”叶老问道。
图1-3 调试代码效果图（1）
“那还用问，肯定是跳到第4行啦。”叶小凡十分肯定地说道。
“先别着急下结论，走一步试试。”叶老对叶小凡说道。
“试就试。”说着，叶小凡就用debug走了一步。效果如图1-4所示。
图1-4 调试代码效果图（2）
“这是怎么回事？”叶小凡讶然，同时皱了皱眉。
“你再走一步试试。”叶老笑呵呵地说道。
就这样，叶小凡又走了一步，这才发现走到了第4行。经过反复测试，叶小凡紧皱的眉头终于松开了。原来，第一次跳到第3行代码的时候，是在准备运行for循环的语句1，也就是“var i=0”这句话。因此，刚才第一次跳到第3行代码的时候，i变量的值是undefined（未定义），因为这个时候只声明了i变量，还没有运行“i=0”这个赋值语句，所以是undefined。而当叶小凡往下再走一步的时候，则是运行了“i=0”这个赋值语句，这个时候，i变量的值才如愿以偿地变成了0，整个语句1才算是执行完毕了。为什么再走一步就能够跳转到第4行代码呢？这是因为语句1执行完毕后就自然会执行语句2了，也就是“i<10”这句话，这就好比是一个if判断。
第一次循环的时候，i=0自然是小于10的，因此直接进入了循环体。循环体执行完毕后，开始执行语句3——“i++”，i从0变成了1，然后进入第二次循环，再次判断i是否小于10。
听着叶小凡的论述，叶老微微点了点头，说道：“是这样的，那么问题来了，在刚才的例子中，i从0一直自增到10，当然，它最后会变成10，但是却无法再次满足i<10的判断条件了。所以，当i=10的时候，就无法进入循环体了。可是这并没有关系，因为第一次i=0是符合条件的，最后一次进入循环体是在i=9的时候，像这样。”说完，叶老随手一挥，将这段代码的运行结果显示了出来。效果如图1-5所示。
图1-5 运行结果
“嗯嗯，我明白了，因为i变量是从0开始的，所以0~9还是循环了10次。至于刚才说的自减，其实也是一样的，只要改变一下循环条件和初始化变量i的值就行了。”
说完，叶小凡修改了一下代码。
for(var i= 10;i> 0;i- - ){
console.log(i);
}
“同样是循环10次，这回就是变量i从10减到0的过程了。”叶小凡说道。
“没错，是这样的。 while循环只是在语法上有所不同，其作用和for循环是一样的 。很好，看来你已经掌握了循环的奥妙。”
for循环是你在创建循环时常会用到的工具。也就是说，如果某一段代码需要多次执行，若不用循环，则需要将相同的代码重复书写多遍。
下面是for循环的语法。
while循环会在指定条件为真时循环执行代码块。
下面是while循环的语法。
