首页 > 代码库 > 关于JS的循环和函数,由入门到放弃

关于JS的循环和函数,由入门到放弃

1.条件语句if

if 语句

if 语句是 ECMAScript 中最常用的语句之一,事实上在许多计算机语言中都是如此。

if 语句的语法:

if (condition) statement1 else statement2

  

其中 condition 可以是任何表达式,计算的结果甚至不必是真正的 boolean 值,ECMAScript 会把它转换成 boolean 值。

如果条件计算结果为 true,则执行 statement1;如果条件计算结果为 false,则执行 statement2

每个语句都可以是单行代码,也可以是代码块。

还可以串联多个 if 语句。就像这样:

if (condition1) statement1 else if (condition2) statement2 else statement3

  

if (i > 30) {  alert("大于 30");} else if (i < 0) {  alert("小于 0");} else {  alert("在 0 到 30 之间");}

  2.js while循环

利用 while 循环在指定条件为 true 时来循环执行代码。

语法:

while (变量<=结束值){    需执行的代码}

  

注意:除了<=,还可以使用其他的比较运算符。

do while 循环

do...while 循环是 while 循环的变种。该循环程序在初次运行时会首先执行一遍其中的代码,然后当指定的条件为 true 时,它会继续这个循环。所以可以这么说,do...while 循环为执行至少一遍其中的代码,即使条件为 false,因为其中的代码执行后才会进行条件验证。

语法:

do{    需执行的代码}while (变量<=结束值)

  

 举个例子:

<html><body><script type="text/javascript">var i=0do {document.write("The number is " + i)document.write("<br />")i=i+1}while (i<0)</script></body></html>

  结果为:

The number is 0

  

3.switch语句

switch 语句是 if 语句的兄弟语句。

开发者可以用 switch 语句为表达式提供一系列的情况(case)。

语法:

switch (expression)  case value: statement;    break;  case value: statement;    break;  case value: statement;    break;  case value: statement;    break;...  case value: statement;    break;  default: statement;

  

每个情况(case)都是表示“如果 expression 等于 value,就执行 statement”。

关键字 break 会使代码跳出 switch 语句。如果没有关键字 break,代码执行就会继续进入下一个 case。

关键字 default 说明了表达式的结果不等于任何一种情况时的操作(事实上,它相对于 else 从句)。

switch 语句主要是为避免让开发者编写下面的代码:

if (i == 20)  alert("20");else if (i == 30)  alert("30");else if (i == 40)  alert("40");else  alert("other");

  等价的 switch 语句是这样的:

switch (i) {  case 20: alert("20");    break;  case 30: alert("30");    break;  case 40: alert("40");    break;  default: alert("other");}

  

4.函数

什么是函数?

函数是一组可以随时随地运行的语句。

函数是 ECMAScript 的核心。

函数是由这样的方式进行声明的:关键字 function、函数名、一组参数,以及置于括号中的待执行代码。

函数的基本语法是这样的:

function functionName(arg0, arg1, ... argN) {  statements}

  

function sayHi(sName, sMessage) {  alert("Hello " + sName + sMessage);}

  

如何调用函数?

函数可以通过其名字加上括号中的参数进行调用,如果有多个参数。

如果您想调用上例中的那个函数,可以使用如下的代码:

sayHi("David", " Nice to meet you!")

  调用上面的函数 sayHi() 会生成一个警告窗口。

函数如何返回值?

函数 sayHi() 未返回值,不过不必专门声明它(像在 Java 中使用 void 那样)。

即使函数确实有值,也不必明确地声明它。该函数只需要使用 return 运算符后跟要返回的值即可。

function sum(iNum1, iNum2) {  return iNum1 + iNum2;}

 下面的代码把sum函数返回的值赋予一个变量:

var iResult = sum(1,1);alert(iResult);	//输出 "2"

  

一个函数中可以有多个 return 语句,如下所示:

function diff(iNum1, iNum2) {  if (iNum1 > iNum2) {    return iNum1 - iNum2;  } else {    return iNum2 - iNum1;  }}

  

上面的函数用于返回两个数的差。要实现这一点,必须用较大的数减去较小的数,因此用 if 语句决定执行哪个 return 语句。

如果函数无返回值,那么可以调用没有参数的 return 运算符,随时退出函数。

例如:

function sayHi(sMessage) {  if (sMessage == "bye") {    return;  }  alert(sMessage);}

  

这段代码中,如果 sMessage 等于 "bye",就永远不显示警告框。

5.下面分享三个循环和函数的小程序

用js输出9*9表格

script type="text/javascript">			out = "<table border=1>"			for(i = 1; i <= 9; i++) {				out += "<tr height=50>"				for(j = 1; j <= 9; j++) {					out += "<td width=50>" + i * j + "</td>"				}				out += "</tr>"			}			document.writeln(out += "</table>")		</script>

  输出99乘法表

<script type="text/javascript">			var i = 1			while(i <= 9) //决定行数			{				var j = 1;				while(j <= i) //决定每一行有几个式子				{					document.write(j + "*" + i + "=" + (i * j) + " ");					j++;				}				i++;				document.write("<br>");			}		</script>

  函数和循环结合输出国际象棋棋盘:

<script type="text/javascript">			function qq(icq) {				document.write(‘<div style="background: ‘ + (icq ? "black" : "white") + ‘;width:60px;height:60px;float:left; "></div>‘); //三目运算符判断棋盘格子背景颜色的输出			}			for (var i = 0; i < 8; i++) {				for (var j = 0; j < 8; j++) {					if (j == 0) {						document.write(‘<div style="clear:both;"></div>‘);//清楚浮动					}					if (i % 2 == 0) {						if (j % 2 == 0) {							qq(true);//偶数行的偶数列输出黑色背景						} else {							qq();  //偶数行的奇数列输出白色背景						}					} else {						if (j % 2 != 0) {							qq(true); //奇数行奇数列输出黑色背景						} 						else {							qq();  //奇数行偶数列输出白色背景						}					}				}			}		</script>

  

关于JS的循环和函数,由入门到放弃