tab menu UI

tab menu pattern

다음의 코드는 탭 메뉴를 싱글톤 패턴에서 프로토타입으로 리팩토링하는 과정에 대해 살펴보겠습니다.

싱글톤 탭 메뉴 패턴

See the Pen tab 싱글톤 by jaeheekim (@jaehee) on CodePen.

위의 싱글톤 패턴은 여러 개의 탭 메뉴를 만들어서 사용할 수 없는 단점이 있습니다.

물론 소스상에서 each 와 같은 반복문을 사용하면 가능하지만 이 포스팅에서는 프로토타입을 사용하여 여러 개의 탭메뉴를 원 소스로 구현해 보도록 하겠습니다.

프로토타입 탭 메뉴 패턴

See the Pen 싱글톤 탭메뉴를 프로토타입으로 리팩토링하기 by jaeheekim (@jaehee) on CodePen.

Jaehee's e-room