在前幾天的文章中，大部分都在探討 JavaScript 運作相關的理論，接下來應該會漸漸地開始進入語法相關的主題。而今天要來介紹程式語言中很基本但不可忽視的概念：表達式（Expression） 與 陳述式（Statement）。這兩者是 JavaScript 的兩大的語句類型，若能夠理解並熟練地使用它們，必定能夠使開發過程變得更流暢。

先講它們最主要的差異：

表達式（Expression） 會回傳結果。
陳述式（Statement） 不會回傳結果。

表達式（Expression）

表達式（Expression），或稱 運算式，通常是一個較零碎的程式碼片段，有點類似英文當中的單字或片語。當 JavaScript 執行一個表達式時，它將計算出一個值並回傳這個結果。

常見的表達式包括 純值、變數、運算子、呼叫函式、正規表達式 等。

以下為常見範例：

'Hi!' // 回傳 'Hi!'
'Hello, ' + 'World!' // 回傳 'Hello, World!'
1 + 1 === 2 // 回傳 true

另外呼叫函式也會拿到回傳值，這也屬於表達式：

function add(a, b) {
  return a + b;
}

function sayHi() {
  console.log('Hi!')
}

add(1,2) // 這是表達式，回傳 3
sayHi() // 這是表達式，回傳 undefined

陳述式（Statement）

陳述式（Statement），通常是一個較完整的程式碼片段，有點類似英文當中的句子或段落。它裡面可能包含數個陳述式和表達式。當 JavaScript 執行陳述式時，不會回傳結果。

常見的陳述式包括 宣告（let, const function）、
條件陳述式（if、else、switch）、迴圈陳述式（for、while） 等。

以下為常見範例：

// 以下每行都是一個陳述式
// 但單獨看 x, y, 123, 'Eiko' 的話，都為表達式

let x;
x = 123;
const y = 'Eiko';

// 以下 if...else... 整組可視為一個陳述式
// 單獨看「1 + 1 === 2」為表達式

if (1 + 1 === 2) {
  // ...
} else {
  // ...
}

// 以下整組 for 迴圈可視為一個陳述式
// 單獨看「console.log(i);」也為陳述式

for (let i = 0; i < 9; i++) {
  console.log(i);
}

結語

今天介紹了 JavaScript 的兩大的語句類型與它們的最主要差異：

• 表達式（Expression） 會回傳值。
• 陳述式（Statement） 不會回傳值。

當熟悉以上概念後，相信以後開發上能更得心應手。那我們明天見~