chap11_循环条件与循环分类

一、循环结构

[wm_notice]概念：循环结构可以 通过某个条件，重复且有规律的执行程序代码[/wm_notice]

顺序执行流程 ： 从第一个行开始 执行到最后一行 每行代码的执行次数：1

条件分支执行流程： 经过某个条件决定代码是否执行，每行代码的执行次数：0~1

循环执行流程： 经过某个条件决定代码是否执行，每行代码的执行次数：0~N

var i = 1;
//条件满足 执行 1次
if(i <= 10){
console.log("hello");
}

var i = 1;
//条件满足 执行 n 次
while(i <= 10){
console.log("hello");
}

二、循环分类

1、while循环

语法

while( 循环条件 ){
当满足循环条件时执行
  执行完毕后再次判断条件是否满足，满足则再次执行，直至条件不满足停止循环
}

有限次数循环的三要素

1、定义循环变量：var i = 1;

2、定义循环条件：( i <= 10)

3、改变循环变量的值：i++;

有限次数循环示例（循环输出10个hello）

//1、定义循环变量 (定义起点)
var i = 1;
//2、定义循环条件 (设置终点)
while( i<=10 ){
//需要重复执行的功能代码
  console.log("hello");
//3、改变循环变量的值（控制步长）例：跑步、爬楼梯
i++;
}

2、for循环

[wm_notice]特点：将明确次数循环的三要素融入语法整体[/wm_notice]

语法

for(定义循环变量;定义循环条件 ;改变循环变量的值 ){
当满足循环条件时执行
  执行完毕后再次判断条件是否满足，满足则再次执行，直至条件不满足停止循环
}

示例（输出10个hello）

for(var i = 0; i < 10;  i++){//循环10次
console.log("hello");
}

执行流程与while一致，但代码位置不一样

三、使用循环创建元素

示例代码

var app = new PIXI.Application(500,700);
document.body.appendChild( app.view );
for(var i = 1; i<=10; i++){
//添加图片元素（飞机图片）
var enemy1 = new  PIXI.Sprite.fromImage("img/enemy1.png");
//Math.random() * n：得到0~n-1之间的随机数
//y坐标 随机范围 ：0~应用窗口高度-图片高度 +1
enemy1.y = Math.random() * (700-74 +1);
//x坐标 随机范围 ：0~应用窗口宽度-图片宽度 +1
enemy1.x = Math.random() * (500-104 +1);
app.stage.addChild( enemy1 );
}