TypeScript Truthy 與 Falsy

除了明確的 true 和 false 兩個 boolean 類型外，JavaScript 可以在需要用到布爾類型值的上下文中使用強制類型轉換將值轉換為布爾值。

1. 慕課解釋

Truthy 指的是轉換后的值為’真‘的值，Falsy 是在 Boolean 上下文中已認定可轉換為‘假‘的值。

需要注意下，空函數、空數組、空對象這些都是 Truthy，返回 true。

2. ! 與 !!

操作符 ! 表示取反，得到一個布爾值：

let fn = () => {}
let obj = {}
let arr: never[] = []

console.log(!fn)  // false
console.log(!obj) // false
console.log(!arr) // false

let num = 10
let str = 'imooc'

console.log(!num) // false
console.log(!str) // false

let n = null
let u = undefined
let N = NaN
let z = 0

console.log(!n)   // true
console.log(!u)   // true
console.log(!N)   // true
console.log(!z)   // true

解釋： 前三行的變量都是 truthy，為真，取反則得到 false。

操作符 !! 表示變量被強制類型轉換為布爾值后的值：

let fn = () => {}
let obj = {}
let arr: never[] = []

console.log(!!fn)  // true
console.log(!!obj) // true
console.log(!!arr) // true

let num = 10
let str = 'imooc'

console.log(!!num) // true
console.log(!!str) // true

let n = null
let u = undefined
let N = NaN
let z = 0

console.log(!!n)   // false
console.log(!!u)   // false
console.log(!!N)   // false
console.log(!!z)   // false

3. 小結

在 Vue.js 源碼中有很多 ! 和 !! 的操作，如果遇到要能明白其表達的意思。