> 웹 프론트엔드 > JS 튜토리얼 > JavaScript ES6+에서 싱글톤 패턴 구현: 단계별 가이드

JavaScript ES6+에서 싱글톤 패턴 구현: 단계별 가이드

王林
풀어 주다: 2023-08-30 18:33:02
원래의
1319명이 탐색했습니다.

在 JavaScript ES6+ 中实现单例模式:分步指南

이 기사에서는 JavaScript로 싱글턴 패턴을 구현하는 방법을 보여 드리겠습니다.

풀 스택 JavaScript 개발자라면 JavaScript가 놀라운 웹 사이트를 구축하는 데 사용할 수 있는 강력한 언어라는 것을 알고 계실 것입니다. 반면에 프런트 엔드 양식 유효성 검사와 AJAX 호출에만 JavaScript를 사용하는 경우에는 JavaScript가 수행할 수 있는 작업의 표면만 긁은 것일 뿐이며 그 이상입니다. 기능이 풍부한 언어이기 때문에 그 위에 구축된 프레임워크가 많이 있습니다.

이 기사에서는 객체 지향 JavaScript의 유용한 프로그래밍 패턴인 싱글톤 패턴에 대해 설명합니다. 싱글톤 개체는 응용 프로그램이 실행되는 동안 전역 범위에서 한 번만 생성됩니다. 리소스를 공유하거나 애플리케이션의 여러 부분을 조정하는 데 사용됩니다.

싱글턴 패턴이란 무엇인가요?

싱글턴 패턴의 정의를 살펴보겠습니다.

소프트웨어 엔지니어링에서 싱글톤 패턴은 클래스의 인스턴스화를 "단일" 인스턴스로 제한하는 소프트웨어 디자인 패턴입니다. 이는 전체 시스템의 작동을 조정하는 데 하나의 개체만 필요할 때 유용합니다.

애플리케이션을 개발할 때 애플리케이션 전체에 전역 개체를 생성해야 하는 경우가 있습니다. 특히 전체 요청 수명 동안 한 번만 인스턴스화되는 개체를 원합니다. 예를 들어, 각 요청에 대해 여러 데이터베이스 개체를 만들 필요가 없으므로 요청 전반에 걸쳐 전역적으로 유지하려는 데이터베이스 연결 개체일 수 있습니다. 이 경우 싱글톤 패턴은 개체의 단일 복사본만 인스턴스화되도록 보장하므로 매우 유용합니다.

빠른 살펴보기: 이전 버전의 JavaScript의 싱글톤 패턴

이 섹션에서는 이전 버전의 JavaScript에서 싱글톤 패턴을 구현하는 방법을 간략하게 살펴보겠습니다.

아래 예시를 살펴보겠습니다.

위의 예에서는 Singleton 对象实现为闭包,因此它将立即被调用。它实现了 getInstance 方法,我们可以调用该方法来实例化一个对象。在 getInstance 方法中,我们检查 instance 属性是否已经拥有我们正在查找的对象,如果存在,我们不会创建另一个对象。如果它不包含任何对象,我们将调用 createInstance 메서드를 사용하여 새 개체를 인스턴스화한 다음 반환했습니다. 이렇게 하면 새 개체를 인스턴스화하려고 할 때마다 개체의 단일 복사본만 생성됩니다.

이를 시연하기 위해 Singleton.getInstance() 메서드를 두 번 호출하여 실제로 두 개의 서로 다른 객체를 생성하는지 확인합니다. 콘솔에서 두 개체가 모두 동일하고 둘 다 동일한 날짜와 시간을 인쇄하는 것을 볼 수 있습니다.

이것은 이전 버전의 JavaScript에서 싱글톤 패턴을 구현하는 방법입니다. 다음 섹션에서는 JavaScript ES6+ 버전에서 이를 구현하는 방법을 살펴보겠습니다.

ES6+의 싱글턴 패턴

이 섹션에서는 JavaScript ES6+ 버전에서 싱글턴 패턴을 구현하는 방법을 알아봅니다. ES6 방식의 경우 싱글톤 패턴을 구현할 수 있는 몇 가지 방법이 있습니다.

ES6 모듈

ES6 모듈을 사용해 봤지만 아직 몰랐다면 ES6 모듈은 기본적으로 싱글톤입니다. 특히, 모듈과 const 키워드를 결합하면 쉽게 싱글톤을 작성할 수 있습니다.

아래 ES6 모듈 코드를 살펴보겠습니다.

으아아아

이제 위 ES6 모듈을 가져올 때마다 해당 모듈로 범위가 지정된 currentDateAndTime 对象。由于 currentDateAndTime 객체의 동일한 버전을 얻을 수 있으므로 위 ES6 모듈을 다른 파일에 포함할 때마다 동일한 버전을 얻을 수 있습니다. 물체.

ES6 수업

이 섹션에서는 ES6 클래스를 사용하여 싱글턴 패턴을 구현하는 방법을 알아봅니다.

아래 예시를 살펴보겠습니다.

보시다시피, 우리는 애플리케이션 전체에서 데이터베이스 연결 개체를 인스턴스화하는 데 사용할 수 있는 DBConnection 클래스를 구현했습니다.

이를 테스트하기 위해 DBConnection 类的 getInstance 方法实例化了两个对象。然后,我们比较两个对象,看看它们是否相同。由于我们使用的是单例模式,因此它们应该是相同的,并且 console.log 语句将打印 true 클래스의 getInstance 메서드를 호출하여 두 개체를 인스턴스화합니다. 그런 다음 두 개체를 비교하여 동일한지 확인합니다. 우리는 싱글톤 패턴을 사용하고 있으므로 동일해야 하며 console.log 문은 확인을 위해 true를 인쇄합니다. 객체는 초기 로드 중에는 생성되지 않고 필요할 때만 생성되므로 이를 게으른 싱글톤 객체라고 부를 수 있습니다.

싱글턴 패턴을 구현하는 클래스를 정의하는 방법입니다.

带有模块的 ES6 类

在本节中,我们将了解如何使用 ES6 类和模块来实现单例模式。

让我们看一下下面的例子。

  constructor(conString) {}

  static getInstance(conString) {
    if (!this.instance) {
      this.instance = new DBConnection(conString);
    }

    return this.instance;
  }
}

const dbConObj = DBConnection.getInstance('mysqldb1');

export default dbConObj;
로그인 후 복사

创建作用域为模块的类的实例是实现单例模式的最佳方法。因此,如果您正在使用 ES6 模块,这是使用 ES6 类实现单例模式的推荐方法。

这就是如何使用 ES6 类和模块实现单例模式。

结论

今天,我们讨论了 JavaScript 中的单例模式。除了基础知识之外,我们还通过几个示例来了解它如何与不同版本的 JavaScript 配合使用。

위 내용은 JavaScript ES6+에서 싱글톤 패턴 구현: 단계별 가이드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿