文西馬龍:http://blog.csdn.net/wenximalong/
js基本語法——三大流程控制
循環控制聽其名而知其意,就是讓你的代碼可以循環的執行。
案例:
編寫一個程序,可以打印10句
“你好,我是劉德華同志”
demo1.html
<html>
<head>
<script language="javascript">
for(var i=0; i<10; i++){
document.writeln("你好,劉德華同志!<br/>");
}
document.writeln("=======<br/>");
// while循環
var i=0;
while(i<10){
document.writeln("你好,我是劉德華 <br/>");
i++;
}
// do while循環
document.writeln("=======<br/>");
var i=0;
do{
document.writeln("你好,我是張學友 <br/>");
i++;
}while(i<10);
</script>
</head>
<body></body>
</html>
看for循環執行的流程,看內存中的變化 內存示意圖
程序流程圖,看圖知意。
循環控制
循環控制有三種
①for循環
for(循環初值;循環條件;步長){
語句; //循環體
}
②while循環
while(循環條件){
語句; //循環體
}
③do while循環
do{
}while(循環條件);
特別說明:do while循環是先執行,再判斷。
while和do while區別的通俗講解:
還錢的問題
while:上來先問你還不還錢,還錢,就不打你(先判斷,再執行)
do while:上來先打一頓,打完了再問,還錢嗎(先執行,再判斷)
var i=0;
do{
document.writeln("hello <br/>");
i++;
}while(i<10);
的流程圖
案例:
(1)計算1+2+…n的值
demo2.html
<html>
<head>
<script language="javascript">
var n=window.prompt("請輸入一個整數");
n=parseInt(n);
var res=0;
for(var i=0;i<=n;i++){
res+=i;
}
document.writeln("結果是"+res);
</script>
</head>
<body></body>
</html>
(2)計算1!+2!+…+n!的值
demo3.html
<html>
<head>
<script language="javascript">
var n=window.prompt("請輸入一個整數");
n=parseInt(n);
var res=0;
var temp=1;
for(var i=1;i<=n;i++){
for(var j=1;j<=i;j++){
temp*=j;
}
res+=temp;
tmep=1; // 清temp
}
document.writeln("結果是"+res);
</script>
</head>
<body></body>
</html>
這個案例用來做調試太好了
代碼執行流程圖,加深理解
細緻分析
n=2時
①執行完畢後,就執行②,此時i=1,則i<=n成立
執行④
就執行⑤,此時j=1,i=1,則j<=i成立
執行⑦,temp*=j,即temp=1*1
然後執行⑥,j++,此時j=2
接着執行⑤,此時j=2,i=1,則j<=i不成立
跳出裏層for循環,執行⑧,此時res=0,temp=1,則res+=temp;,即是res=0+1
接着執行⑨,temp=1,把temp清爲1
然後執行外層循環的③,i++,此時i=2
接着執行②,進行判斷,此時i=2,則i<=n成立
執行④
就執行⑤,此時j=1,i=2,則j<=i成立
執行⑦,temp*=j,即temp=1*1
然後執行⑥,j++,此時j=2
接着執行⑤,此時j=2,i=2,則j<=i成立
再執行⑦,temp*=j,即temp=1*2
然後再執行⑥,j++,此時j=3
接着執行⑤,此時j=3,i=2,則j<=i不成立
跳出裏層for循環,執行⑧,此時res=1,temp=2,則res+=temp;,即是res=1+2
接着執行⑨,temp=1,把temp清爲1
然後執行外層循環的③,i++,此時i=3
接着執行②,進行判斷,此時i=3,則i<=n不成立
跳出外層循環,然後執行⑨,res=3
如果有一個工具,幫助我們向上面一樣一步一步的分析就太好了,
在IE中進行js調試
在IE8中通過開發人員工具,就可以進行js的調試工作
注意:首先要在IE—工具—internet選項—高級 中 取消“禁止腳本調試”
對於低版本的IE瀏覽器,需要做下面的處裏,才能進行js調試
1.安裝Microsoft Script Editor
Microsoft Script Editor是office2003中的一個組件。要安裝Microsoft Script Editor,首先要有office的安裝程序。安裝步驟如下:
a.打開word,工具—宏—Microsoft腳本編輯器,這個時候會需要office的安裝文件
b.執行完上一步後,在Microsoft Script Editor中,調試—安裝web測試,這個時候還會需要office的安裝文件
c.完成安裝後,重啓IE和Microsoft Script Editor
2.調試
先決條件:
1.安裝Microsoft Script Editor或Microsoft Script debugger
2.IE中打開了腳本調試。
要在IE中進行javascript debugger調試,首先要在IE—工具—internet選項—高級 中 取消“禁止腳本調試”,然後重新啓動IE就可以使用Microsoft Script Editor。注意:IE較爲不穩定,可能會出現該選項失效的情況。關閉IE重來一遍。
如何使用Microsoft Script Editor進行調試:
在javascript代碼中,在你想要設置斷點的位置,加上“debugger”
在已經處於debugger狀態的Microsoft Script Editor代碼窗口中設置斷點
在IE中直接調用Microsoft Script Editor,請在IE地址欄中輸入"javascript:debugger"回車
Microsoft Script Editor的具體使用方法請參考Microsoft Script Editor的幫助文檔
雙擊下斷點,重點看局部變量的變化
firefox瀏覽器下:Javascript的調試利器Firebug
經驗:★★★js發生錯誤,如何定位其錯誤?
1.可以通過程序員的經驗來判斷
2.window.alert()來輸出信息
3.使用firebug的調試工具[cy--5,瀏覽器對象模型BOM]