클래스 다이어그램 구조

클래스 다이어그램은 클래스이름과 멤버 변수, 함수들을 확인해 볼 수 있습니다.

예를 들어, 여기서 PageComponent 라는 클래스에는 HTMLUListElement 타입의 element 멤버 변수와,

attachTo라는 멤버 함수가 있는걸 확인해 볼수 있죠? 변수의 타입과 함수의 정확한 인자들, 리턴타입까지 확인해 볼 수 있습니다.

안에 빨간색 모양의 네모, 초록색 동그라미 보이시죠? 이건 접근 상태를 나타냅니다.

앞으로 보여드릴 다이어그램에서는 이런 디테일 까지 크게 신경 쓰지 않고 보셔도되요.

클래스는 C로 표기되고,

인터페이스는 I로 표기 됩니다.

제네릭 같은 경우는 이렇게 제네릭의 타입도 표기 되어져 있어서, 아! BaseComponenet는 제네릭 클래스이고, T extends HTMLElement 라는 타입이 있다라고 할 수 있어요.

이렇게 클래스 다이어그램은, 클래스와 인터페이스의 구조에 대해 한눈에 파악 할 수 있게 표기가 되어져 있습니다.