Javascript基础教程之for循环


Posted in Javascript onJanuary 18, 2015

js for 循环可以将代码块执行指定的次数。

JavaScript 循环

我们可以这样输出数组的值:如果您希望一遍又一遍地运行相同的代码,并且每次的值都不同,那么使用循环是很方便的。

document.write(cars[0] + "<br>");
document.write(cars[1] + "<br>");
document.write(cars[2] + "<br>");
document.write(cars[3] + "<br>");
document.write(cars[4] + "<br>");
document.write(cars[5] + "<br>");

不过我们这样写

for (var i=0; i<cars.length;i++){
document.write(cars[i]+"<br>");
}

举例:输出1-100的数字

for(var i=0;i <=100;i++){
document.write(i+"<br>")
}

for是前测试循环,而且在循环之前能够初始化变量,并且定义循环后要执行的代码,其语法如下

for(inintialization;expression;psot=loop-expression)statement

执行的过程如下:

1.执行initialization语句

2.判断expression是否为true,如果是则是继续,否则终止整个循环体。

3.执行循环体statement代码

4.执行post-loop-expression代码

5.返回第2步操作

for循环最常用的形式是for(var i=0; i<n;i++){statement}

它表示循环一共执行n次,非常适合用于已知的循环次数运算。

    var aNumbers = new Array();

    var sMessage = "你输入了:\n";

    var iTotal = 0;

    var vUserInput;

    var iArrayIndex = 0;

    do{

        vUserInput = prompt("输入一个数字,或者'0'退出","0");

        aNumbers[iArrayIndex] = vUserInput;

        iArrayIndex++;

        iTotal += Number(vUserInput);

        sMessage += vUserInput + "\n";

    }while(vUserInput != 0)        //当输入为0(默认值)时退出循环体

    sMessage += "总数:" + iTotal;

    document.getElementById("xxx").innerHTML=sMessage;

不同类型的循环

JavaScript 支持不同类型的循环:

for - 循环代码块一定的次数
for/in - 循环遍历对象的属性
while - 当指定的条件为 true 时循环指定的代码块
do/while - 同样当指定的条件为 true 时循环指定的代码块

For 循环
for 循环是您在希望创建循环时常会用到的工具。

下面是 for 循环的语法:

for (语句 1; 语句 2; 语句 3)
{
被执行的代码块
}

语句 1 在循环(代码块)开始前执行

语句 2 定义运行循环(代码块)的条件

语句 3 在循环(代码块)已被执行之后执行

实例

for (var i=0; i<5; i++)
 {
 x=x + "The number is " + i + "<br>";
 }

从上面的例子中,您可以看到:

Statement 1 在循环开始之前设置变量 (var i=0)。

Statement 2 定义循环运行的条件(i 必须小于 5)。

Statement 3 在每次代码块已被执行后增加一个值 (i++)。

语句 1
通常我们会使用语句 1 初始化循环中所用的变量 (var i=0)。

语句 1 是可选的,也就是说不使用语句 1 也可以。

您可以在语句 1 中初始化任意(或者多个)值:

实例:

for (var i=0,len=cars.length; i<len; i++)
{
document.write(cars[i] + "<br>");
}

同时您还可以省略语句 1(比如在循环开始前已经设置了值时):

实例:

var i=2,len=cars.length;
for (; i<len; i++)
{
document.write(cars[i] + "<br>");
}

语句 2
通常语句 2 用于评估初始变量的条件。

语句 2 同样是可选的。

如果语句 2 返回 true,则循环再次开始,如果返回 false,则循环将结束。

提示:如果您省略了语句 2,那么必须在循环内提供 break。否则循环就无法停下来。这样有可能令浏览器崩溃。请在本教程稍后的章节阅读有关 break 的内容。

语句 3
通常语句 3 会增加初始变量的值。

语句 3 也是可选的。

语句 3 有多种用法。增量可以是负数 (i--),或者更大 (i=i+15)。

语句 3 也可以省略(比如当循环内部有相应的代码时):

实例:

var i=0,len=cars.length;
for (; i<len; )
{
document.write(cars[i] + "<br>");
i++;
}

For/In 循环
JavaScript for/in 语句循环遍历对象的属性:

实例

var person={fname:"John",lname:"Doe",age:25};

for (x in person)
 {
 txt=txt + person[x];
 }

您将在有关 JavaScript 对象的章节学到更多有关 for / in 循环的知识。

While 循环

while 循环和 do/while 循环点击可以查看这篇文章。

以上就是关于javascript中for循环的全部内容了,希望小伙伴们喜欢。

Javascript 相关文章推荐
用正则xmlHttp实现的偷(转)
Jan 22 Javascript
js null,undefined,字符串小结
Aug 21 Javascript
鼠标经过tr时,改变tr当前背景颜色
Jan 13 Javascript
JQuery使用$.ajax和checkbox实现下次不在通知功能
Apr 16 Javascript
jquery解析XML及获取XML节点名称的实现代码
May 18 Javascript
文件上传插件SWFUpload的使用指南
Nov 29 Javascript
javascript 注释代码的几种方法总结
Jan 04 Javascript
js使用原型对象(prototype)需要注意的地方
Aug 28 Javascript
jQuery实现百度图片移入移出内容提示框上下左右移动的效果
Jun 05 jQuery
JavaScript数组、json对象、eval()函数用法实例分析
Feb 21 Javascript
让你30分钟快速掌握vue3教程
Oct 26 Javascript
Jquery+javascript实现支付网页数字键盘
Dec 21 jQuery
Javascript基础教程之while语句
Jan 18 #Javascript
Javascript基础教程之switch语句
Jan 18 #Javascript
Javascript基础教程之if条件语句
Jan 18 #Javascript
Javascript基础教程之比较操作符
Jan 18 #Javascript
Javascript基础教程之关键字和保留字汇总
Jan 18 #Javascript
Javascript基础教程之数组 array
Jan 18 #Javascript
Javascript基础教程之数据类型转换
Jan 18 #Javascript
You might like
PHP 的异常处理、错误的抛出及回调函数等面向对象的错误处理方法
2012/12/07 PHP
thinkPHP的表达式查询用法详解
2016/09/14 PHP
XHTML-Strict 内允许出现的标签
2006/12/11 Javascript
javascript 短路法代码精简
2009/08/20 Javascript
JavaScript setTimeout和setInterval的使用方法 说明
2010/03/25 Javascript
JQUBAR1.1 jQuery 柱状图插件发布
2010/11/28 Javascript
jquery和css3实现的炫酷时尚的菜单导航
2014/09/01 Javascript
javascript检测浏览器的缩放状态实现代码
2014/09/28 Javascript
js style动态设置table高度
2014/10/21 Javascript
javascript中String对象的slice()方法分析
2014/12/20 Javascript
javascript实现倒计时跳转页面
2016/01/17 Javascript
javascript实现将数字转成千分位的方法小结【5种方式】
2016/12/11 Javascript
javascript+jQuery实现360开机时间显示效果
2017/11/03 jQuery
微信小程序实现收藏与取消收藏切换图片功能
2018/08/03 Javascript
使用webpack构建应用的方法步骤
2019/03/04 Javascript
vue elementui el-form rules动态验证的实例代码详解
2019/05/23 Javascript
Vue使用轮询定时发送请求代码
2020/08/10 Javascript
Vue+Element UI 树形控件整合下拉功能菜单(tree + dropdown +input)
2020/08/28 Javascript
Vue中ref和$refs的介绍以及使用方法示例
2021/01/11 Vue.js
node.js 基于 STMP 协议和 EWS 协议发送邮件
2021/02/14 Javascript
python和pyqt实现360的CLable控件
2014/02/21 Python
Python入门篇之编程习惯与特点
2014/10/17 Python
Python Socket传输文件示例
2017/01/16 Python
Python实现动态添加属性和方法操作示例
2018/07/25 Python
浅谈pyqt5中信号与槽的认识
2019/02/17 Python
Python3实现的简单工资管理系统示例
2019/03/12 Python
解决Python内层for循环如何break出外层的循环的问题
2019/06/24 Python
python中树与树的表示知识点总结
2019/09/14 Python
解决启动django,浏览器显示“服务器拒绝访问”的问题
2020/05/13 Python
python 使用csv模块读写csv格式文件的示例
2020/12/02 Python
什么是SQL Server的确定性函数和不确定性函数
2016/08/04 面试题
计算机系毕业生推荐信
2013/11/06 职场文书
《冬阳童年骆驼队》教学反思
2014/04/15 职场文书
党委干部批评与自我批评发言稿
2014/09/28 职场文书
python spilt()分隔字符串的实现示例
2021/05/21 Python
Java中生成微信小程序太阳码的实现方案
2022/06/01 Java/Android