`#JavaScript` `#學習筆記` `#骨力走傱`

## 介紹
JavaScript 是弱型別語言，其特徵為宣告變數時，不必定義資料型別，該語言會根據變數被賦予的值，自動判斷當前的型別。

為了讓不同的型別之間能**進行運算**，JavaScript 會自動將不同型別轉為相同的型別，此行為稱之為「自動轉型」；而開發者主動使用轉型方法的行為，稱為「強制轉型」。

而轉型對象分為**值**與**物件型別**，轉型類型又分為「轉為字串」、「轉為布林值」、「轉為數字」，這裡先筆記值的轉型。

## 自動轉型
### 轉型成字串
#### (( 數字與字串相加 ))

let one = 1;
let two = "2";

console.log(one + two); // 12

* 只要數字與字串相加，數字就會被轉型為字串型別。

### 轉型成布林
#### (( 前言 ))
* 關於布林的自動轉型，需要先認識 Truthy value（真值）、Falsy value（假值），這些值並不完全等於 `true` 或 `false`，而是在轉換成布林值時，可以得到 `true` 或 `false`。
* Falsy value 有六種，其餘為 Truthy value。
* 0
* 空字串（empty string）
* `NaN`
* `null`
* `undefined`
* `false`

#### (( 陳述式條件區塊 ))

if("文字") {
    console.log("布林值是 true");
};

// 布林值是 true

* 字串型別可轉換為 Truthy value，故能執行 `console.log("布林值是 true")`。

#### (( 邏輯運算子 ))

console.log( 0 || "文字"); // -> false || true ，故回傳文字
console.log( 0 && "文字"); // -> false && true ，故回傳 0
console.log( !0 ); // -> !false ，故回傳 true
console.log( !!0 ); // -> !!false ，故回傳 false

### 轉型成數字
#### (( 比較運算子 ))

let a = "1";
let b = 1;
let c = a == b;

console.log(c); // true

c = a === b;
console.log(c); // false

* 在鬆散比較 `==` 的情況下，變數 `a` 會被轉型成數字，與變數 `b` 進行比較。
* 在嚴格比較 `===` 的情況下，變數 `a` 會維持原本的型別，與變數 `b` 進行比較，由於是不同型別，因此結果會是 `false`。
* 因此，若不希望被自動轉型干擾結果，請盡量使用嚴格比較 `===`。

#### (( 數字與字串進行 << 相加以外 >> 的運算 ))

let d = 10;
let e = "5";

console.log(d - e); // 5
console.log(d * e); // 50
console.log(d / e); // 2

console.log(d + e); // 105

* 只要數字與字串相加，數字就會被轉型為字串型別。
* 其他運算則會被轉型為數字型別。

#### (( 數字與布林進行運算及比較 ))

let f = false;
let g = 10;

console.log(f + g); // 10
console.log(f - g); // -10
console.log(f * g); // 0
console.log(f / g); // true

* 在 JavaScript 中，`false` 可以轉換為 0、`true` 可以轉換為 1，故 `console.log(f / g);` 的結果為 `true`。

## 強制轉型
### 轉型成字串
#### `toString()`

console.log("1000".toString()); // 1000
console.log(false.toString()); // false
console.log("".toString()); // ( 空白 )
console.log(null.toString()); // Uncaught TypeError
console.log(undefined.toString()); // Uncaught TypeError

* 可將非字串的值，強制轉型為字串。
* **無法**處理 `null`、`undefined`。
* 支援進制轉換。

#### `String()`

console.log(String("1000")); // 1000
console.log(String(false)); // false
console.log(String("")); // ( 空白 )
console.log(String(null)); // null
console.log(String(undefined)); // undefined

* 可將非字串的值，強制轉型為字串。
* **可以**處理 `null`、`undefined`。
* 不支援進制轉換。

### 轉型成布林
#### `Boolean()`

console.log(Boolean("true")); // true
console.log(Boolean(1000)); // true
console.log(Boolean(" ")); // true
console.log(Boolean("")); // false

* Truthy value（真值）會轉為 `true`；Falsy value（假值）會轉為 `false`。
* 注意**空白字串**與**空字串**的意思不同，故前者會轉換為 `true`，後者會轉換為 `false`。

### 轉型成數字
#### `parseInt()`

console.log(parseInt("123")); // 123
console.log(parseInt(5.783)); // 5
console.log(parseInt("123abc")); // 123
console.log(parseInt("abc123")); // NaN

* 會從字串的第一個字元開始擷取出有效整數，並轉為數字型態，直到出現非數字字元為止。
* 若第一個字元不是數字，會回傳 `NaN`。
* 遇到浮點數，會無條件捨去小數點後的內容。

#### `parseFloat()`

console.log(parseFloat("123")); // 123
console.log(parseFloat("5.783")); // 5.783
console.log(parseFloat("123abc")); // 123
console.log(parseFloat("abc123")); // NaN

* 與 `parseInt()` 的差別在於，遇到浮點數，會保留小數點後的內容。

#### `Number()`

console.log(Number("5.783")); // 5.783
console.log(Number(" 6.894 ")); // 6.894
console.log(Number("1 23")); // NaN
console.log(Number(" ")); // 0
console.log(Number("")); // 0
console.log(Number("123abc")); // NaN
console.log(Number("abc123")); // NaN
console.log(Number(true)); // 1
console.log(Number(undefined)); // NaN
console.log(Number(null)); // 0

* 比起 `parseInt()` 與 `parseFloat()`，`Number()`　是更加嚴謹的轉換方法，當內容無法轉換時，會直接回傳 `NaN`。
* 當數字**前後**有空格時，會忽略空格，回傳數字；但如果是數字**之間**有空格時，則無法轉換，會回傳 `NaN`。
* 空白字串與空字串會回傳 0。
* 字串中只要有文字，就會回傳 `NaN`。
* 布林值可轉換為 1 或 0。
* `undefined` 回傳 `NaN`；`null` 則回傳 0。

## 資料來源
* [JS 原力覺醒 Day010 - 自動轉型 （Coercion）](https://ithelp.ithome.com.tw/articles/10220471)
* [JavaScript：資料型態 (2) 強制轉換資料型態](https://ithelp.ithome.com.tw/articles/10312847)
* [你懂 JavaScript 嗎？#8 強制轉型（Coercion）](https://ithelp.ithome.com.tw/articles/10201512)
* [Day 12 Truthy Value 和 Falsy Value](https://ithelp.ithome.com.tw/articles/10289710)