码迷,mamicode.com
首页 > 编程语言 > 详细

11-JavaScript for 循环

时间:2020-07-15 23:29:18      阅读:77      评论:0      收藏:0      [点我收藏+]

标签:for 循环   ++   inner   重复   for   style   阅读   continue   class   

1、JavaScript 循环

  如果您希望一遍又一遍地运行相同的代码,并且每次的值都不同,那么使用循环是很方便的。

  我们可以这样输出数组的值:

  一般写法:

  document.write(cars[0] + "<br>");

  document.write(cars[1] + "<br>");

  document.write(cars[2] + "<br>");

  document.write(cars[3] + "<br>");

  document.write(cars[4] + "<br>");

  document.write(cars[5] + "<br>");

  实例:

  cars=["BMW","Volvo","Saab","Ford"];

  for (var i=0;i<cars.length;i++){
  document.write(cars[i] + "<br>");
  }

2、不同类型的循环

  JavaScript 支持不同类型的循环:

  • for - 循环代码块一定的次数
  • for/in - 循环遍历对象的属性
  • while - 当指定的条件为 true 时循环指定的代码块
  • do/while - 同样当指定的条件为 true 时循环指定的代码块

3、for 循环

  语法:

  for (语句 1; 语句 2; 语句 3)
  {
      被执行的代码块
  }

4、For/In 循环

  JavaScript for/in 语句循环遍历对象的属性:

  实例:

  function myFunction(){

    var x;
    var txt="";
    var person={fname:"Bill",lname:"Gates",age:56};
    for (x in person){
    txt=txt + person[x];
  }
    document.getElementById("demo").innerHTML=txt;
  }

5、while 循环

  while 循环会在指定条件为真时循环执行代码块。

  语法:

  while (条件)
  {
      需要执行的代码
  }

6、do/while 循环

  do/while 循环是 while 循环的变体。该循环会在检查条件是否为真之前执行一次代码块,然后如果条件为真的话,就会重复这个循环。

  语法:

  do
  {
      需要执行的代码
  }
  while (条件);

  实例:

  function myFunction(){

    var x="",i=0;
    do{
    x=x + "该数字为 " + i + "<br>";
       i++;
  }
    while (i<5)
    document.getElementById("demo").innerHTML=x;
  }

7、比较 for 和 while

  如果您已经阅读了前面那一章关于 for 循环的内容,您会发现 while 循环与 for 循环很像。

  本例中的循环使用 for 循环来显示 cars 数组中的所有值:

  实例1:

  cars=["BMW","Volvo","Saab","Ford"];

  var i=0;
  while (cars[i]){
  document.write(cars[i] + "<br>");
  i++;
  }

  实例2:

  cars=["BMW","Volvo","Saab","Ford"];

  var i=0;
  for (;cars[i];){
  document.write(cars[i] + "<br>");
  i++;
  }

8、JavaScript break 和 continue 语句

 

  break 语句用于跳出循环,用于跳出 switch() 语句。

  continue 用于跳过循环中的一个迭代后,会继续执行该循环之后的代码。

9、

 

11-JavaScript for 循环

标签:for 循环   ++   inner   重复   for   style   阅读   continue   class   

原文地址:https://www.cnblogs.com/killer-j/p/13307081.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!