# JS 直播班- 筆記專區

## WEEK 01 周末小任務
## var、let、const 的差異？

### var (全域變數)
宣告一個可隨意更改其內容的變數
* 因為容易汙染全域，所以不建議使用。
* 將變數宣告成全域的話，可能會有以下幾個問題:
1. 變數名稱衝突，發生預期外的程式錯誤。
2. 佔用記憶體，無法回收。
### let(區塊變數)
* 用於宣告一個「只作用在當前區塊的變數」，可隨意更改其內容，但不能重複宣告。
* 重複宣告就會報錯，範例如下:

### const
* 宣告一個只可讀取的不可變常數。類似*let*具有區塊範圍，但const宣告的變數不能重複賦予值，也不能重複宣告。
* 重新賦予值會報錯，範例如下:

### 補充: *全域/函式/區塊範疇(global/function/ block scope):
>範疇(scope)為變數可作用或可視的範圍[color=#fa0]。

* 全域範疇(global scope)
* 可以在任何地方取用變數的範圍，不再函式也不再區塊內。
* 函式範疇(function scope)
* 變數只存活在函式裡面。在ES6之前，JS 只有全域及變數範疇。
* 區塊範疇(block scope)
* 變數只存活在{} 裡面，概念跟函式範疇很像。因應ES6新增let 和const，才新增了區塊範疇。
* var 不適用block scope。var本身為全域變數，因此使用{}來宣告範圍並不具任何意義。如下範例:

### 重點歸納(變數宣告方式)

| | var | let | const |
| ---------- | ---- | -------- | ---------- |
| 範圍 | 全域 | 當前區塊 | 當前區塊 |
| 重複宣告 | 可 | 不可 | 不可 |
| 重新賦予值 | 可 | 可 | 不可(不易) |
| 函式範疇* | 是 | 是 | 是 |
| 區塊範疇* | 否 | 是 | 是 |

## call by reference (傳參考)、by value(傳值)

參數引用的方式基本可分成++Call by value++ & ++Call by reference++。

### Call by value(傳值)
* 要將參數傳遞到另個變數上時，直接複製一份給新變數。
* 原本的變數和新變數都各佔一個記憶體空間，因此修改其中一個並不會造成另一個也連動。
* 所有基本型別都是這類型的。
* 範例如下

### Call by reference(傳址)
* 要將參數傳遞到另個變數上時，並不會再給一個新的位置，而是將原本的記憶體位置直接指向新變數上面。
* 值與值之間是連動的，故改變其中一個值後，另一個也會跟著改變。

* 物件/陣列/函式都是這類型的。
* 範例如下:

* **==例外: 如果是直接用等號賦予新值，則會產生一個新的記憶體空間。==**


## undefined 與 null 的差異

### undefined
* 沒有賦予值的意思。
* 如變數本身沒有回傳值的話，預設為underfined。
* undefined 本身就是型別的類型之一。

### null
* 有被賦予值，被設定為空值。
* 可用於清空資料來釋放記憶體空間
(比如當一個值不再需要使用時)
* 屬於物件(object)類型。
* 操作DOM元素時，如果想要抓取的元素並不存在，會回傳null。

### undefined + null
* 兩者都是基本型別(primitives types)的一種。

## WEEK 02 周末小任務
## if、switch 差別

先看MDN 的解釋怎麼說。

>**[if...else](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements/if...else)**
當條件成立的時候會執行 if 陳述式裡的程式，而不成立時則執行另外一個陳述式。
>**[switch](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements/switch)**
switch 語句 會比對一個 表達式 裡頭的值是否符合 case 條件，然後執行跟這個條件相關的 陳述式, 以及此一符合條件以外，剩下其他條件裡的陳述式。

簡單來說，兩者都是用於需要判斷某個表達式是否符合某條件的狀況。而兩者的差異主要在==語法==和==使用時機==上。

### 語法

// if 語法

if (boolean){
   statement1} // 如果符合條件式內容，則會執行statement 1
else if(boolean){ 
statement2
} //如果不符合條件式1，但符合條件式2，會執行statement 2
else {
   statement3} // 如果不符合條件式，則會執行statement3
   
// switch 語法
switch (表示式){ 
case 值1 : 語句1 break; 
case 值2 : 語句2 break; 
... 
default : 語句n break; 
}

### 使用時機

* 如果有明確的選擇值，而不需要複雜的運算和判斷，就可以使用switch。
* 如果需要進行特定範圍內的運算判斷，例如 (a>=2&&b<=10)，適合用if else。

## 何謂強制轉型、以及如何作到轉換型別？

### 強制轉型(coercion)
當兩個不同型別的值需做運算時，JS會自動將其中一方轉成數字(number)或字串(string)。

* 值1(string)+值2(number):值2會被轉成字串，結果為字串
* 值1(string)-值2(number):值2會被轉成數字，結果為數字
* 值1(string)\*值2(number):值2會被轉成數字，結果為數字
* 值1(string)\值2(number):值2會被轉成數字，結果為數字
> 結論為，除了加法會變成字串相加以外，其他JS會轉換成數字型別。

範例如下:

### 如何轉換型別

#### 字串&數字轉換
* parseInt(): 將輸入的字串轉成整數。
* 語法: `parseInt(string, radix)`;
* `string`:待轉換的字串
* `radix`:能代表該進位系統的數字。(預設值為10進位?)
* toString(): 將數值以字串形式回傳。
* 語法: `toString()`。

let c = 1
c = c.toString(); \\結果為 字串:"1"

## 參考文件：
Week 01:[1](https://snh90100.medium.com/javascript%E4%B8%ADundefined%E5%92%8Cnull%E7%9A%84%E5%B7%AE%E5%88%A5-1f48e9be5e02)|[2](https://medium.com/itsems-frontend/javascript-pass-by-value-reference-sharing-5d6095ae030b)|[3](https://blog.techbridge.cc/2018/06/23/javascript-call-by-value-or-reference/)|[4](https://pjchender.blogspot.com/2016/03/javascriptby-referenceby-value.html)|[5](https://twitter.com/fanny_codes/status/1289561087206203393?s=21)|[6](https://www.w3schools.com/js/js_scope.asp)|[7](https://cythilya.github.io/2018/10/17/what-is-scope/)|[8](https://josephcardillo.medium.com/the-difference-between-function-and-block-scope-in-javascript-4296b2322abe)
Week 02:[1](https://www.itread01.com/content/1549602198.html)|[2](https://kknews.cc/zh-tw/code/8q6zonn.html)|[3](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements/switch)|[4](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Statements/if...else)|[5](https://developer.mozilla.org/en-US/docs/Glossary/Type_coercion)