您的位置:首页 > Web前端 > JavaScript

Javascript学习笔记-----条件语句、消息框、循环语句

2013-04-08 12:58 681 查看
条件表达式决定了JavaScript程序的流向。其他语言对应该使用if-else语句还是switch语句的传统观点同样适用于JavaScript。由于不同的浏览器针对流程的控制进行了

不同的优化。因此使用哪种技术更好没有定论。

1、if-else对比switch

使用if-else还是switch,最流行的方法是基于测试条件的数量来判断:条件数量越大,越倾向于switch而不是if-else。这通常归结于代码的易读性。这个观点认为,当

循环条件较少时if-else更易读,当条件数量较多时switch更易读。考虑如下代码:

[javascript] view
plaincopy

if(found){

//代码处理

}else(){

//其他代码处理

}

switch(found){

case true:

//代码处理

break;

default:

//其他代码处理

}

尽管两块代码完成的是相同的任务,但还是有很多人认为if-else语句比switch更容易度。然而,如果增加条件语句的数量,这种观点会被扭转过来:

[javascript] view
plaincopy

if(color == 'red'){

//代码处理

}else if(color == 'blue'){

//代码处理

}else if(color == 'brown'){

//代码处理

}else if(color == 'black'){

//代码处理

}else {

//代码处理

}

switch(color){

case 'red':

//代码处理

break;

case 'blue':

//代码处理

break;

case 'brown':

//代码处理

break;

case 'black':

//代码处理

break;

default :

//代码处理

}

大多数人会认为对于这段代码,switch表达式比if-else表达式可读性更好。

事实证明,大多数情况下switch比if-else运行的要快,但只有当条件数量很大时才能快得明显。这个两个语句主要性能区别是:当条件增加时,if-else性能负担增加的程度比switch要多。

因此,我们自然倾向于在数量较少是使用if-else,而在条件数量较大时使用switch。这从性能方面考虑也是合理的。

通常来说,if-else适用于判断两个离散值或几个不同的值域。当判断多有两个离散值时,switch语句是更佳选择。

2、优化 if-else

优化if-else的目标是:最小化到达正确分支前所需判断的条件数量。最简单的优化方法是确保最可能出现的条件放到首位。考虑如下代码:

[javascript] view
plaincopy

if(value < 5){

//代码处理

}else if(value > 5 && value < 10){

//代码处理

}else{

//代码处理

}

该段代码只有当value值经常小于5时才是最优的。如果value大于5或者等于10,那么每次到达正确分支之前必须经过两个判断条件。最终增加了这个语句的所消耗的平均时间。if-else中的条件

语句总应该是按照从最大概率到最小概率的顺序排列,以确保运行速度最快。

另一种减少条件判断次数的方法是把if-else组织成一系列嵌套的if-else语句。使用单个庞大的if-else通常会导致运行缓慢,因为每个条件都学要判断。例如:

[javascript] view
plaincopy

if(value == 0){

return result0;

}else if(value == 1){

return result1;

}else if(value == 2){

return result2;

}else if(value == 3){

return result3;

}else if(value == 4){

return result4;

}else if(value == 5){

return result5;

}else if(value == 6){

return result6;

}else if(value == 7){

return result7;

}else if(value == 8){

return result8;

}else if(value == 9){

return result9;

}else if(value == 10){

return result10;

}

在这个if-else表达式中,条件语句最多判断10次。假设value的值在1到10之间均匀分布。那么这会增加平均运行时间。为了最小化条件判断次数,代码可重写为一系列嵌套的if-else语句,比如:

[javascript] view
plaincopy

if(value < 6){

if(value < 3){

if(value == 0){

return result0;

}else if(value == 1){

return result1;

}else{

return result2;

}

}else{

if(value == 3){

return result3;

}else if(value == 4){

return result4;

}else {

return result5;

}

}

}else{

if(value < 8){

if(value == 6){

return result6;

}else{

return reuslt7;

}

}else{

if(value == 8){

return result8;

}else if(value == 9){

return result9;

}else{

return result10;

}

}

}

重写后的if-else语句每次到达正确分支最多经过4次条件判断。它使用二分法把值域分成一系列的区间,然后逐步缩小范围。当值的范围均匀分布在0到10之间时,代码运行的平均时间大约是前面例子的一半。

这个方法非常适用于有多个值域需要测试的时候(如果是 离散值,那么switch语句通常更为合适)。

javascript 消息框

警告框经常用于确保用户可以得到某些信息。

当警告框出现后,用户需要点击确定按钮才能继续进行操作

[javascript] view
plaincopy

alert("警告框");

alert("这是带有 \n 换行的警告框!");

确认框用于使用户可以验证或者接受某些信息

如果用户点击确认,那么返回值为 true。如果用户点击取消,那么返回值为 false

[javascript] view
plaincopy

if(confirm('你确认吗')){

alert("yes");

}else{

alert("no");

}

提示框经常用于提示用户在进入页面前输入某个值。

当提示框出现后,用户需要输入某个值,然后点击确认或取消按钮才能继续操纵。

如果用户点击确认,那么返回值为输入的值。如果用户点击取消,那么返回值为 null

[javascript] view
plaincopy

var name = prompt("请输入你的名字!","default");

if(name != null && name !=""){

alert("hello " + name);

}else{

alert("你什么都没输入!");

}

javascript 循环语句

for 将一段代码循环执行指定的次数

while 当指定的条件为 true 时循环执行代码

for 循环

[javascript] view
plaincopy

for (变量=开始值;变量<=结束值;变量=变量+步进值)

{

需执行的代码

}

for(i=1;i<=6;i++){

document.write("<h" + i + ">这是标题 " + i)

document.write("</h" + i + ">")

}

while 循环

[javascript] view
plaincopy

while (变量<=结束值)

{

需执行的代码

}

var i=1;

while(i<=6){

document.write("<h" + i + ">这是标题 " + i);

document.write("</h" + i + ">");

i = i+1;

}



for … in

使用 for...in 语句来遍历数组内的元素

for...in 语句用于对数组或者对象的属性进行循环操作。

for ... in 循环中的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。

[javascript] view
plaincopy

for (变量 in 对象)

{

在此执行代码

}

var x;

var arr = new Array();

arr[0] = 'ar1';

arr[1] = 'ar2';

arr[2] = 'ar3';

for(x in arr){

document.write(arr[x]+"</br>"); //结果为: ar1 ar2 ar3

}

-----------**-------------

var x;

var arr = new Array();

arr[0] = 'ar1';

arr[1] = 'ar2';

arr[2] = 'ar3';

for(x in arr){

document.write(x+"</br>"); //结果为: 1 2 3

}

return、break
continue关键字

return
语句用来规定从函数返回的值

function prod (v1,v2){
var res =  v1 * v2;
return res;
}
function funres (v1,v2){
alert(prod(v1,v2));
}


使用 break 语句来终止循环。

[javascript] view
plaincopy

for(i=0;i<10;i++){

if(i==5) {

break;

}

document.write(i+"</br>"); //结果为:0 1 2 3 4

}

continue

使用 continue 语句来终止当前的循环,然后从下一个值继续执行

[javascript] view
plaincopy

//使

for(i=0;i<10;i++){

if(i==5) {

continue;

}

document.write(i+"</br>"); //结果为:0 1 2 3 4 6 7 8 9

}

try...catch

作用是测试代码中的错误

当我们在网上冲浪时,总会看到带有 runtime 错误的 Javascript 警告框,同时会询问我们“是否进行 debug?”。像这样的错误信息或许对开发人员有用,对用户则未必

有两种在网页中捕获错误的方法:

1、使用 try...catch 语句。(在 IE5+、Mozilla 1.0、和 Netscape 6 中可用)

2、使用 onerror 事件。这是用于捕获错误的老式方法。(Netscape 3 以后的版本可用)

[javascript] view
plaincopy

try

{

//在此运行代码

}

catch(err)

{

//在此处理错误

}

function trycatchtest(){

try{

asdf();

} catch(err){

alert("发生了错误,代码"+err.description); //执行时会抛出 asdf未定义

}

}

16、throw 语句

声明的作用是创建 exception

throw声明的作用是创建 exception(异常)。你可以把这个声明与 try...catch 声明配合使用,以达到控制程序流并产生精确错误消息的目的。

语法: throw(exception) // exception可以是字符串、整数、逻辑值或者对象。

[javascript] view
plaincopy

function trycatchtest(){

var date = new Date();

var time = date.getHours();

try{

if(time ==10){

throw('e1');

}else if(time ==11){

throw('e2');

}else{

throw('e3');

}

}catch(err){

if(err == 'e1'){

alert("10点");

}else if(err =='e2'){

alert("11点");

}else{

alert("不知道!");

}

}

}

javascript
特殊字符

你可以在 JavaScript 中使用反斜杠来向文本字符串添加特殊字符。

[javascript] view
plaincopy

document.write("this is an \" apple\""); //输出为: this is an “apple”

下面的表格列出了其余的特殊字符,这些特殊字符都可以使用反斜杠来添加到文本字符串中:
代码
输出
\'
单引号
\"
双引号
\&
和号
\\
反斜杠
\n
换行符
\r
回车符
\t
制表符
\b
退格符
\f
换页符
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: