This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function isTextArea(input: HTMLInputElement | HTMLTextAreaElement): input is HTMLTextAreaElement { | |
return 'rows' in input; | |
} | |
if (isTextArea(input)) { | |
// input has type HTMLTextAreaElement | |
input.rows = 25; // Valid | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function isTextArea(input: HTMLInputElement | HTMLTextAreaElement): boolean { | |
return 'rows' in input; | |
} | |
if (isTextArea(input)) { | |
// input still has union type | |
input.rows = 25; // Compiler error | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
if ('rows' in input) { | |
// input has type HTMLTextAreaElement | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// animal has type Animal or 'Dog | Cat | Fox' | |
const animal: Animal = readAnimal(); | |
if (animal.kind === "Fox") { | |
// animal has type 'Fox' | |
throw new Error('What does the Fox say?'); | |
} | |
// 'Fox' removed because of throw above | |
// animal has type 'Dog | Cat' |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
interface Dog { | |
kind: 'Dog'; | |
bark(): string; | |
} | |
interface Cat { | |
kind: 'Cat'; | |
purr(): string; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function setupInput(input: HTMLInputElement | HTMLTextAreaElement) { | |
if ('rows' in input) { | |
// These properties are only valid for HTMLTextAreaElement | |
input.rows = 25; | |
input.cols = 80; | |
input.wrap = 'hard'; | |
} else { | |
// These properties are only valid for HTMLInputElement | |
input.width = 400; | |
input.height = 50; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function setupInput(input: HTMLInputElement | HTMLTextAreaElement) { | |
input.value = ''; // Valid since value is common to both types | |
if (input instanceof HTMLTextAreaElement) { | |
// These properties are only valid for HTMLTextAreaElement | |
input.rows = 25; | |
input.cols = 80; | |
input.wrap = 'hard'; | |
} else { | |
// These properties are only valid for HTMLInputElement |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Note that the type of 'primitive' in each branch is different | |
switch (typeof primitive) { | |
case "number": return primitive.toFixed(2); | |
case "string": return primitive.toUpperCase(); | |
case "boolean": return !primitive; | |
default: throw new Error("Unexpected type") | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
element?.innerText = 'Hello'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const element: HTMLElement | null = document.getElementById('target'); | |
element.innerText = 'Hello'; // Compiler error - null in union | |
if (element !== null) { | |
element.innerText = 'Hello'; // null removed from union | |
} |