---
# System prepended metadata

title: 什麼是表達式與陳述式？
tags: [六角JS 直播班 - 2021 秋季班]

---

###### tags: `六角JS 直播班 - 2021 秋季班`
什麼是表達式與陳述式？
===

JavaScript的語句類型分為兩類：
- 表達式(Expression)
- 陳述式(Statement)，也有人說是表示式或運算式

## 表達式(Expression)

特點在於會回傳一個值，常見的如下：
- 純值
- 運算值
- 執行函式
- 函式表達式
- 正規表達式

### 以下來看看上述各個範例吧！
<br>



- **純值**
顧名思義就是單一個值，在DevTools輸入一個數值按下enter後，它將回傳該數值給你，因此數值為表達式之一。

![](https://i.imgur.com/WYrWaUU.png)


<br>

- **運算值**
透過一些運算子，計算後並回傳值。
```javascript=
123===123 //回傳true
5+2 // 回傳7
a=1 //回傳1，賦值運算子也是表達式
```
- **函式陳述式**
定義一個函式並呼叫它。
```javascript=
function abc (){
    return 123
}

abc(); //呼叫
//回傳結果：123
```

- **函式表達式(匿名函式)**
將函式賦予給一個變數，中間的=為運算子
```javascript=
let myLet = function () {}
```
<br>

## 陳述式(Statement)
執行命令的動作，下了指定執行完畢後，不會回傳值，以下將常見的列出：
可見[MDN](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements)會有更完整的分類！

- 流程控制
    - if...else
    - switch
    - block{}
- 宣告
    - var
    - let
    - const
    - class
    - return

- 迴圈
    - for
    - while

- 其他
    - debugger
    - export
    - import

<br>


## 舉一個特別的例子:if...else
if本身為陳述式，當中的{}放的是陳述式，()需要放的是一個條件，用來判斷如何執行後面的程式碼，所以()能放的僅能是表達式，如果放了不會回傳值的陳述式，Js不知道如何判斷則會報錯。
```javascript=
if(//表達式){
//陳述式
}else{
//陳述式
}

if(let a = 1){
console.log("我是陳述式")
}else{
console.log("我也是陳述式")
}

//Uncaught SyntaxError: Unexpected identifier

```

<br>

> **特別注意！容易搞混的觀念**
>表達式跟陳述式並非一定要是完整的語句，片段也可以，其中表達式可以單獨出現，也可以跟陳述式混用，如上方舉例！
<br>


## 結論
簡單來說，觀察是否會回傳值就是辨別這兩者最直接的方法，表達式會回傳值，陳述式則不會。
陳述式可以跟運算式混用，放入運算式的地方不可放成陳述式，不然可是會報錯的喔！

<br>

>**參考資料:**
>[何謂運算式(Expression)與陳述式(Statement)？](https://hackmd.io/EW_7JhRaTHmuH6XpksRguw)同學超讚的筆記🙌
>[JavaScript 表達式觀念及運用 - JS Expression](https://wcc723.github.io/development/2020/09/17/js-expression/)
>[陳述式與宣告 MDN](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements)

