Vad är skillnaden mellan string och string som är korsad med det tomma objektet i TypeScript

Bakgrund

Jag märkte att Chakra UI använder den här typen:

type ColorScheme = (string & {}) | "whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "linkedin" | "facebook" | "messenger" | "whatsapp" | "twitter" | "telegram" | undefined

Min första tanke var att kanske (string & {}) lurade autokomplettering till att fungera, vilket verkar stämma baserat på mina observationer:

// Has autocompletion
type Test = (string & {}) | "blue";
let x: Test = "blue"

// Doesn't have autocompletion
type Test2 = string | "blue";
let y: Test2 = "blue"

Lekplatslänk

Frågan

Varför i hela världen finns det en skillnad mellan string och (string & {})? Enligt min förståelse representerar typen {} vilket värde som helst utom null | undefined, så en sträng är en delmängd av det och enligt definition, om A ⊂ B så är A ∪ B=A, eller hur? Kanske är jag galen, men detta beteende verkar verkligen märkligt. Tack!

Relaterade artiklar