大家好～我是姐姐恩！身為資訊小白的我，起初對於參賽主題非常苦惱，最後決定利用此次機會，延續學校的課(Java)，了解網頁前端三劍客之一的JavaScript！
所以接下來30天，我將在這裡紀錄我當天的學習筆記及統整後的學習內容，請大家多多指教！
＊學習內容主要取自MDN Web Docs及彭彭老師的YT課程。

Day04—— 字串、控制流語句(條件式)、迴圈結構、Loops and iteration

字串String

JS建立字串方法：用單引號或雙引號包住字串內容（不能混用）。
字串間、字串與變數間連接方式：加號（+）。(可以連續使用，連接多個字串與變數)

const firstString = "2 + 2"; // 建立字串常值(較建議使用)
const secondString = new String("2 + 2"); // 建立字串物件

字串的方法(表格)

• 數字 vs. 字串
  以加號連接字串與數字，可能依舊正常運作，瀏覽器便會把數字轉換成字串，並將這兩個字串連接在一起，更好的方式，是提前將數字轉換成字串，在進行連接。

如果是不方便將數字轉換成字串，或是將字串轉換成數字，而不更動原先的變數，可以這樣做：

//let song = "Fight the Youth"; //原
song = `Fight the Youth`; //使用重音符建立字串

模版字符串(Template literals)

建立方式：使用重音符( )包裹住字串內容。
功能：1. 可以簡化字串連接上繁瑣的方式。2. 保留了程式碼中的斷行方式，不再需要使用斷行字母。

//let song = "Fight the Youth";
song = `Fight the Youth`; //使用重音符建立字串

let score = 9;
let highestScore = 10;
// let output =
//   'I like the song "' +
//   song +
//   '". I gave it a score of ' +
//   (score / highestScore) * 100 +  
//   "%.";
output = `I like the song "${song}". I gave it a score of ${
  (score / highestScore) * 100
}%.`;    //使用重音符包裹住所由字串(綠色字)，並使用佔位符包裹變數名稱(紫色字)，可在字串中加入變數，

// ${} 佔位符

搜尋字串的位置： browserType.indexOf();
＊因為字串的順序是從零開始，所以假如有一個字串為apple共五個字（主字符串），而我們需要提取ple的部分（子字符串），位置是在由左至右的第三個，則字串的索引值依序為｛0, 1, 2, 3, 4｝，故提取後的結果會是2。

＊如果在主字符串中找不到子字符串時，結果將出現-1，故可以利用這樣的規則，確認字串中不包含某特定子字符串。
＃

• slice (開始為索引值, 結束索引值)：知道該子字符串的位置（索引值）後，可以利用slice (開始為索引值, 結束索引值)提取。（如果提取的是某個字符後剩下的全部，結束索引值可以不填）

＊replace(被替換的字符, 欲換成的字符)
書寫方式：＃

控制流程語句（判斷式）

if…else敘述句：

使用方式：

if(欲測試的條件A){ 
上述條件如果回傳True，欲進行的程式碼。
}else if(另一個欲測試的條件B){ //如果A條件回傳False，則往條件B測試
上述的B條件回傳True，欲進行的程式碼。
}else{
上述條件如果回傳False，則進行此程式碼。
};

//可以結合前面所述的模板字符串、邏輯運算符一起使用

Switch語句
範例:

 const action = 'say_hello';
 switch (action) {
   case "say Hello":{ //
      para.textContent = "Hello.";
      break;
   }
   case 'say_hi': {
     // 是去判斷 action === 'say_hi'
     let message = 'hi';
     console.log('message', message);
     break;
  }
  default: {
    break;
  }
}

運作方式:
switch後面的括號內為表達式expression或value值(這邊代名為A)，case後會須輸入一個expression或value值(這邊代名為B)，如果switch的A和case後的B相同，則執行case區塊中的程式碼，並停止執行此switch區塊，否則，跳至下一個case並重複上述運作方式。

迴圈

for迴圈

for(迴圈變數初始值;迴圈條件(終止條件);迴圈變數增量){
陳述式
}

運作方式:在有限範圍內重複執行程式碼，並在每一次完成迴圈時，執行變數增量(遞增或遞減)。

• for後面括號內項目皆為選擇項，可以視情況不寫，但「;」不能省略。
• 如果迴圈條件(終止條件)被省略，將變成閉環(無止盡)。

while迴圈

while（迴圈條件(終止條件)）{
陳述式;
}

運作方式:不斷重複迴圈內程式碼(不一定能預測次數)，值到迴圈條件不成立，才會停止。

do...while

do {
陳述式
}while (條件式);

運作方式:在條件範圍內，會不斷重複直到一個該條件判斷為false。

學習資源：
處理文字 - JavaScript中的字串
字串Text formatting
有用的字符串方法
控制流語句(條件式)（if/else, switch）
迴圈結構（for, while）
Loops and iteration
[JS] Switch Case 的使用
for迴圈

今天就練習到這邊～～明天見！