本文知识点(目录):

1、while循环语句
    2、do...while循环语句
    3、for循环语句
    4、for...in循环语句
    5、附录1(with语句)
    6、附录2(打印多边形及乘法表)



1、while循环语句

格式:
while(判断条件){
循环体内容代码;
}

1.1、实例

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>while循环练习</title>
</head>
<script type="text/javascript">
/*
循环语句:while循环
格式:
while(判断条件){
循环体内容代码;
}
*/
//打印5次helloWorld
var a=0;
while(a<5){
document.write("helloWorld</br>");
a++;
}
//需求计算1-100的总和
var num=1;
var sum=0;
while(num<=100){
sum+=num;
num++;
}
document.write(sum+"</br>");
</script>
<body>
</body>
</html>

实例结果图

2、do...while循环语句

格式:
do{
循环体内容代码;
}while(判断条件)

2.1、实例

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<script type="text/javascript">
/*
循环语句:do...while循环
格式:
do{
循环体内容代码;
}while(判断条件);
*/ //需求计算1-100种中奇数的和
var b=1;
var sum=0;
do{
if(b%2!=0){
sum+=b;
}
b++;
}while(b<=100);
document.write(sum+"</br>"); </script>
<body>
</body>
</html>

实例结果图

3、for循环语句

格式:
for(初始化语句;判断条件;循环后的语句){
循环语句代码;
}

3.1、实例

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>for循环练习</title>
</head>
<script type="text/javascript">
/*
循环语句:for循环
格式:
for(初始化语句;判断条件;循环后的语句){
循环语句代码;
}
*/ //计算1-100的偶数和
var sum=0;
for(var c=1;c<=100;c++){
if(c%2==0){
sum+=c;
}
}
document.write(sum);
</script>
<body>
</body>
</html>

实例结果图

4、for...in循环语句

格式:
for(var 变量名 in 要遍历的目标变量名){ }

4.1、for...in语句的作用

1.可以用于遍历数组的元素。 注意:使用for-in语句遍历数组元素时遍历出的是数组下标
    2.可以用于遍历对象的所有属性。  注意:使用for-in遍历对象属性的时候,遍历出来的是属性名

4.2、实例

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>for...in语句练习</title>
</head>
<script type="text/javascript">
//for-in语句遍历数组
var arr=[12,17,13,19,20];
for(var a in arr){
document.write(arr[a]+"&nbsp;");//返回值:12 17 13 19 20 这里,如果直接输出a,得到的是该数组的下标值
} document.write("<br/>");//换行
//for-in语句遍历对象的属性值
function person(id,name){
this.id=id;
this.name=name;
}
var p=new person(110,"张三");
for(var a in p){
document.write(p[a]+"&nbsp;");//返回值:110 张三 这里,如果直接输出a,得到的是该对象的属性名
}
</script>
<body>
</body>
</html>

实例结果图

附录1

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<script type="text/javascript">
/*
with语句:有了with语句,在存储对象属性和调用方法时候不用重复指定对象了 格式:
with(对象){ }
*/
with(document){
for(var i=0;i<5;i++){
for(var j=0;j<5;j++){
write("*&nbsp;");//这里本来要写document.write()才能把值打印出到页面上,要想不重复写document,就在with()括号中写上document
}
write("</br>");
}
} function person(id,name){
this.id=id;
this.name=name;
}
document.write("<hr/>");
var p=new person(110,"狗娃");
with(p){
document.write(id+"&nbsp;"+name);//这里本来要p.id和p.name才能获取到值的,要想不重复写p,则在with()括号中写上p即可,然后用大括号括起来
} </script>
<body>
</body>
</html>

附录2

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<script type="text/javascript">
//需求1:打印出"*"的正方形,5行5列
for(var i=0;i<5;i++){
for(var j=0;j<5;j++){
document.write("*&nbsp;&nbsp;&nbsp;");
}
document.write("<br/>");
} document.write("<hr/>");//水平线
//需求2:打印出一个正直角三角形,5行5列
for(var i=0;i<5;i++){
for(var j=0;j<=i;j++){
document.write("*&nbsp;&nbsp;&nbsp;");
}
document.write("<br/>");
} document.write("<hr/>");//水平线
//需求3:打印出一个倒直角三角形,5行5列
for(var i=0;i<5;i++){
for(var j=4;j>=i;j--){
document.write("*&nbsp;&nbsp;&nbsp;");
}
document.write("<br/>");
} document.write("<hr/>");//水平线
//需求4:打印出一个九九乘法表
for(var i=1;i<10;i++){
for(var j=1;j<=i;j++){
document.write(j+"*"+i+"="+(i*j)+"&nbsp;&nbsp;&nbsp;&nbsp;");
}
document.write("<br/>");
}
</script>
<body>
</body>
</html>

附录2结果图

原创作者:DSHORE

作者主页:http://www.cnblogs.com/dshore123/

原文出自:https://www.cnblogs.com/dshore123/p/9416306.html

欢迎转载,转载务必说明出处。(如果本文对您有帮助,可以点击一下右下角的 推荐,或评论,谢谢!

java基础61 JavaScript循环语句之while、do...while、for及for...in循环(网页知识)的更多相关文章

  1. java基础63 JavaScript中的Number、Math、String、Date对象(网页知识)

    本文知识点(目录): 1.Number对象    2.Math对象    3.String对象    4.Date对象 (日历例子) 1.Number对象 1.1.Number对象的创建方式 方式1: ...

  2. Java基础break、continue语句的用法

    break适用范围:只能用于switch或者是循环语句中.当然可以用于增强for循环. break作用: 1. break用于switch语句的作用是结束一个switch语句. 2. break用于循 ...

  3. Java基础语法(基本语句)

    Java基础语法 标识符在程序中自定义的一些名称.由26个英文字母大小写,数字:0-9符号:_&组成定义合法标识符规则:1.      数字不可以开头2.      不可以使用关键字Java中 ...

  4. java基础之运算符与语句

    一.运算符 1.算数运算符 运算符 名称 举例 + 加法 A等于10,B等于3 则A+B=13 - 减法 A等于10,B等于3 则A-B=7 * 乘法 A等于10,B等于3 则A*B=30 / 除法 ...

  5. java基础58 JavaScript的几种格式和变量的声明方式(网页知识)

    1.JavaScript的几种格式 1.1.JavaScript的特点 1.跨平台性    2.安全性.(javaScript代码不能直接访问电脑硬盘上的信息) 1.2.Java与javaScript ...

  6. C#语句2——循环语句(for穷举、迭代和while循环)

    一.for循环拥有两类: (一).穷举: 把所有可能的情况都走一遍,使用if条件筛选出来满足条件的情况. 1.单位给发了一张150元购物卡,拿着到超市买三类洗化用品.洗发水15元,香皂2元,牙刷5元. ...

  7. java基础59 JavaScript运算符与控制流程语句(网页知识)

    1.JavaScript运算符 1.1.加减乘除法 加法:+(加法,连接符,正数)          true是1,false是0    减法:-    乘法:*    除法:/ 1.2.比较运算符 ...

  8. java基础69 JavaScript产生伪验证码(网页知识)

    1.伪验证码 <!doctype html> //软件版本:DW2018版 <html> <head> <meta charset="utf-8&q ...

  9. java基础64 JavaScript中的Arrays数组对象和prototype原型属性(网页知识)

    1.Arrays数组对象的创建方式 方式一: var 变量名=new Array(); //创建一个长度为0的数组. 方式二: var 变量名=new Array(长度); //创建一个指定长度的数组 ...

随机推荐

  1. 【bzoj3209】 花神的数论题

    http://www.lydsy.com/JudgeOnline/problem.php?id=3209 (题目链接) 题意 ${sum(i)}$表示${i}$的二进制表示中${1}$的个数.求${\ ...

  2. Linux Wget 命令实例讲解

    Linux wget是一个下载文件的工具,它用在命令行下.对于Linux用户是必不可少的工具,尤其对于网络管理员,经常要下载一些软件或从远程服务器恢复备份到本地服务器.如果我们使用虚拟主机,处理这样的 ...

  3. Bootstrap简单入门

    Bootstrap简单入门 BootStrap基本模板 <!DOCTYPE html> <html> <head> <meta charset="U ...

  4. 记录第一次阿里云服务器部署java web工程的经历

    起因:测试一个微信小程序,发现所有的请求要求为https的形式,开发工具忽略后手机无法测试,故尝试配置. 准备:阿里云服务器一台 域名一个(解析在服务器)     tomcat7.0.54     j ...

  5. springboot+mybatis使用PageHelper分页

    项目结构和spring搭建mybatis请参考springboot整合mybatis.在这个基础上配置分页. 一:导入PageHelper依赖 <dependency> <group ...

  6. 20155209 2016-2017-2 《Java程序设计》第五周学习总结

    20155209 2016-2017-2 <Java程序设计>第五周学习总结 教材学习内容总结 try语句用大括号{}指定了一段代码,该段代码可能会抛弃一个或多个例外. catch语句的参 ...

  7. 20155210潘滢昊 2016-2017-2 《Java程序设计》第5周学习总结

    20155210 2016-2017-2 <Java程序设计>第5周学习总结 教材学习内容总结 try with resources 关闭多个资源时用分号分隔 java.lang.Auto ...

  8. 正则表达式 grep文本查询 sed流处理 应用

    一.正则表达: ^:以什么什么开头,^a:以a字符开头 $:以什么什么结尾,b$:以b字符结尾 *:左边字符0-无穷个 +:左边字符1-无穷个 .:代表单字符 ?:前导字符为零个或1个 {n}:左面字 ...

  9. 基本控件文档-UISlider属性

    CHENYILONG Blog 基本控件文档-UISlider属性 Fullscreen     UISlide属性技术博客http://www.cnblogs.com/ChenYilong/ 新浪微 ...

  10. 简明Python教程 ~ 随书笔记

    本文是阅读<简明Python教程>所做的随书笔记,主要是记录一些自己不熟悉的用法,或者所看到的比较有意思的内容,本书英文版A Byte of Python, 中文译版 简明Python教程 ...