JavaScript進階（三）

標籤：nbsp   car   中間   儲存   body   進階   迴圈   表達   [1]   

 

現在來說說判斷語句（if） if語句是基於條件成立才執行相應代碼時使用的語句。 文法： if(條件) {條件成立時執行代碼} 注意：if小寫，大寫字母（IF）會出錯！ 假設你應聘web前端技術開發崗位，如果你會html技術，你面試成功，歡迎加入公司 代碼錶示如下： <script type="text/javascript">  var mycarrer="HTML";  if(mycarrer == "HTML")  {   document.write("你面試成功，歡迎加入公司！");  } </script> 那麼二選一的方法怎麼弄呢？就是if...else if...else語句是在指定的條件成立時執行代碼，在條件不成立時執行else後的代碼 文法: if(條件) {條件成立時執行的代碼} else {條件不成立時執行的代碼} 假設你應聘web前端技術開發崗位，如果你會HTML技術，你面試成功，歡迎加入公司 否則你面試不成功，不能加入公司。 代碼示範如下： <script type="text/javascript">  var mycarrer="HTML";//mycarrer變數儲存技能  if(mycarrer == "HTML")   {document.write("你面試成功，歡迎加入公司。")}  else   {document.write("你面試不成功，不能加入公司。")} </script> 要在多組語句中選擇一組來執行，使用if...else嵌套語句。 文法： if(條件1) {條件1成立時執行的代碼} else if(條件2) {條件2成立時執行的代碼} ... else if(條件n) {條件n成立時執行的代碼} else (條件1、2至n不成立時執行的代碼) 假設數學考試，小明考試86分，給他做個評價，60分以下的不及格，60（包含60） -75分為良好，75（包含75）-85為很好，85（包含85）-100優秀。 代碼如下： <script type="text/javascript">  var score=86;  if(score<60){  document.write("成績不及格")  }else if(score<75){  document.write("成績良好")  }else if(score<85){  doucment.write("成績很好")  }else{  document.write("成績優秀") } </scripe> 當有很多選擇的時候，switch比if else方便 文法： switch(運算式) { case值1;  執行代碼塊1  break; case值2;  執行代碼塊2  break; ... case值n;  執行代碼塊n  break; dafault:  與case值1、case值2...case值n不同時執行的代碼 } 文法說明： switch必須賦初始值，值與每個case值匹配。滿足執行該case後的所有語句，並用 break語句來阻止運行下一個case。如所有case值都不匹配，執行default後的語句。 假設評價學生考試成績，10分滿分制，我們按照每一分一個等級將成績分等，並根 據成績的等級做出不同的評價。 代碼如下： <script type="text/javascript"> var myscore=6;//myscore變數儲存分數，假設為6 switch(myscore)//switch實現判斷，case 6匹配 { case 0: case 1: case 2: case 3: case 4: case 5:  degree="繼續努力";  document.write("評語"+degree+"<br>");  break; case 6:  degree="及格，加油！";  document.write("評語"+degree+"<br>");  break; case 7:  degree="湊合，奮進！";  document.write("評語"+degree+"<br>");  break; case 8:  degree="很棒";  document.write("評語"+degree+"<br>");  break; case 9: case 10:  degree="高手，大牛！";  document.write("評語"+degree+"<br>"); } </script> 很多事情不只是做一次，需要重複做。如列印十份試卷，每次列印一份，重複這個 動作，直到列印完成。這些事情，我們使用迴圈語句來完成，迴圈語句，就是重複 執行一段代碼。 for語句結構： for(初始設定變數；迴圈條件；迴圈迭代) {  迴圈語句 } 假如一個盒子裡面有六個球，我們每次取一個，重複從盒中取出球，直到球取完為止。 <script type="text/javascript"> var num=1; for(num=1;num<=6;num++)//初始化值，迴圈條件，迴圈後條件值更新 {  document.write("取出第"+num+"個球<br/>") } </script> 這裡詳細解釋一下執行的思路，協助大家理解： 第一次： 初始化:num=1 判斷：num<=6 輸出：取出第1個球 條件值更新：num++(num=num+1,num值為2) 第二次： 判斷：num<=6(因為第一次執行後num的值為2，判斷2<=6，條件為真) 輸出：取出第2個球 條件值更新：num++(num=num+1,num值為3) 第三次： 判斷：num<=6(因為第二次執行後num的值為3，判斷3<=6，條件為真) 輸出：取出第3個球 條件值更新：num++(num=num+1,num值為4) 第四次、第五次、//中間一樣 第六次：num<=6(因為第五次執行後num的值為6，判斷6<=6，條件為真) 輸出：取出第6個球 條件值更新：num++(num=num+1,num值為7) 第七次：num<=6(因為第六次執行後num的值為7，判斷7<=6，條件為假，所以不再 執行輸出語句，結束for迴圈。) 和for迴圈有相同功能的還有while迴圈，while迴圈重複執行一段代碼，直到某個 條件不再滿足。 while語句結構： while(判斷條件){  迴圈語句 } 使用while迴圈，完成從盒子裡取球的動作，每次取一個，共6個球。 <script type="text/javascript"> var num=0;//初始化值 while(num<=6)//條件判斷 {  document.write("取出第"+num+"個球<br/>");  num=num+1;//條件值更新 } </script> do while結構的基本原理和while結構是基本相同的，但是它保證迴圈體至少被執 行一次。因為它是先執行代碼，後判斷條件，如果條件為真，繼續迴圈。 do...while語句結構： do {   迴圈語句 } while(判斷條件) 我們試著輸出5個數字。 <script type="text/javascript">  num=1;  do {  document.write("數值為："+num+"<br/>");  num++;//更新條件 } while(num<=5) </script> 第一次： 輸出：數值為1 條件值更新：num++(num=num+1,num值為2) 判斷num<=5(num值為2,判斷2<=5,條件為真,進行do迴圈) 第二次，第三次，第四次都一樣 第五次： 輸出：數值為5 條件值更新:num++(num=num+1,num值為6) 判斷num<=5(num值為6,所以判斷6<=5，條件為假,不在迴圈) ps:我承認我偷懶了。剛剛打了一大段，結果因為沒儲存。。呵呵噠了。各位一定記 住及時儲存這個問題！！！ 在while for do...while while迴圈中使用break語句退出當前迴圈，直接執行後面 的代碼。 格式如下： for(初始條件;判斷條件;迴圈後條件值更新) {  if(特殊情況)  {break;}  迴圈代碼 } 當遇到特殊情況的時候，迴圈就會立即結束。看看下面的例子，輸出十個數，如果 數值為5，就停止輸出。 <script type="text/javascript">  var num;  for(num=1;num<=10;num++) {  if(num==5) {  break;//如果num是5，退出迴圈 } document.write("數值"+num+"<br/>") } </script> continue的作用是僅僅跳過本次迴圈，而整個迴圈體繼續執行。 語句結構： for(初始條件;判斷條件;迴圈後條件值更新) {  if(特殊情況)  {continue;}  迴圈代碼 } 上面的迴圈中，當特殊情況發生的時候，本次迴圈將被跳過，而後續的迴圈則不會 受到影響。好比輸出10個數字，如果數字為5就不輸出了。 <script type="text/javascript">  var num;  for(num=1;num<=10;num++) {  if(num==5)  {   continue;  }  document.write("數值"+num+"<br/>") } </script> 注意：上面的代碼中，num=5的那次迴圈將被跳過。 做個練習： 在一個大學的編程選修課班裡，我們得到了一組參加該班級的學生資料，分別是姓名、性別、年齡和年級，接下來呢，我們要利用JavaScript的知識挑出其中所有是大一的女生的的名字哦。 學生資訊如下：    (‘小A‘,‘女‘,21,‘大一‘),  (‘小B‘,‘男‘,23,‘大三‘),    (‘小C‘,‘男‘,24,‘大四‘),  (‘小D‘,‘女‘,21,‘大一‘),    (‘小E‘,‘女‘,22,‘大四‘),  (‘小F‘,‘男‘,21,‘大一‘),    (‘小G‘,‘女‘,22,‘大二‘),  (‘小H‘,‘女‘,20,‘大三‘),    (‘小I‘,‘女‘,20,‘大一‘),  (‘小J‘,‘男‘,20,‘大三‘) 代碼在評論中我會貼出來。   <!DOCTYPE  HTML> <html > <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>流程式控制制語句</title> <script type="text/javascript"> var infos=[["小A","女",21,"大一"],["小B","男",23,"大三"],["小C","男",24,"大四"],["小D","女",21,"大一"],["小E","女",22,"大四"],["小F","男",21,"大一"],["小G","女",22,"大二"],["小H","女",20,"大三"],["小I","女",20,"大一"],["小J","男",20,"大三"]];  for (var i=0;i<infos.length;i++)     {         if(infos[1]=="女"&&infos[3]=="大一")        {             document.write(infos[0]+"<br />")         }    }   </script> </head> <body> </body> </html>

JavaScript進階（三）