JS的循环语句

{======循环语句=====}

一、While循环格式：

while(判断的条件){
    循环体内容   
}

* 示例

    var count = 0 ; 
    while(count<5){
        document.write("hello world<br/>");
        count++;
    }

需求：计算1~100的总和。

var num = 1;
var result = 0;
while(num<=100){
    result +=num;   
    num++;
}
document.write("结果："+result);

二、do-while循环语句格式

do{
    循环语句；
}while(判断条件);

需求；计算1~100奇数的总和

var num = 1;
var result = 0;
do{
    if(num%2!=0){
        result +=num;
    }
    num++;
}while(num<=100);
document.write("结果："+result);

三、for循环语句

格式：
    for(初始化语句; 判断的条件 ; 循环后的语句){
        循环体语句；  
    }

需求；计算1~100偶数的总和

var result = 0 ;    
for(var i =  1 ; i<=100 ; i++){
    if(i%2==0){
        result +=i;
    }
}   

document.write("结果："+result);

四、练习

需求1：显示”*”为正方形，5行5列。

for(var i = 0 ; i<5;  i++){ // 控制行数
    for(var j  = 0 ; j<5 ; j++){ //控制列数
        document.write("*&nbsp;");  
    }   
    //换行
    document.write("<br/>")
}

document.write("<hr/>")

需求2：输出一个直角三角形

*
**
***
****
*****
for(var i = 0 ; i<5; i++){

    for(var j  =0 ; j<=i ; j++){
        document.write("*&nbsp;");  
    }   
    document.write("<br/>");
}

document.write("<hr/>")

需求3：打印九九乘法表

for(var i = 1 ; i<= 9 ; i++){
    for(var j = 1 ; j<=i ; j++){
        document.write(i+"*"+j+"="+(i*j)+"&nbsp;&nbsp;");   
    }   
    document.write("<br/>");
}

{=====for-in语句=====}

for-in语句的格式：
    for(var 变量名 in 遍历的目标){

    }

一、for-in语句的作用

1. 可以用于遍历数组的元素。 注意： 使用for-in语句遍历数组元素的时候遍历出来是数组的下标。

2. 可以用于遍历对象的所有属性数据。 注意： 使用for-in语句遍历对象的属性的时候，遍历出来的是对象的属性名。

• for-in语句遍历数组元素

  for(var index in arr){
      document.write(arr[index]+",");     
  }
  

• 普通的for循环遍历数组的元素

  for(var index = 0 ; index<arr.length ; index++){
      document.write(arr[index]+","); 
  }
  

二、创建一个对象

function Person(id , name){
    this.id = id;
    this.name = name;   
}   
//创建一个对象
var  p = new Person(110,"狗娃");

for(var property in p){
    document.write(p[property]+",");    
}

{====with语句====}

with语句

• 有了 With 语句，在存取对象属性和调用方法时就不用重复指定对象。

  格式：
      with(对象){
  
  
      }
  

• 示例：

  with(document){
      for(var i = 0 ; i<5; i++){
  
          for(var j  =0 ; j<=i ; j++){
              write("*&nbsp;");   
          }   
          write("<br/>");
      }
      write("<hr/>");
  }
  
  function Person(id , name){
      this.id = id;
      this.name = name;   
  }
  
  //创建一个对象
  var  p = new Person(110,"狗娃");
  
  with(p){
      document.write("编号："+ p.id);
      document.write("姓名："+ name);
  }
  

{====函数的定义====}

一、函数的定义格式：

function 函数名(形参列表){
    函数体 ;   
}

javascript的函数要注意的细节：

1. 在 javascript中函数 定义形参时是不能使用var关键字声明变量 的。
2. 在javascript中 的函数是没有 返回值类型 的，如果函数需要返回数据给调用者，直接返回即可，如果不需要返回则不返回。
3. 在 javascript中是没有函数 重载 的概念 的，后定义的同名函数会直接覆盖前面定义同名函数。
4. 在javascript中任何的函数内部都隐式的维护了一个arguments（数组）的对象，给函数 传递数据的时候，是会先传递到arguments对象中，
   然后再由arguments对象分配数据给形参的。

二、需求：定义一个函数做两个参数的加法功能。

function  add(a,b){
    var sum = a+b;
    document.write("两个参数的总和："+ sum);    
    //return sum;
}

function add(){
    document.write("长度："+arguments.length+"<br/>");
    for(var index = 0 ; index<arguments.length ; index++){
        document.write(arguments[index]+",");   
    }

    //var sum  = a+b+c; 
    //var sum = 0;
    //document.write("三个参数的总和："+ sum);
}

//调用函数
add(11,21,13,14);

{====函数的练习====}

需求、随便输入一个月份，计算一个月当中有多少天！

function showDay(){
    //找到对应 的标签对象。
    var inputObj = document.getElementById("month");
    //获取input标签数据
    var month = inputObj.value;
    /*
    if(month==1||month==3||month==5||month==7||month==8||month==10||month==12){
        alert("本月是31天");    
    }else if(month==4||month==6||month==9||month==11){
        alert("本月是30天");    
    }else if(month==2){
        alert("本月是28天");    
    }else{
        alert("没有该月份"); 
    }
    */

    month = parseInt(month);
    switch(month){
        case 1:
        case 3:
        case 5:
        case 7:
        case 8:
        case 10:
        case 12:
            alert("本月是31天");
            break;
        case 4:
        case 6:
        case 9:
        case 11:
            alert("本月是30天");
            break;
        case 2:
            alert("本月是28天");
            break;
        default:
            alert("没有该月份");
            break;
    }
}月份:<input id="month" type="text" /><input type="button" value="查询" onclick="showDay()" />