JavaScript - 語法

JavaScript 語法

JavaScript 語法包含一組規則，用於定義如何構建 JavaScript 程式碼。JavaScript 可以使用 JavaScript 語句來實現，這些語句放置在網頁中的<script>... </script> HTML 標籤內。

您可以將包含 JavaScript 的<script> 標籤放置在網頁中的任何位置，但通常建議您將其保留在<head> 標籤內。

<script ...>
   JavaScript code
</script>

Language - 此屬性指定您正在使用的指令碼語言。通常，其值為 javascript。儘管最近版本的 HTML（及其後續版本 XHTML）已逐步淘汰此屬性的使用。
Type - 此屬性現在建議用於指示正在使用的指令碼語言，其值應設定為“text/javascript”。JavaScript 已成為 HTML5 中的預設語言，並且現代瀏覽器也預設支援，因此現在無需新增type屬性。

因此，您的 JavaScript 程式碼段將如下所示：

<script language = "javascript" type = "text/javascript">
   JavaScript code
</script>

您的第一個 JavaScript 程式碼

讓我們以一個列印“Hello World”的示例為例。我們呼叫document.write 方法，該方法將字串寫入我們的 HTML 文件。此方法可用於寫入文字、HTML 或兩者。

<html>
<head>
   <title> Your first JavaScript program </title>
<head>
<body> 
   <script language = "javascript" type = "text/javascript">
      document.write("Hello World!")
   </script>     
</body>
</html>

此程式碼將產生以下結果：

Hello World!

JavaScript 值

在 JavaScript 中，您可以使用兩種型別的值。

固定值（字面量）
變數（動態值）

JavaScript 字面量

在下面的程式碼中，10 是一個數字字面量，而“Hello”是一個字串字面量。

<html>
<body>
   <script>
      document.write(10); // Number Literal
      document.write("<br />"); // To add line-break
      document.write("Hello"); // String Literal
   </script> 
</body>
</html>

此程式碼將產生以下結果：

10
Hello

JavaScript 變數

在 JavaScript 中，變數用於儲存動態資料。

您可以在 JavaScript 中使用以下關鍵字來定義變數。

var
let
const

您可以使用賦值運算子（等號）將值賦給變數。

在下面的程式碼中，變數 a 包含數值，變數 b 包含文字（字串）。

<html>
<body>
   <script>
      let a = 5; // Variable Declaration
      document.write(a); // Using variable
      document.write("<br>");
      let b = "One";
      document.write(b);
   </script>
</body>
</html>

此程式碼將產生以下結果：

5
One

空格和換行符

JavaScript 會忽略 JavaScript 程式中出現的空格、製表符和換行符。您可以在程式中自由使用空格、製表符和換行符，並且可以自由地以整潔一致的方式格式化和縮排程式，使程式碼易於閱讀和理解。

分號是可選的

JavaScript 中的簡單語句通常後面跟著分號字元，就像在 C、C++ 和 Java 中一樣。但是，如果每個語句都放在單獨一行，JavaScript 允許您省略此分號。例如，以下程式碼可以在沒有分號的情況下編寫。

<script>
   var1 = 10
   var2 = 20
</script>

但是，當以如下所示的單行格式化時，必須使用分號：

<script>
   var1 = 10; var2 = 20;
</script>

建議使用分號是一種良好的程式設計習慣。

大小寫敏感

JavaScript 是一種大小寫敏感的語言。這意味著語言關鍵字、變數、函式名以及任何其他識別符號必須始終使用一致的大寫字母進行鍵入。

因此，識別符號Time 和TIME 在 JavaScript 中將具有不同的含義。

在下面的程式碼中，我們比較了“time”和“Time”字串，它返回 false。

<html>
<body>
   <script>
      let a = "time";
	  let b = "Time";
	  document.write("a == b? " + (a == b));
   </script>
</body>
</html>

此程式碼將產生以下結果：

a == b? false

在編寫 JavaScript 中的變數和函式名稱時，應注意。

JavaScript 和駝峰命名法

帕斯卡命名法（Pascal Case）− 我們可以建立像 SmartWatch、MobileDevice、WebDrive 這樣的變數。它表示大駝峰式命名法字串。
小駝峰命名法（Lower Camel Case）− JavaScript 允許開發人員使用像 smartwatch、mobileDevice、webDriver 這樣的變數名和表示式名。這裡第一個字元是小寫。
下劃線命名法（Underscore）− 我們可以使用下劃線宣告變數，例如 smart_watch、mobile_device、web_driver 等。

JavaScript 不允許在變數名或表示式名中新增連字元。

JavaScript 關鍵字

JavaScript 包含多個關鍵字，我們可以將其用於特定任務。例如，function 關鍵字可用於定義函式。let、var 和 const 關鍵字可用於定義變數。

讓我們透過下面的示例瞭解關鍵字的使用。

示例

在這個示例中，我們使用了 function 關鍵字來定義函式。我們在函式內部使用了 var 關鍵字來定義 sum 變數。

此外，我們還在函式外部使用了 let 和 const 關鍵字來定義兩個變數並用值初始化它們。之後，我們使用函式名呼叫函式，並將變數作為引數傳遞。

<html>
<body>
   <script>
      function getSum(first, second) {
         var sum = first * second;
         document.write("The product of " + first + " and " + second + " is " + sum);
      }
	  let first = 3;
	  const second = 4;
      getSum(first, second);
   </script>
</body>
</html>

此程式碼將產生以下結果：

The product of 3 and 4 is 12

JavaScript 不允許使用 of 關鍵字作為變數名或表示式名。

JavaScript 識別符號

在 JavaScript 中，識別符號是變數、函式、物件等的名稱。

例如，在下面的程式碼中，p 是一個識別符號。

<script>
   pet p = 90;
</script>

在下面的程式碼中，'test' 是一個識別符號。

<script>
   function test() {
   }
</script>

以下是你應該遵循的定義有效識別符號的規則。

識別符號應始終以字母字元 (A-Z、a-z)、$(美元符號) 或 _（下劃線）開頭。
它不應該以數字或連字元開頭。
識別符號也可以包含數字，除了開頭之外。

JavaScript 中的註釋

JavaScript 支援 C 樣式和 C++ 樣式的註釋，因此 −

// 和行尾之間的任何文字都被視為註釋，JavaScript 會忽略它。
/* 和 */ 之間的任何文字都被視為註釋。這可能跨越多行。
JavaScript 也識別 HTML 註釋起始序列 <!--。JavaScript 將其視為單行註釋，就像 // 註釋一樣。
HTML 註釋結束序列 --> 未被 JavaScript 識別，因此應寫為 //-->。

示例

以下示例顯示瞭如何在 JavaScript 中使用註釋。

<script>
   // This is a comment. It is similar to comments in C++
   /*
   * This is a multi-line comment in JavaScript
   * It is very similar to comments in C Programming
   */
</script>

JavaScript 中的運算子

JavaScript 包含各種算術、邏輯、位運算等運算子。我們可以在 JavaScript 中使用任何運算子，如下面的示例所示。

示例

在這個示例中，我們定義了 var1 和 va2 並用數字值初始化它們。之後，我們使用 ‘*’ 運算子獲取 var1 和 var2 的乘積結果。

<html>
<body>
   <script>
      var1 = 10
      var2 = 20
      var3 = var1 * var2;
      var4 = 10 + 20;
      document.write(var3, " " ,var4);
   </script>
</body>
</html>

此程式碼將產生以下結果：

200 30

透過這種方式，程式設計師可以使用其他運算子和運算元。

當 ‘+’ 運算子的兩個運算元中的任何一個為字串時，它會將另一個運算元轉換為字串，並將兩個字串合併。

JavaScript 中的表示式

你可以透過組合變數、值和運算子在 JavaScript 中建立表示式。

例如，下面的表示式將兩個數字相加。

10 + 20;

下面的表示式將兩個變數的值相乘。

a * b;

下面的表示式將變數 c 的值除以 2。

c / 2;

示例

在下面的程式碼中，我們使用了賦值和算術表示式。

<html>
<body>
   <script>
	  let a = 10;
      let b = 2;

      let c = a; // Assigning a value of a to c. Assignment expression.
      let d = a + b; // Adding a and b. Arithmetic expression.
      let e = a - b; // Subtracting b from a.

      document.write("c = " + c + "<br>");
      document.write("d = " + d + "<br>");
      document.write("e = " + e + "<br>");
   </script>
</body>
</html>

此程式碼將產生以下結果：

c = 10
d = 12
e = 8

我們將在接下來的章節中探索更多表達式。

JavaScript 字元集

JavaScript 包含一組 Unicode 字元。

Unicode 字元在文字中新增特殊字元，例如表情符號、符號等。

例如，下面的 Unicode 字元將顯示左箭頭。

&larr

下面的 Unicode 字元將顯示 RS（盧比符號）符號。

然而，JavaScript 中有很多語法需要我們學習，在一章中不可能全部涵蓋。因此，在本節中，我們只介紹了基本的語法，以便開始學習 JavaScript，我們將在接下來的章節中介紹其他語法。

列印頁面