html5怎么写循环,JavaScript中的for循环

JavaScript 语言中的 for 循环用于多次执行代码块,它是 JavaScript 中最常用的一个循环工具,还可用于数组的遍历循环等。

我们为什么要使用 for 循环呢?打个比方,例如我们想要控制台输出1到1000之间的所有数字,如果单写输出语句,要写1000句代码,但是如果使用 for 循环,几句代码就能实现。总之,使用 for 循环能够让我们写代码更方便快捷(当然啦,否则要它干嘛)。

for 循环语法

语法如下所示:for(变量初始化; 条件表达式; 变量更新) {

// 条件表达式为true时执行的语句块

}变量初始化,表示代码块开始前执行。

条件表达式,定义运行循环代码块的条件。

变量更新,在循环代码块每次被执行之后再执行。

示例:

例如我们在一个HTML文件中,编写如下代码,实现计算1到100的总和:

JS_侠课岛(9xkd.com)

var result = 0;

for(var i = 1; i <= 100; i++) {

result = result + i;

}

alert(result);

在浏览器中打开这个文件,会弹出一个弹出层,弹出层中显示的是1到100的总和:

1c88ca11910046a52d842ddb1fb6abc1.png

上述代码中,我们声明了一个变量 result 并给它赋值为 0,表示初始的总和为 0 。

然后在 for 循环中三个语句:变量初始化 i = 1,表示从 1 开始计算。

条件表达式 i <= 100,表示只要 i 小于等于 100 循环就会一直执行,当 i 大于 100 循环会停止。

变量更新 i++,之前我们学运算符的时候学过,这是递增运算符 ++,表示为其操作数增加 1。

此时我们可以一点点来看这个 for 循环:第一次循环: result = 0 + 1 // 此时result值为0, i的值为1

第二次循环: result = 1 + 2 // 此时result值为0+1,i的值为2

第三次循环: result = 3 + 3 // 此时result值为1+2,i的值为3

第四次循环: result = 6 + 4 // 此时result值为3+3,i的值为4

第五次循环: result = 10 + 5 // 此时result值为6+4,i的值为5

...

我们只需要搞清楚 for 循环中的执行原理,不需要手动来计算求和,只要写好代码,执行代码后计算机会很快会告诉我们1到 100 的总和。

再补充一下,上述代码中result = result + i,我们也可以写成 result += i,这是我们之前学过的加赋值运算符,还记得吗?

示例:

再来看一个例子,例如我们可以使用 for 循环来实现数组遍历,首先定义一个数组 lst:var lst = ["a", "b", "c", "d", "e"];

在写 for 循环时,首先就是要搞清楚小括号里面的三个语句,因为我们可以通过数组中元素的下标索引来获取元素的值,而数组的索引又是从 0 开始,所以变量初始化可以设置为i = 0。第二个条件表达式,因为数组中最后一个索引为 lst.length - 1,所以只要小于等于 lst.length - 1,循环就会一直执行。而i <= lst.length - 1 就相当于 i

所以循环可以像下面这样写:for(i = 0; i

console.log(lst[i]); // 输出数组中的元素值,从索引为0的值开始输出,每次加1,一直到lst.length-1

}

输出:a

b

c

d

e

其实遍历数组还有一种更好的方法,就是使用 for...in 循环语句来遍历数组。

for...in 循环

for...in 循环主要用于遍历数组或对象属性,对数组或对象的属性进行循环操作。for...in 循环中的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。

语法如下:for (变量 in 对象) {

// 代码块

}

for 循环括号内的变量是用来指定变量,指定的可以是数组对象或者是对象属性。

示例:

使用 for...in 循环遍历我们定义好的 lst 数组:var lst = ["a", "b", "c", "d", "e"];

for(var l in lst){

console.log(lst[l]);

}

输出:a

b

c

d

e

除了数组,for...in 循环还可以遍历对象,例如我们遍历 侠侠 的个人基本信息:var object = {

姓名:'侠侠',

年龄:'22',

性别:'男',

出生日期:'1997-08-05',

职业:'程序员',

特长:'跳舞'

}

for(var i in object) {

console.log(i + ":" + object[i]);

}

输出:姓名: 侠侠

年龄: 22

性别: 男

出生日期: 1997-08-05

职业:程序员

特长:跳舞

动手小练习请自定义一个长度为7的数组,然后通过 for 循环将数组中的元素遍历出来。

求和:1~100的奇数和。

求和:1~100的偶数和。

使用对象定义一个人的个人信息(包括姓名、性别、年龄、出生日期、兴趣爱好、职业、特长等),然后使用 for...in 循环将这些信息遍历输出。

b739ec46bb5c46d9c0aa4ce35ba1ea56.png

关于找一找教程网

本站文章仅代表作者观点,不代表本站立场,所有文章非营利性免费分享。

本站提供了软件编程、网站开发技术、服务器运维、人工智能等等IT技术文章,希望广大程序员努力学习,让我们用科技改变世界。

[JavaScript中的for循环]http://www.zyiz.net/tech/detail-144859.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值