FrontEngineer JungBam
싱글톤 패턴의 활용 본문
이번 실전프로젝트 초기버전에서는 webRTC를 이용한 그룹채팅을 채팅과 함께 구현하려고 했었다.
이때 고민했었던 것이 socket 인스턴스를 어디에서든 하나의 인스턴스로 만들어 주고 싶었고 이 때 찾은 방법이 싱글톤 방법이었다.
싱글톤 패턴의 가장 기본적인 방법은 네임스페이스 패턴을 객체로 만들어 사용하는 것이다.
이렇게 되었을 때에는 모든 변수들이 다 공개되는 그림이 그려진다. 예를 들어 아래와 같은 네임스페이스 패턴의 객체를 생성하면 eventName. 을 찍게 되면 안에 있는 모든 변수들이 공개되는 것을 말한다.
이러한 변수들을 숨기고자 한다면 숨길 수 있을 것이다. 하나의 방법은 즉시실행함수를 통해 반환값으로 변수들을 주는 것이다. 아래의 코드를 예시로 보면 이해하기 쉬울 것이다.
싱글톤 패턴을 활용하여 각기 다른 컴포넌트에서 불려지더라도 socket 서버에서 하나의 인스턴스로 이벤트를 처리할 수 있었다.(채팅과 그룹 화상채팅의 하나의 sids로 접속하는 것을 확인할 수 있었음.)
네임스페이스 패턴이란?
하나의 이름공간을 생성하여 다른 공간과 구분하는 패턴을 말한다.
주로 객체나 변수가 겹치지 않도록 분리하는데에 목적이 있다. 객체는 속성값을 갖고 그 속성값에는 또 다른 객체를 담을 수 있는데 이 개념을 통해서 하나의 객체에 구분이 필요한 변수, 메소드 등을 담는 방식이 바로 네임스페이스 패턴의 한 방법인 객체 리터럴 네임스페이싱 방식이다.
반응형
'리액트' 카테고리의 다른 글
제어 컴포넌트 vs 비제어 컴포넌트 (0) | 2023.02.22 |
---|---|
props와 state (0) | 2023.02.22 |
참조 동일성 (useRef / useState) (0) | 2023.02.13 |
react-beautiful-dnd(구현) (0) | 2023.02.11 |
리액트에서의 display : none 그리고 modal 컴포넌트 값 초기화 (1) | 2023.02.06 |
Comments