자바스크립트의 싱글톤 패턴

Java 또는 C++ 배경에서 왔다면 아마도 고전적인 OOP 모델에 익숙할 것이며 JavaScript에서 싱글톤을 구현하는 방법을 상상하기 어렵습니다. 이 질문에 대한 답은 클로저를 사용하는 것입니다!

모듈 패턴과 같은 아이디어이며 함수형 프로그래밍에서 비롯됩니다. 클로저의 본질은 외부 함수의 범위에서 내부 함수를 생성하는 것입니다. JS를 알고 있다면 내부 함수가 외부 함수의 범위에 있는 데이터 멤버에 액세스할 수 있다는 것을 알고 있습니다. 따라서 내부 함수에 대한 참조를 유지하는 한 외부 함수가 실행을 완료한 경우에도 외부 함수의 닫힌 멤버에 액세스할 수 있습니다. 이 정의를 이해하는 데 시간이 걸릴 수 있습니다!

어쨌든, 종종 자연어로 설명하는 것보다 코드로 무언가를 보여주는 것이 더 쉽습니다!

다음은 axios 라이브러리를 래핑하는 싱글톤 http 클라이언트의 예입니다.

let http = (function () {
  let axios = require('axios')

  return {
    get: function(url) {
      return axios.get(url)
    },
    post: function(url) {
      return axios.post(url)
    }
  }

}())


보시다시피 axios 클라이언트의 인스턴스를 해당 범위에 보유하는 IIFE 을 만듭니다. IIFE는 get 및 post 메소드를 포함하는 함수로 즉시 해석됩니다. 이런 식으로 우리는 http의 싱글톤 인스턴스를 생성할 뿐만 아니라 프로그램의 나머지 부분에서 캡슐화된 axios도 생성합니다.

그러나 여전히 클로저에서 반환된 get 및 post 함수를 사용하여 axios 인스턴스의 메서드에 액세스할 수 있습니다.

http
  .get('https://baconipsum.com/api/?type=all-meat&paras=1&start-with-lorem=1')
  .then((res) => console.log(res.data))


나는 그것이 텍스트의 몇 단락에 대한 많은 정보라는 것을 알고 있습니다. 클로저 또는 일반적으로 JS에 대해 더 자세히 알고 싶다면 FrontendMasters course by Douglas Crockford 을 시청하는 것이 좋습니다. GitHub Student Pack 이하의 모든 학생은 무료입니다!

좋은 웹페이지 즐겨찾기