TypeScript using part of enum set to define type of variable

Question

I have enum that looks like this

export enum Alignment {
  Top = 'top',
  Right = 'right',
  Bottom = 'bottom',
  Left = 'left',
}

Commonly I will use it in defining interface for e.g. react component props like

interface CompProps {
  align: Alignment;
}

But now wonder if I can use only the part of this enum, like

interface CompProps {
  align: `part of Alignment: left and top`;
}

Is there a common pattern for this?

I may think of:

A. align: Alignment.Left | Alignment.Top;

B. creating new enum for this task like

enum CompAlignment {
  Top = Alignment.Top,
  Left = Alignment.Left,
}

I think you answered your own question align: Alignment.Left | Alignment.Top; should work best. — Titian Cernicova-Dragomir
– Titian Cernicova-Dragomir, Commented Apr 24, 2018 at 13:57

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

According to typescript docs:

When all members in an enum have literal enum values, some special semantics come to play.

The first is that enum members also become types as well! For example, we can say that certain members can only have the value of an enum member.

This means option A is valid as you can leverage union enums to achieve what you are looking for.

enum ShapeKind {
    Circle,
    Square,
}

interface Circle {
    kind: ShapeKind.Circle;
    radius: number;
}

interface Square {
    kind: ShapeKind.Square;
    sideLength: number;
}

let c: Circle = {
    kind: ShapeKind.Square,
    //    ~~~~~~~~~~~~~~~~ Error!
    radius: 100,
}

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Apr 24, 2018 at 15:27

JediusX

1271 gold badge1 silver badge7 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

TypeScript using part of enum set to define type of variable

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related