11-JavaScript基礎(chǔ)-while循環(huán)

循環(huán)基本概念

  • 循環(huán)結(jié)構(gòu)是程序中一種很重要的結(jié)構(gòu)。其特點是,在給定條件成立時,反復(fù)執(zhí)行某程序段, 直到條件不成立為止。

    • 給定的條件稱為循環(huán)條件,反復(fù)執(zhí)行的程序段稱為循環(huán)體
    • 循環(huán)結(jié)構(gòu)簡單來說就是:一次又一次的執(zhí)行相同的代碼塊
  • 現(xiàn)實生活中的循壞


  • JavaScript中的循壞

    • while語句;
    • do-while語句;
    • for語句;

while循環(huán)基本概念

  • 格式:
while ( 條件表達(dá)式 ) {
     語句1;
     語句2;
     ....
 }
  • while語句執(zhí)行流程:

    • 判斷條件表達(dá)式是否為真, 如果為真執(zhí)行后面大括號中的內(nèi)容
    • 執(zhí)行完畢再次判斷條件表達(dá)式是否還為真,如果為真執(zhí)行后面大括號中的內(nèi)容
    • 重復(fù)上述過程,直到條件不成立就結(jié)束while循環(huán)
      var num = 0;
      while (num < 10){
        alert(num); // 彈出0-9
        num++;
      }
      
  • 構(gòu)成循環(huán)結(jié)構(gòu)的幾個條件

    • 循環(huán)控制條件(條件表達(dá)式)
      • 循環(huán)退出的主要依據(jù),來控制循環(huán)到底什么時候退出
    • 循環(huán)體(while后面的大括號{})
      • 循環(huán)的過程中重復(fù)執(zhí)行的代碼段
    • 循環(huán)結(jié)束語句(遞增,遞減,break等)
      • 能夠讓循環(huán)條件為假的依據(jù),否則退出循環(huán)
  • while循環(huán)特點:

    • 如果while中的條件一開始就不成立,那么循環(huán)體中的語句永遠(yuǎn)不會被執(zhí)行
      var num = 10;
      while (num < 10){
          alert(num); // 什么都不彈
          num++;
      }
      

while循壞注意點

  • 死循環(huán)
    • 條件表達(dá)式永遠(yuǎn)為真, 循壞永遠(yuǎn)無法結(jié)束,我們稱之為死循環(huán)
    while (true){
        alert("nj666");
    }
  • 任何值都有真假性
    • 對于非Boolean類型的值, 會先轉(zhuǎn)換為Boolean類型再判斷
    while (1){ // 先把1轉(zhuǎn)換為Boolean, 然后再判斷真假
        alert("nj666");
    }
  • while 后如果只有一條語句它可以省略大括號
    • 如果省略大括號, while只會管制緊跟其后的那條語句
while (0)
   alert("會執(zhí)行我么?"); // 不會執(zhí)行
alert("nj 666");
  • 分號問題
    • 分號(;)也是一條語句, 代表空語句
  while (0);
  {
      alert("123"); // 會被執(zhí)行, 因為while管制的是分號(;)
  }
  • 最簡單的死循環(huán)
    • 企業(yè)開發(fā)中慎用死循環(huán), 會導(dǎo)致程序阻塞
  while (1);

while循壞練習(xí)

  • 提示用戶輸入一個正整數(shù)n, 計算1 + 2 + 3 + ...n的和
    • 企業(yè)開發(fā)從易到難, 先實現(xiàn)1加到5, 再實現(xiàn)1加到n
分析: 每次都是用上一次的和 加上一個遞增的數(shù)
注意看, 每次加號之后的數(shù)是遞增的2、3、4、5
            1 + 2 + 3 + 4 + 5 = 15
    ( 0 + 1)1 + 2
         (1 + 2)3 + 3
          1 + 2 + 3) 6 + 4
          (1 + 2 + 3 + 4) 10 + 5
    //    1.定義變量保存上一次的和
    var sum = 0;
    //    2.定義變量保存遞增的數(shù)
    var number = 1;
    while (number <= 5) {
        console.log("sum = "+ sum +" + number = "+ number);
        sum = sum + number;
        number++;
    }
    console.log("sum = " + sum);
  • 累加思想
    • 通過循環(huán)的形式進行累加操作,定義變量記錄每次變化后的結(jié)果

  • 獲取1~100之間 7的倍數(shù)的個數(shù)并打印,并統(tǒng)計個數(shù)
    var count = 1;
    var num = 0;
    while (count <= 100) {

        if (count % 7 == 0) {

            console.log("count = " + count);
            num++;//計數(shù)器
        }
        count++;
    }

    console.log("number = "+ num);
  • 計數(shù)器思想:
    • 通過循環(huán)的形式進行計數(shù)操作, 通過變量記錄每次變化的值
    • 企業(yè)開發(fā)中, 當(dāng)遇到要求統(tǒng)計什么什么 中 有多少個什么的時候,立刻想到計數(shù)器思想

break關(guān)鍵字

  • 作用:

    • 跳出Switch語句
      var num = 1;
      switch(num){
          case 1:
              console.log("壹");// 輸出壹
              break; // 跳出switch語句, 后面代碼不會執(zhí)行
          case 2:
              console.log("貳"); 
              break;
          default:
              console.log("非法數(shù)字");
              break;
      }
      
    • 跳出循環(huán)語句
      var num = 0;
      while(true){ 
          console.log(num);
          if(3 == num){
              break; // 當(dāng)num等于3時跳出循環(huán)
          }
          num++
      }
      
  • 注意點:

    • break關(guān)鍵字只能用于循環(huán)語句和switch語句, 在其它地方?jīng)]有意義
      break;  // 瀏覽器會報錯
      alert("我會輸出么?");
      
      if(true){
          break; // 瀏覽器會報錯
          alert("我會輸出么?");
      }
      
    • 在多層循環(huán)中,一個break語句只向外跳一層
      while (1){
          while (2){
              console.log("我是while2"); // 會被輸出多次
              break; // 跳出while2,但是不會跳出while1
          }
          console.log("我是while1");
      }
      
    • break后面的語句永遠(yuǎn)不會被執(zhí)行
      while (1){
          break;
          alert("會彈出來么?"); // 不會彈出
      }
      

continue關(guān)鍵字

  • 作用:

    • 跳過當(dāng)前循環(huán)體中剩余的語句而繼續(xù)下一次
      var num = 0;
      while (num < 10){
          num++;
          if(num % 2 == 0){
              continue;
          }
          console.log(num); // 1, 3, 5, 7, 9
      }
    
  • 注意點:

    • 只能用于循環(huán)結(jié)構(gòu), 在其它地方?jīng)]有意義
    • continue后面的語句永遠(yuǎn)不會被執(zhí)行
      while (1){
          continue;
          alert("會彈出來么?"); // 不會彈出
      }
      

dowhile循環(huán)基本概念

  • 格式
 do {
     語句1;
     語句2;
     ....
 } while ( 條件 );
  • do-while語句執(zhí)行流程:

    • 首先會執(zhí)行一次循環(huán)體中的語句
    • 接著判斷while中的條件表達(dá)式是否為真,如果為真再次執(zhí)行循環(huán)體中的語句
    • 重復(fù)上述過程,直到條件不成立就結(jié)束while循環(huán)
      var num = 20;
      do{
          console.log(num); // 輸出一次10
      }while (num < 10);
    
  • while循環(huán)特點:

    • 不管while中的條件是否成立,循環(huán)體中的語句至少會被執(zhí)行一遍
  • 應(yīng)用場景

    • 口令校驗

學(xué)習(xí)交流方式:
1.微信公眾賬號搜索: 李南江(配套視頻,代碼,資料各種福利獲取)
2.加入前端學(xué)習(xí)交流群:
302942894 / 289964053 / 11550038

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,460評論 6 538
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 99,067評論 3 423
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 177,467評論 0 382
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,468評論 1 316
  • 正文 為了忘掉前任,我火速辦了婚禮,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 72,184評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 55,582評論 1 325
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,616評論 3 444
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 42,794評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 49,343評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 41,096評論 3 356
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,291評論 1 371
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,863評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 44,513評論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,941評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,190評論 1 291
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,026評論 3 396
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 48,253評論 2 375

推薦閱讀更多精彩內(nèi)容