Abstract Factory
TypeScriptApplicationAbstract Factory in TypeScript
Creates matching button and dialog families for a selected UI theme without exposing concrete component classes to application code.
TypeScript
interface Button {
render(): string;
}
interface Dialog {
render(): string;
}
interface UiFactory {
createButton(): Button;
createDialog(): Dialog;
}
class LightButton implements Button {
render() {
return "Light button";
}
}
class LightDialog implements Dialog {
render() {
return "Light dialog";
}
}
class DarkButton implements Button {
render() {
return "Dark button";
}
}
class DarkDialog implements Dialog {
render() {
return "Dark dialog";
}
}
class LightUiFactory implements UiFactory {
createButton() {
return new LightButton();
}
createDialog() {
return new LightDialog();
}
}
class DarkUiFactory implements UiFactory {
createButton() {
return new DarkButton();
}
createDialog() {
return new DarkDialog();
}
}
function renderSettings(factory: UiFactory) {
return [
factory.createButton().render(),
factory.createDialog().render(),
];
}