1、while循环
语法格式
while(条件){
相关代码;
}
while循环的条件成立时,程序将会重复执行{}花括号中的代码。直到条件不成立,循环结束。
示例
var app = new PIXI.Application(400,400);
document.body.appendChild(app.view);
var i = 0;
while(i<5) {
var plane = new PIXI.Sprite.fromImage("res/enemy_04.png");
app.stage.addChild(plane);
plane.y = i * 100;
i += 1;
}
代码讲解
1、通过while循环,向舞台添加5架飞机
var i = 0; <br />while(i<5) { <br />var plane = new PIXI.Sprite.fromImage("res/enemy_04.png"); <br />app.stage.addChild(plane); <br />plane.y = i * 100; <br />i += 1; <br />} <br />通过 i 变量来控制 while 循环的次数,实现向舞台添加 5 架飞机
2、for循环
循环的作用:重复执行某一段代码。
语法格式
for( 初始值 ; 条件 ; 递增或递减 ){
相关代码;
}
for 循环的条件成立时,程序将会重复执行 {} 花括号中的代码。直到条件不成立,循环结束。
注意:for循环中的三要素“初始值、条件、递增或递减”,必须用分号来分隔。
示例
var app = new PIXI.Application(400,400);
document.body.appendChild(app.view);
for(var i=0;i<5;i++){
var plane = new PIXI.Sprite.fromImage("res/enemy_04.png");
app.stage.addChild(plane);
plane.x = i * 50;
plane.y = i * 100;
}
代码讲解
1、通过for循环,向舞台添加5架飞机
for(var i=0;i<5;i++){ <br />var plane = new PIXI.Sprite.fromImage("res/enemy_04.png"); <br />app.stage.addChild(plane); <br />plane.x = i * 50; <br />plane.y = i * 100; <br />} <br />通过 i 变量控制 for 循环的次数,向舞台添加 5 架飞机
3、定义数组
语法格式
1、定义一个空数组
var 数组名称 = [];
或者
var 数组名称 = new Array();
2、定义数组并赋值
var 数组名称 = [值,值,值…];
或者
var 数组名称 = new Array(值,值,值…);
注意: [] 或 new Array() 创建数组的功能完全一样,例如下边示例,通过 [] 来创建数组。
示例
var arr1 = [ ];
var arr2 = [10,"中国",3.14];
注意:数组中的多个值,是用逗号来分隔的
4、数组的存值
语法格式:
示例
var arr = [];
arr.push(100);
arr.push("北京市海淀区");
arr.push(9.8);
代码讲解
1、向数组中添加数据
arr.push(100);
将 100 添加到名称为arr的数组中
arr.push(“北京市海淀区”);
将 “北京市海淀区” 添加到名称为arr的数组中
arr.push(9.8);
将 9.8 添加到名称为arr的数组中
注意:数组中可以存储任意类型的数据,包括:数字型、字符串型、布尔型、Sprite类型等。
5、数组的取值
语法格式:
什么是数组下标?
下标就是数组中每个值对应的序号。而且下标默认都是从0开始,向后依次加1。如下图:
示例
var arr = [10,20,"上海",3.14];
console.log(arr[2]);
console.log(arr[0]);
代码讲解
1、获得数组中某下标对应的值
console.log(arr[2]);
显示数组中 2 下标对应的值
console.log(arr[0]);
显示数组中 0 下标对应的值
6、删除数组中的值
语法格式:
示例
var arr = [10,20,"上海",3.14];
arr.splice(2,1);
代码讲解
1、删除数组中某一个值
arr.splice(2,1);
删除名称为arr数组中的值,从2下标开始删除,向后,一共删除一个值
示例
var arr = [10,20,"上海",3.14,56,73];
arr.splice(1,3);
代码讲解
1、删除数组中多个值
arr.splice(1,3);
删除名称为arr数组中的值,从1下标开始删除,向后,一共删除3个值
7、数组长度
语法格式:
示例
var arr = [10,20,"上海",3.14];
console.log(arr.length);
代码讲解
1、显示数组长度
console.log(arr.length);
获得名称为arr数组的长度
8、数组与循环
示例
var arr = [10,20,"上海",3.14];
for(var i=0;i<arr.length;i++){
console.log(arr[i]);
}
代码讲解
1、通过for循环显示数组中所有值
for(var i=0;i
}
在 for 循环执行过程中,i 变量的值分别为:0 1 2 3,所以我们可以拿 i 变量充当数组的下标,从而实现获得数组中所有值
9、break
break是循环语句中的一个关键字。作用:跳出循环 或 终止循环
示例
console.log("程序开始");
for(var i=0;i<5;i++){
console.log("循环变量值为:"+i);
if(i == 3){
break;
}
}
console.log("程序结束");
代码讲解
1、for循环
for(var i=0;i<5;i++){
console.log(“循环变量值为:”+i);
}
通过i变量控制for循环的次数,一共循环5次,每次循环,都将i变量的值打印到控制台
2、break跳出循环
if(i == 3){ <br />break; <br />} <br />当i变量的值等于3时,循环语句全部结束,程序将从循环语句后的代码继续向下执行
10、continue
continue是循环语句中的一个关键字。作用:终止本次循环,进入下一次循环
示例
for(var i=0;i<5;i++){
if(i == 3){
continue;
}
console.log("循环变量值为:"+i);
}
代码讲解
1、for循环
for(var i=0;i<5;i++){
console.log(“循环变量值为:”+i);
}
通过i变量控制for循环的次数,一共循环5次,每次循环,都将i变量的值打印到控制台
2、continue终止本次循环,进入下一次循环
if(i == 3){
continue;
}
当i变量的值等于3时,i==3的这次循环将不再执行,而是直接进入下一次i==4的循环
11、浏览器调试 之 数组遍历删除
示例
var app = new PIXI.Application(500,600);
document.body.appendChild(app.view);
var bg = new PIXI.Sprite.fromImage("res/plane/bg/img_bg_level_3.jpg");
app.stage.addChild(bg);
var list = [];
for(var i=0;i<5;i++){
var plane = new PIXI.Sprite.fromImage("res/plane_blue_01.png");
plane.x = i * 100;
plane.y = 200;
app.stage.addChild(plane);
list.push(plane);
}
bg.interactive = true;
bg.on("click", removePlane);
function removePlane() {
for(var i=0;i<list.length;i++){
app.stage.removeChild(list[i]);
list.splice(i,1);
}
}
//改循环
function removePlane() {
for(var i=list.length-1;i>=0;i--){
app.stage.removeChild(list[i]);
list.splice(i,1);
}
}