ES6을 사용하여 싱글톤 패턴을 구현하는 방법

싱글 케이스는 프로그래밍에 있어 매우 기본적인 것입니다. 이 글에서는 ES6을 사용하여 싱글턴 패턴을 구현하는 방법과 그 적용에 대한 정보를 주로 소개합니다. 필요한 친구들이 참고할 수 있도록 도와드리겠습니다. 아래 에디터와 함께 배워보겠습니다.

머리말

전통적인 개발 엔지니어의 관점에서 싱글톤은 클래스에 인스턴스가 하나만 있는지 확인하는 것입니다. 구현 방법은 일반적으로 인스턴스가 존재하는지 여부를 먼저 확인하는 것입니다. 직접 반환됩니다. 존재하지 않으면 생성됩니다. 반환하면 클래스에 인스턴스 개체가 하나만 있습니다. JavaScript에서 싱글톤은 네임스페이스 공급자 역할을 하며 전역 네임스페이스에서 개체에 대한 고유한 액세스 지점을 제공합니다.

싱글턴 패턴의 정의는 클래스에 인스턴스가 하나만 있는지 확인하고 이에 액세스할 수 있는 전역 액세스 지점을 제공하는 것입니다.

싱글턴 패턴은 적시에 객체를 생성하고 유일한 객체를 생성할 수 있습니다.

코드가 생활에 가깝고 매우 흥미롭습니다. 예를 들어, 웹 사이트에 로그인할 때 로그인을 클릭하면 로그인 팝업 상자가 팝업됩니다. 다시 클릭해도 동일한 팝업 상자가 다시 나타나지 않습니다. 또는 음악 플레이어 프로그램에서 사용자가 음악을 열고 다른 음악을 열려고 하면 이전 재생 인터페이스가 자동으로 닫히고 현재 재생 인터페이스로 전환됩니다. 이는 모두 싱글톤 패턴의 애플리케이션 시나리오입니다.

싱글턴 패턴을 구현하기 위한 고전적인 방법은 클래스를 생성하는 것입니다. 클래스에 해당 클래스의 인스턴스 객체를 생성할 수 있는 메소드가 있고, 인스턴스 객체 생성 여부를 기록하는 표시가 있습니다. 개체가 이미 존재하는 경우 첫 번째 인스턴스화된 개체에 대한 참조가 반환됩니다.

싱글턴 패턴 구현

es5 구현

var Singleton = function(name) {
 this.name = name;
 //一个标记，用来判断是否已将创建了该类的实例
 this.instance = null;
}
// 提供了一个静态方法，用户可以直接在类上调用
Singleton.getInstance = function(name) {
 // 没有实例化的时候创建一个该类的实例
 if(!this.instance) {
  this.instance = new Singleton(name);
 }
 // 已经实例化了，返回第一次实例化对象的引用
 return this.instance;
}

사용자는 잘 알려진 인터페이스를 통해 인스턴스에 액세스할 수 있습니다.

객체를 두 번 인스턴스화하려고 시도하고 두 인스턴스화 결과가 동일한 객체를 가리키는지 관찰합니다.

var a = Singleton.getInstance('sven1');
var b = Singleton.getInstance('sven2');
// 指向的是唯一实例化的对象
console.log(a === b);

반환 결과는 true입니다. a와 b 사이에는 참조 관계가 있음을 설명합니다.

es6 구현

싱글톤 클래스를 만듭니다. class 키워드와 정적 함수는 모두 es6의 새로운 기능입니다.

class Singleton {
 constructor(name) {
  this.name = name;
  this.instance = null;
 }
 // 构造一个广为人知的接口，供用户对该类进行实例化
 static getInstance(name) {
  if(!this.instance) {
   this.instance = new Singleton(name);
  }
  return this.instance;
 }
}

싱글턴 패턴 적용 예

실생활에서 흔히 사용하는 시나리오를 사용하여 싱글톤 패턴 적용을 보여줍니다.

어느 웹사이트에서든 로그인 버튼을 누르면 로그인창이 하나만 뜨는데, 나중에 로그인 버튼을 눌러도 더 이상 팝업창이 뜨지 않습니다. 이는 싱글톤 패턴의 일반적인 적용입니다. 다음으로 이를 구현합니다. 싱글톤 모드 표시에 집중하기 위해 로그인 상자를 단순화해 보겠습니다.

위 내용은 ES6을 사용하여 싱글톤 패턴을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!