템플릿 리터럴 타입을 사용하여 HeadingTag와 Direction 타입을 구현해주세요.

[limejin]

📚 161p - 163p 📌 템플릿 리터럴 타입을 사용하여 HeadingTag와 Direction 타입을 구현해주세요.

• HeadingTag는 "h1"부터 "h6"까지의 HTML 헤딩 태그를 나타내야 합니다.
• Direction은 "top", "bottom", "left", "right"에 대해서, "topLeft", "topRight", "bottomLeft", "bottomRight" 같은 값을 조합할 수 있어야 합니다.

  
  type HeadingNumber = 1 | 2 | 3 | 4 | 5 | 6;
  type Horizontal = "left" | "right";
  type Vertical = "top" | "bottom";

// 여기에 템플릿 리터럴 타입을 사용하여 HeadingTag와 Direction 타입을 정의하세요

// 예시: const heading: HeadingTag = "h3"; // 올바른 사용 const direction: Direction = "topLeft"; // 올바른 사용 const invalidDirection: Direction = "topCenter"; // 오류 발생해야 함

[kwonhygge]

아래와 같이 정의할 수 있습니다.

type HeadingNumber = 1 | 2 | 3 | 4 | 5 | 6;
type Horizontal = "left" | "right";
type Vertical = "top" | "bottom";

type HeadingTag = `h${HeadingNumber}`;
type Direction = Vertical | Horizaontal | `${Vertical}${Capitalize<Horizontal>}`;

[hotdog1004]

// HeadingTag
type HeadingNumber = 1 | 2 | 3 | 4 | 5l
type HeadingTag= `h${HeadingNumber}`;

// Direction 
type Vertical = "top" | "bottom";
type Horizon = "left" | "right";
type Direction = Vertical | `${Vertical}${Capitalize<Horizon>}`;

[samseburn]

type HeadingTag = `h${HeadingNumber}`
type Direction = Vertical | `${Vertical}${Capitalize<Horizon>}`

[frogk]

type HeadingTag = `h${HeadingNumber}`;

type Direction = Vertical | `${Vertical}${Capitalize<Horizontal>}`;

[limejin]

type HeadingTag = `h${HeadingNumber}`;
type Direction = `${Vertical}${Capitalize<Horizontal>}`;