js design pattern - utilisation du modèle singleton

Cette fois, je vais vous présenter l'utilisation de jsmodèle de conception-mode cas unique Quelles sont les précautions pour l'utilisation du mode js singleton ? est un cas pratique, jetons-y un coup d'œil.

1. Concept :
Aux yeux des ingénieurs de développement traditionnels, le modèle à intérêt unique garantit que chaque classe n'a qu'une seule instance. Lorsque nous l'implémentons, nous déterminons d'abord si l'instance existe. existe, renvoyez-le directement. S'il n'existe pas, créez-le et renvoyez-le. Cela garantit qu'il n'y a qu'un seul objet instance pour chaque classe. En JavaScript, un singleton agit en tant que fournisseur d'un espace de noms , fournissant un point d'accès unique pour accéder aux objets à l'échelle mondiale. 123
2. Fonctions et précautions :
Fonctions : 1. Communication inter-modules
2. Un seul objet d'une certaine classe dans le système peut exister
3. Protégez vos propres attributs et méthode
Notes : 1. Faites attention à l'utilisation de this
2. Les fermetures peuvent facilement provoquer des fuites de mémoire
3. Faites attention à l'utilisation de new lors de l'utilisation de l'héritage.

3. Le moyen le plus simple d'implémenter
est d'utiliser des littéraux d'objet, qui peuvent contenir un grand nombre d'attributs et de méthodes.

var firstObject = {
    property1: "something",
    property2: "something else",
    method1: function () {
        console.log('hello web！');
    }
};

Si vous souhaitez étendre cet objet, nous pouvons fournir nos propres membres privés, puis nous encapsulons ces déclarations de variables et de fonctions à l'intérieur via des fermetures. Nous pouvons mettre en œuvre des méthodes privées ou publiques. Regardons à nouveau le code suivant :

var firstObject= function () {
    /* 这里声明私有变量和方法 */
    var privateVariable = 'something private';    function showPrivate() {
        console.log(privateVariable);
    }    /* 公有变量和方法（可以访问私有变量和方法） */
    return {
        publicMethod: function () {
            showPrivate();
        },
        publicVar: 'the public can see this!'
    };
};var single = firstObject();
single.publicMethod();  // 输出 'something private'console.log(single.publicVar); // 输出 'the public can see this!'

Si nous voulons l'initialiser uniquement lorsqu'il est utilisé, comment devons-nous procéder ? Afin d'économiser des ressources, nous pouvons initialiser ces codes dans un autre constructeur , comme suit :

var firstjObiect= (function () {
    var instantiated;    function init() {
        /*这里定义单例代码*/
        return {
            publicMethod: function () {
                console.log('hello world');
            },
            publicProperty: 'test'
        };
    }    return {
        getInstance: function () {
            if (!instantiated) {
                instantiated = init();
            }            return instantiated;
        }
    };
})();/*调用公有的方法来获取实例:*/firstjObiect.getInstance().publicMethod();

Jetons un coup d'œil à ses scénarios d'utilisation qui sont généralement utilisés dans Concernant la communication. coordination des différents modes entre les systèmes

var firstObjectTester = (function () {
    //参数：传递给单例的一个参数集合
    function Singleton(args) {
        //设置args变量为接收的参数或者为空（如果没有提供的话）
        var args = args || {};        //设置name参数
        this.name = 'SingletonTester';        //设置pointX的值
        this.pointX = args.pointX || 6; //从接收的参数里获取，或者设置为默认值
        //设置pointY的值
        this.pointY = args.pointY || 10;
    }    //实例容器
    var instance;    var _static = {
        name: 'SingletonTester',        //获取实例的方法
        //返回Singleton的实例
        getInstance: function (args) {
            if (instance === undefined) {
                instance = new Singleton(args);
            }            return instance;
        }
    };    return _static;
})();var singletonTest = firstObjectTester .getInstance({ pointX: 5 });
console.log(singletonTest.pointX); // 输出 5

Ce qui suit est un lien vers un exemple d'implémentation du mode singleton Voici le lien :
Solution vers la conversion Html lors du stockage des données Textarea Txt et affichage. Envoyer des SMS en HTML

La méthode ci-dessus est principalement implémentée, et il existe d'autres méthodes d'implémentation (du blog de l'oncle Tom)
Méthode 1,

function Universe() {
    // 判断是否存在实例
    if (typeof Universe.instance === 'object') {        return Universe.instance;
    }    // 其它内容
    this.start_time = 0;    this.bang = "Big";    // 缓存
    Universe.instance = this;    // 隐式返回this}// 测试var uni = new Universe();var uni2 = new Universe();
console.log(uni === uni2); // true

Méthode 2,

function Universe() {
    // 缓存的实例
    var instance = this;    // 其它内容
    this.start_time = 0;    this.bang = "Big";    // 重写构造函数
    Universe = function () {
        return instance;
    };
}// 测试var uni = new Universe();var uni2 = new Universe();
uni.bang = "123";
console.log(uni === uni2); // trueconsole.log(uni2.bang); // 123

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Application DOM JavaScript approfondie

Minuterie JavaScript approfondie

Profondément dans l'application de base de JavaScript

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!