ES6を使用してシングルトンパターンを実装する方法

シングルケースはプログラミングにおける非常に基本的なもので、この記事では主に ES6 を使用してシングルトン パターンを実装する方法とそのアプリケーションについて詳しく紹介します。以下のエディターで学習してみましょう。

前書き

従来の開発エンジニアにとって、シングルトンとは、クラスにインスタンスが 1 つだけ存在することを保証するものであり、インスタンスが存在するかどうかを最初に判断するのが一般的です。存在しない場合は作成されます。これにより、クラスにはインスタンス オブジェクトが 1 つだけ存在します。 JavaScript では、シングルトンは名前空間プロバイダーとして機能し、グローバル名前空間からオブジェクトへの一意のアクセス ポイントを提供します。

シングルトン パターンの定義は、クラスにインスタンスが 1 つだけあることを保証し、それにアクセスするためのグローバル アクセス ポイントを提供することです。

シングルトンパターンは、適切なタイミングでオブジェクトを作成し、唯一のものを作成できます。

コードは現実に近く、非常に興味深いです。たとえば、Web サイトにログインする場合、「ログイン」をクリックした後にログインのポップアップ ボックスが表示されますが、再度クリックしても同じポップアップ ボックスは表示されません。または、音楽プレーヤー プログラムでは、ユーザーが音楽を開いて別の音楽を開こうとすると、前の再生インターフェイスが自動的に閉じて、現在の再生インターフェイスに切り替わります。これらはすべてシングルトン パターンのアプリケーション シナリオです。

シングルトン パターンを実装するには、クラスを作成する方法が一般的です。クラスには、そのクラスのインスタンス オブジェクトを作成できるメソッドと、インスタンス オブジェクトが作成されたかどうかを記録するマークがあります。オブジェクトがすでに存在する場合は、最初にインスタンス化されたオブジェクトへの参照が返されます。

シングルトンパターンの実装

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;
}

ユーザーはよく知られたインターフェースを通じてインスタンスにアクセスできます。

オブジェクトを 2 回インスタンス化して、2 つのインスタンス化の結果が同じオブジェクトを指しているかどうかを観察します。

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

戻り結果は次のとおりです: true。 a と b の間には参照関係があることを説明します。

ES6実装

Singletonクラスを作成します。 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;
 }
}

シングルトン パターンの適用例

シングルトン パターンの適用を説明するために、人生における一般的なシナリオを使用します。

どの Web サイトでもログイン ボタンをクリックすると、ログイン ボックスは 1 つだけ表示されます。後でログイン ボタンをクリックしても、それ以上のポップアップ ボックスは表示されません。これは、シングルトン パターンの典型的な適用例です。次にそれを実装していきます。シングルトン モードの表示に焦点を当てるために、ログイン ボックスを簡略化してみましょう。

以上がES6を使用してシングルトンパターンを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。