javascript中for循环中你不可不知道的秘密

时间：2014-04-07 编辑：简简单单来源：一聚教程网

s: 这里的for循环指的是js的语言哦...

for循环的构成结构;

代码如下	复制代码
var i;//为什么要在这定义呢? 请看jQuery源码 for(i=0; i<10; i++){ //这里是循环的block }

这是一个很普通的"女子", 但你真的了解她吗? 下面分下域:

word-spacing: 0px; padding-top: 0px; opacity: 0.9; -webkit-text-size-adjust: auto; -webkit-text-stroke- box-shadow: rgb(204, 204, 204) 0px 0px 5px; border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px" alt="for循环" src="https://img.111com.net/get_pic/2014/04/07/20140407025617644.jpg" />

红色: 定义块
绿色: 判断块
蓝色: 计算块
粉色: 执行块
ps: 名是我起的啊, 不是官网的
那么她们的执行顺序是怎么样呢?
for循环的执行顺序
修改代码为:

代码如下	复制代码
var i;//为什么要在这定义呢? 请看jQuery源码 for(i=0,console.log("红色块: "+ i); console.log("绿色块: "+ i),i<3; console.log("蓝色块: "+ i),i++){ console.log("粉色块: "+ i) //这里是循环的block }

控制台运行结果为:

然而如果条件不成立则:

如果执行块有break,continue关键字则:

看结果得到以下规则:

执行顺序为:
红色 -> 绿色 -> 粉色 -> 蓝色
定义块 -> 判断块 -> 执行块 -> 计算块
规则为:
红色定义块: 用来定义变量(指的是循环的标识, 如:i), 只执行一次, 执行完后进到下一步
绿色判断块: 用来判断条件是否成立, 如果成立则进行下一步, 不成立则退出整个循环
粉色执行块: 用来执行代码, 如果有break则不执行下面代码, 且不进行下一步, 如果有continue则不执行下面代码, 进行下一步
蓝色计算块: 用来计算变量, 如++,--
ps: 不要被++i, i++的坑绊倒啊
奇葩的for循环

代码如下

复制代码

//定义块无内容
var i = 0,
len = 10;//data.length
for(; i console.log(i)
}

//定义,计算块无内容
var i = 0,
len = 10;
for(; i console.log(i++);//知道了for循环执行顺序这还不是小菜菜吗?
}

//居然还这样... *_*
var i = 0,
    len = 10;
for(; ;){
    console.log(i);
    if(++i >= 10){
        break;
    }
}

//感觉还不如while
var i = 0;
while(i < 10){
console.log(i++);
}

你有没有感觉对for有点新认识?

上一个： WordPress简单快速更换主题方法
下一个： Jquery Ajax实现文件下载实例代码

推荐专题

最新下载

热门教程

javascript中for循环中你不可不知道的秘密

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程