1.=

(1)=設值
(2)= =比較
(3)= = =型態
(4)=> 箭頭函式

      var x = 5

      if (x==5) {     
        console.log("ok");
      }

      if (x===5) {     
        console.log("ok~");
      }
      
      var b = () => {
        return "bunny-2";
      };

      var temp = b();
      console.log(temp); // bunny-2

2.非 0、undefined、null則true

false:

      //   var x = 0;
      //   var x = false;
      //   var x = undefined
      //   var x = null
      //   空白會錯誤 x is not defined

      if (x) {
        console.log("ok");
      }

3.寫歪了，把最大的{}刪掉，整理乾淨

        var score = Math.floor(Math.random() * 101);
        console.log(score);
        if (score >= 90) {
            console.log('甲上');
        } else {
            if (score >= 80) {
                console.log('甲');
            } else {
                if (score >= 70) {
                    console.log('乙上');
                } else {
                    console.log('乙');
                }
            }
        }

        var score = Math.floor(Math.random() * 101);
        console.log(score);
        if (score >= 90) {
            console.log('甲上');
        } else if (score >= 80) {
            console.log('甲');
        } else if (score >= 70) {
            console.log('乙上');
        } else {
            console.log('乙');
        }

4.當下跑可以的程式，還是記得要偵錯，避免疏漏

      var d = new Date();
      var hour = d.getHours();
      console.log(hour);

      //   var hour = 17;  偵錯用
      //   console.log(hour); 

      if (8 <= hour && hour <= 11) {
        console.log("上午課程");
      } else if (hour == 12) {
        console.log("中午用餐時間");
      } else if (13 <= hour && hour <= 16) {
        console.log("下午課程");
      } else {
        console.log("非課程時間");
      }

5.()的意義：

CSS () =>var()、calc()、@media()、:nth-child()、hsl()
JS() => 執行:fuction、apple(){}、if(條件)、(條件)?: 、(匿名的函式)

(匿名的函式)
因為之後用不到這個倉庫，就不需要佔記憶體且不會影響他人

      (function () {
        //var showMsg_v3 = 刪除
        console.log("狗溝好吃~~~~");
      })();

6.{}的意義

Js{}:物件、要做的事

物件

      var apple = {
        //key1:value1 屬性
        chinese: 100,
        english: 90,
        math: 70,
      };

要做的事

      var x = 5;

      if (x == 5) {
        console.log("ok");
      }

7.Switch 滿足指定條件執行，可以一次執行很多事

「一定要+break!!!!!!!」---------------------------->重點
沒有加break時，會產生串聯效應，case1做完會接著做case2

      switch (x) {
        case 5:
          console.log("ok"); // x=5 'ok'
          console.log("hi");
          var y = 88;
          console.log(y);
          console.log("bee");
          break; //一定要加 才能關掉
        case 15:
          console.log("貓咪大戰六周年聽說很魔有空去聽看看"); // x=5 'ok'
        default:
          console.log("今天沒下雨了");
      }

並且可合併case

      switch (mm) {
        case 4:
        case 6:
        case 9:
          console.log("30天");
          break;
      }

8.注意數值跟字串!!!

        function showTV() {
            var elm = document.getElementById('inputChannel').value;   //input輸入是字串
            console.log(elm);
            document.getElementById('demo').innerText = elm;

            switch(elm){
                case 20:   //但是這要符合數值                                              
                   console.log('ok');   //所以不出現。
            }
        }

解法:轉數值

             var elm = parseInt(document.getElementById("inputChannel").value);

9.while 無窮迴圈

離開的方式:1.break 2.條件不成立

1.while + if

      var x = 5;
        while (x == 5) {
            console.log('ok'); //一定會顯示 因為非0則ture
            if (x == 5) {
                x = 666;
                console.log(x)  //之後條件不符合var x = 5; 會跳出
            }
        }


        var secret;
        while (secret !== "1234") {
        secret = prompt("1.網頁必須輸入通關密碼1234才會停止");
        if (secret == "1234") {
         break   //會跳出
              }
        }   

2.do + while

      do {
        console.log("ok");
      } while (false);

3.while

      var n = 0;
      var x = 0;
      while (n < 10) {
         n++;     // n = n+1
         x += n;  // x = n+x
      }
      document.getElementById("demo1_10").innerHTML = x;

10.do{做這個} while(符合這個 我才回去繼續做)

會先執行一次，才判斷條件

    do {
        console.log("ok");
      } while (false);

11.for vs. while

for(囉嗦) => 已知次數
while(條件) => 次數未知

(1)for

      for (var i = 0; i < 10; i++) {    //一行做判斷
        if (i % 2 == 0) {
          // 跳過這一次不做 ,2 4 6 byebye
          continue;
        }
        if (i == 7) {
          // 跳出
          break;
        }
        console.log(i);
      }

(2)while

        var secret;
        while (secret !== "1234") {
        secret = prompt("1.網頁必須輸入通關密碼1234才會停止");
        if (secret == "1234") {
         break
              }
        }   

12.縮寫

cnt =cnt+1
cnt++
cnt += 1

13.innerText v.s innerHTML

innerText會是寫內文，所以要改innerHTML

會印出字串

      star = star + "<br>"; //換行
      document.getElementById("pSquare").innerText = star; 

改

      star = star + "<br>"; //換行
      document.getElementById("pSquare").innerHTML = star; 

14.for() vs. for(..of..)

(1)for():可以直接抓始末 (抓自己想要的範圍~~)

      var weekList = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"];
      
      for (var i = 0; i < weekList.length; i++) {
        // []從0開始
        // length 有幾個
        console.log(weekList[i]); //跑幾次就顯示幾次
      }

(2)for(..of..):每個都要抓時使用(通通抓起來看~~)

      var weekList = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"];
      //of 撈出來看看元素
      for (var item of weekList) {  //of 放集合 ex:[]
        console.log(item);
      }

15.for

(1) for

      var tot = 0;
      for (var cnt = 1; cnt <= 10; cnt++) {
        //cnt++  , cnt =cnt+1  ,cnt += 1
        tot = tot + cnt;
      }
      console.log(`計算從 1 加到 10: ${tot}`);

(2) for + if

      for (var i = 0; i < 10; i++) {
        //一行做判斷
        if (i % 2 == 0) {
          // 跳過這一次不做 ,2 4 6 byebye
          continue;
        }
        if (i == 7) {
          // 跳出
          break;
        }
      }

(3) for..of.. (賦值給item of 放集合 ex:[])

      var weekList = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"];
      
      //of 撈出來看看元素
      for (var item of weekList) {
        //賦值給item of 放集合 ex:[]
      }

(4) for..in..(賦值給item in 放物件) 並 只會尋「有值」的資料出來

      for (var item in s1) {
        //賦值給item in 放物件
        console.log(item); //chinese;english;math(屬性)
        console.log(s1["item"]); // s1 物件裡沒有"item字串"的屬性 undefined
        console.log(s1[item]); //100;90;80 抓到值
        console.log(typeof item); //string
      }

辛苦了(拍拍自己)