變數設定

• 在JavaScript中，有三種不同的變數聲明關鍵字：const、let 和 var，它們各自具有不同的行為和作用域。
• const（常數）：
  • const 是用於聲明常數的關鍵字，常數的值在聲明後不能被重新賦值。
  • 聲明常數時必須進行初始化，否則會導致語法錯誤。
  • const 具有區塊級作用域，它在包含它的區塊內有效。

  const pi = 3.14159;
  pi = 3.14; // 這將導致錯誤，常數不可重新賦值
  

• let:
  • let 是用於聲明可重新賦值的變數的關鍵字，變數的值可以隨時修改。
  • 聲明變數時可以選擇性地進行初始化。
  • let 具有區塊級作用域，它在包含它的區塊內有效。

  let x = 10;
  if (true) {
  let x = 20; // 在區塊級作用域內重新聲明了一個新的 x 變數
  }
  console.log(x); // 輸出 10，外部作用域的 x 未受影響
  

• var:
  • var 是早期版本的JavaScript中用於聲明變數的關鍵字，它具有函數作用域。
  • 使用 var 聲明的變數會被提升（hoisted），這意味著它們會在函數或區塊的頂部被聲明，而不是在實際賦值之前。
  • var 聲明的變數可以在函數內隨處訪問，並且可以被重新賦值。

  var y = 10;
  if (true) {
    var y = 20; // 同一個變數 y 被重新賦值
  }
  console.log(y); // 輸出 20，外部作用域的 y 受影響
  

• 總結:
  • 推薦使用 const 和 let 替代 var，因為 const 和 let 更安全、更易於維護，具有區塊級作用域，有助於避免意外的變數提升和作用域問題。
  • 如果需要一個不會改變的值，使用 const。如果需要一個可重新賦值的變數，使用 let。避免使用 var，特別是在現代JavaScript中。選擇正確的關鍵字取決於變數是否需要被重新賦值。
• 以下簡單示例:

  <script>
   var number = 42; // 數字
   var text = "Hello, Woaaarld!"; // 字串
   var isTrue = true; // 布林值
   var fruits = ["apple", "banana", "orange"]; // 陣列
   var person = { name: "John", age: 30 }; // 物件
   console.log(text);
   </script>
  

  
  • 使用瀏覽器打開html檔案，並且在主控台觀看是否有成功執行。
• 條件語句:

    var age = 18;
    if (age >= 18) {
      console.log("成年人");
    } else {
      console.log("未成年人");
    }

• 迴圈:

for (var i = 0; i < 5; i++) {
  console.log(i); // 輸出 0 到 4
}

var j = 0;
while (j < 3) {
  console.log(j); // 輸出 0 到 2
  j++;
}

• Function:

function greet(name) {
  console.log("Hello, " + name + "!");
}

greet("Alice"); // 呼叫函數並傳遞參數

• 事件處理:

var button = document.getElementById("myButton");
button.addEventListener("click", function() {
  alert("按鈕被點擊了！");
});

• 條件判斷的 === & ==。JS的條件判斷還有一個是三個=的，不同於兩個=，這是代表有非常嚴謹的判斷，必須要一模一樣才會true以下是示範:

var x = 5;
    var y = "5";

    // 使用 === 運算符進行嚴格相等比較
    if (x === y) {
        console.log("x 和 y 嚴格相等"); // 這個條件不成立，因為 x 是數字，y 是字符串
    } else {
        console.log("x 和 y 不嚴格相等");
    }

    // 使用 == 運算符進行相等比較（不考慮數據類型）
    if (x == y) {
        console.log("x 和 y 相等"); // 這個條件成立，因為它只比較值，不考慮數據類型
    } else {
        console.log("x 和 y 不相等");
    }

• 陣列跟字典也一樣，即使內容相同一樣false，除非導向的是同一個以下舉例。

    var arr1 = [1, 2, 3];
    var arr2 = [1, 2, 3];
    // var arr2 = arr1;


    if (arr1 === arr2) {
        console.log("陣列嚴格相等"); 
    } else {
        console.log("陣列不嚴格相等");
    }

• 這會是陣列不相等，但如果把註解去掉，就會變成相等了，字典同理。

以上僅僅是 JavaScript 的基礎，語言非常強大，可用於構建互動式網頁、Web 應用程序和更複雜的專案。學習 JavaScript 的語法和概念是成為前端開發者的第一步。