# if 與 switch 之間的愛恨情仇
### *if 與 switch 的使用時機？*

> 在 javascript 裡面有需要作為判斷時的方法有兩種，使用`if..else`跟`switch`這兩種方法，
先來説說`if else`

## if...else

if (條件式){
    如果滿足條件式則執行這裡面內容
}

// 如果不需要不滿足要進行其他的方式則可單純使用if

if (條件式){
    如果滿足條件式則執行這裡面內容
} else {
    如果不滿足則執行這裡面內容
}

// 如需要在條件式之中不滿足後執行的內容則放在else的大括號內

if (條件式 1){
    如果滿足條件式 1 則執行這裡面內容
} else if (條件式 2){
    如果滿足條件式 2 則執行這裡面內容
} 
.
.
.
else if (條件式 n){
    如果滿足條件式 n 則執行這裡面內容
} else {
    如果不滿足則執行這裡面內容
}

// 連接的else if可以多數 如果需要進行多重判斷時使用

條件式是使用布林值作為判斷的基礎，可以使用邏輯運算子`&&(and)` `||(or)` `!(not)`
>邏輯 AND (&&)
運算式1 && 運算式2
運算式1 或是 運算式2 可以被轉換成 false的話，則回傳false在這個條件式，
因此，&&只有在兩邊運算元都是True 時才會回傳 True，否則回傳 false。

>邏輯 OR (||)
運算式1 || 運算式2
運算式1 或者 運算式2 可以被轉換成 true的話，則回傳true在這個條件式，
因此，||在兩個運算元有任一個是True 時就會回傳 True，否則回傳 false。

>邏輯 NOT (!)
!運算式
一個反轉運算式的方式，一個運算元能被轉換成True時，回傳false ， 不然回傳 true。
!true === false , !false === true

## switch


switch(n){
  case val1:
    console.log('n 等於 val1 要執行的項目') //如果 n === val1 則執行這裡面內容    
    [break;] // 使用 break 當程式運行至此 中斷 switch 動作
	case val2:
    console.log('n 等於 val2 要執行的項目') //如果 n === val2 則執行這裡面內容
	default:
    console.log('當 n 都不等於 case 的時候要執行的項目') //如同 if 之中 else 行為
    [break;]
}

// switch會進行嚴謹比對使用 === 的方式比對 n 的值與 case 的值，
// 是否有在值與型別上的相等有的話才會進行 case 冒號後的段落
// default 是可以放在任意 case 之間的段落

// 當break不使用的情境

switch(i){
	case 0:
		console.log('hello ')
	case 1:
		console.log('world ')
	case 2:
		console.log('JS 棒棒!')
}

// 當 i = 0 log會印出 ‘hello world JS棒棒!’
// 當 i = 1 log會印出 ‘world JS棒棒!’
// 當 i = 2 log會印出 ‘JS棒棒!’

// 由此可知當不使用 break 中斷時 switch 會從他符合開始的 case 段落
// 往下執行到結束

## 寫在結尾
`if else` 跟 `switch` 在效能上 `switch` 會比 `if else` 好一些，
但是如果你有複雜項的判斷時 `switch` 可能就無法滿足你的需求，
`if else` 有時候會因為巢狀的包裹導致過於大的層級，要注意~🧐

### 參考資料
[MDN - if...else](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements/if...else)
[MDN - switch](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements/switch)
[梗圖倉庫](https://memes.tw/)

###### tags: `Javascript` `JS 直播班 - 2021 秋季班` `六角學院`