JavaScript的循环-CFANZ编程社区

JavaScript的循环

循环是将代码执行指定的次数。

一、for循环

1、for循环
for（语句1；语句2；语句3）{
执行的代码
}
注：语句1：条件的变量的初始值(代码执行前执行) 只执行一次
语句2：循环条件
语句3：循环(代码块)已被执行后执行的代码(通常是自增或自减)

2案例

for (var i = 0; i < 4; i++) {
    <!--console.log(i,"执行的代码")-->
        document.write("☆☆☆☆☆<br/>")
    }

二、break和continue

1、break：跳出循环终止

 for(var i=0;i<10;i++){
       if(i==5){
          <!--终止循环-->
            break;
        }
         console.log(i);
   }

2、continue：跳过循环中的某一步不终止循环

var j;
  for(j=10;j>0;j--){
      if(j==5){
          continue;//跳过当前循环
      }
      console.log(j);
  }

三、for....in循环

用于遍历对象的属性多于用对象，数组等数据类型。
for(prop in object){
prop:对象的属性
object:被遍历的对象
}

    var person={
       name:"曹杨",
       age:22
   }


   for(x in person){
       console.log(x,person[x]);
   }

四、while循环

1、while循环：当什么什么的时候
只要指定的条件为true，循环就可以一直执行代码
2、while（条件）{
条件成立时执行的代码
自增或自减
}
3、案例

  var person={
       name:"曹杨",
       age:22
   }


   for(x in person){
       console.log(x,person[x]);
   }

五、do...while循环

1、

var i=10;
    do{
        console.log(i,"接力赛继续");
        // document.write("@@@@@<br/>")
        i++;
    }while(i<4);

2、

       var i=5;
     while (i<4) {
          console.log(i,"接力赛继续");
        document.write("@@@@@<br/>")
         i++;
     }

六、使用循环打印图形

案例:
1、正方形

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

2、三角形

for (var j = 0; j < 8; j++) {
          <!--打印5行-->
         for (var i = 0; i < j+1; i++) {
            <!--一行打印？次 -->
            document.write("@ ")
       }
         document.write("<br/>")
     }

3、while打印倒三角

for(var m=0;m<8;m++){
        console.log(m+"*"+m+"="+m*m);
    }

七、函数的声明

1、变量声明通过var关键字
var a=10;
2、函数的声明
function 函数名(参数){
函数体
return 返回值
}

通过function关键字声明
func:函数名
x:函数的参数
{}:函数体

 function func(x){
         <!--执行的代码-->
        console.log("这是一个函数")
    }

3、函数的调用通过函数名调用
func();
func();
func();
func();

4、声明提升？
console.log(i);//undefined
var i=10;

console.log(func2);
<!--函数声明也存在提升-->
function func2(){
}

八、命名函数和匿名函数

1、命名函数

function func(){
        console.log("这是一个命名函数")
    }

调用func
func（）;

2、匿名函数
document.οnclick=function(){
console.log("这是一个点击事件驱动的匿名函数")
}
使用变量将匿名函数进行储存

var func3=function(){
        console.log("通过变量储存的匿名函数")
    }

通过变量名进行函数的调用
func3();
func3();
func3();
document.οnclick=func3;
案例：

function func2(){
         console.log("这是一个被点击事件驱动的命名函数")
     }
     document.onclick=func2;

九、传参函数和无参函数

1、无参函数

function func() {
        console.log("无参函数")
    }
    var func2 = function () {
        console.log("无参函数2")
    }

2、
传参函数 f(x)=x+1
参数：调用方法(函数)时，根据传入的参数的不同，而返回不同的结果。
x：形参形式上的参数

function func3(x) {
        console.log(x)  
    }

3、调用
func3(1);//1 实参实际的参数
func3(2);//2 实参
func3(3);
func3(4);

4、拼接字符串

function newStr(str1,str2) {
        console.log(str1+str2)        
    }

    newStr("hello","world");
    newStr("hello","China");
    newStr("hi","Nanjing");
    newStr("你好,","web21");