點燈坊

失くすものさえない今が強くなるチャンスよ

ECMAScript 之 Truthy Value

Sam Xiao's Avatar 2020-01-11

ECMAScript 除了有 Boolean Primitive 外,還有獨特的 Truthy Value 與 Falsy Value 概念;簡單的說,其他 Type 也能自動轉成 Boolean,這使得 if&&|| 有了更多應用。

Version

macOS Catalina 10.15.2
VS Code 1.41.1
Quokka 1.0.271
ECMAScript 2015

Falsy Value

if ()!! 會轉型為 false

以下 6 種值會視為 Falsy Value:

  • Booleanfalse
  • Empty String''
  • Empty Number0NaN
  • Non-Valuenullundefined

false 視為 falsy value 理所當然,但剩下 5 種就比較特別。

Truthy Value

if ()!! 會轉型為 true

除此以上 6 種外,剩下都是 truthy value:

  • Booleantrue
  • Non Empty String'foo'
  • Non Empty Number12
  • Object{}{name: 'Sam'}
  • Array[][1, 2, 3]

其中有幾個比較特別:

Infinity

let num1 = Infinity
let num2 = -Infinity

!!num1 // ?
!!num2 // ?

無論是 Infinity-Infinity,都是 truthy value。

!! 會將任意值轉成 boolean

falsy002

Object

let obj1 = null
let obj2 = {}
let obj3 = { title: 'FP in JavaScript' }

!!obj1 // ?
!!obj2 // ?
!!obj3 // ?

所有 object ,只要不是 null 都是 truthy value,無論是 empty object 或 non-empty object。

falsy000

Array

let arr1 = []
let arr2 = [1, 2, 3]

!!arr1 // ?
!!arr2 // ?

所有 array 都是 truthy Value,無論是 empty array [] 或 non-empty array。

falsy001

===, ==, !!

let num = 0

num === false // ?
num == false // ?
!!num // ?
  • ===:必須 type 與 value 都成立才會 truenum 是 number,故回傳 false
  • ==:自動轉型,num 會轉型成 false
  • !!:手動轉型, num 會轉型成 false

Conclusion

  • 大體上 primitive 空值 都是 falsy value,但 object 不受此限,因此 empty object 與 empty array 都是 truthy value

Reference

MDN, Truthy
MDN, Falsy