7 Maneiras de Criar Singleton em Javascript

Jan 23 2023

Olá, meus amantes de bits favoritos. Hoje vamos falar sobre a coisa mais comum que você pode usar em seu projeto — Singleton Pattern.

Olá, meus amantes de bits favoritos . Hoje vamos falar sobre a coisa mais comum que você pode usar em seu projeto — Singleton Pattern .

Para um de vocês que já sabe o que é singleton, continue rolando, tenho certeza que este artigo irá surpreendê-lo.

Para os outros…

Padrão Singleton - é o mais comumente usado e uma das coisas que são perguntadas em quase todas as entrevistas. Pode ser descrito como um padrão que restringe o uso de uma classe a um único uso. Ou seja, na sua aplicação é permitido ter apenas uma instância da sua classe.

Uma vez que isso está resolvido, vamos aos exemplos.

Este artigo incluirá exemplos de Javascript e Typescript .

Solteiro Clássico

A maneira mais icônica e clássica de implementar um singleton. Exemplo disso você pode encontrar em todos os tutoriais e em todos os livros de programação.

Exemplo de Javascript :

Exemplo de texto datilografado :

E aqui está como usá-lo:

ClassicSingleton.instance.invoke();

Prós

Solução simples, direta e limpa
Abordagem mais comum

Inicializado na inicialização do aplicativo, o que pode levar à lentidão na inicialização do aplicativo
Não pode ser herdado corretamente, o que significa que você precisa duplicar esse código em todas as classes em que deseja usar o singleton

O Lazy Singleton é usado principalmente quando você não deseja inicializar seu singleton imediatamente e deseja usá-lo apenas quando necessário. Uma boa maneira de fazer micro-otimização para seu aplicativo. Em outros assuntos está perto de Classic Singleton .

Exemplo de Javascript :

Exemplo de texto datilografado :

E aqui está como usá-lo:

LazySingleton.instance().invoke();

Prós

Inicializado quando usado e não ocupa memória quando não foi chamado
Solução simples e limpa

Inicializado quando usado, o que pode levar a pequenos atrasos no primeiro uso
Não pode ser herdado, o que significa que você precisa duplicar esse código em todas as classes em que deseja usar o singleton

Quase a mesma coisa que Lazy Singleton , mas usamos um getter em vez de uma função simples, o que nos permite evitar o uso de colchetes desagradáveis ().

Exemplo de Javascript :

Exemplo de texto datilografado :

Como usá-lo:

LazyGetterSingleton.instance.invoke();

Tem os mesmos prós e contras do Lazy Singleton .

Importar Singleton

Não se pode dizer que essa abordagem seja comum, pois nem toda linguagem de programação segue o paradigma de exportar/importar declarações de arquivos.

Exemplo de Javascript ES6 (Babel):

Exemplo de Javascript (nó):

Exemplo de texto datilografado :

Como usar o Javascript ES6 (Babel) e a versão Typescript :

import { importSingletion } from "./ImportSingleton";

importSingleton.invoke();

const importSingleton = require("./ImportSingleton");

importSingleton.invoke()

Prós

Solução simples, direta e limpa

Inicializado na inicialização do aplicativo, o que pode levar à lentidão na inicialização do aplicativo
Não pode ser automatizado, o que leva à duplicação da base de código

Decorador Singleton

Abordagem interessante quando você usa dois padrões juntos: Singleton e Decorator .

A ideia principal é minimizar a duplicação de código.

Exemplo de Javascript :

Você pode usá-lo com Typescript , mas infelizmente, por padrão, o Typescript não percebe a propriedade dinâmica e você precisa escrever um código adicional e bastante sujo para Typescript para suportá-lo. É por isso que é preferível não usar essa abordagem com Typescript .

Como usá-lo:

DecoratorSingleton.instance.invoke();

Solução simples, direta e limpa
Você pode manter uma base de código razoavelmente limpa e evitar duplicações de código

Inicializado na inicialização do aplicativo, o que pode levar à lentidão na inicialização do aplicativo

Abordagem legal, que novamente une dois padrões, Singleton e Decorator , mas também permite que você visualize seus singletons de um ângulo diferente. E como bônus, abre as portas para um conhecimento profundo de Javascript .

Exemplo de Javascript :

Exemplo de texto datilografado :

E aqui está como usar as versões Javascript e Typescript :

new BindSingleton().invoke()

BindSingleton().invoke()

Você pode verificar a exatidão com:

new ConstructorSingleton() === new ConstructorSingleton() // => true

ConstructorSingleton() === ConstructorSingleton() // => true

Bem, simples. Em primeiro lugar, nossa BindSingletonnunca foi uma classe, é uma função. É por isso que podemos usar BindSingleton()nele. Legal certo?

Agora, e new BindSingleton(), por que continua retornando a mesma instância? Muito óbvio novamente, nossas verificações lógicas na instanceverificação de função para propriedades estáticas na classe, se a propriedade não existir, criamos uma instância de nossa classe e, se a propriedade existir — nós a usamos em vez de inicializar uma nova instância.

Prós

Oferece várias maneiras de acessar seu singleton
Considerado solteiro preguiçoso
Você pode manter sua base de código razoavelmente limpa

Requer conhecimento profundo de Javascript e pode confundir desenvolvedores inexperientes
Em comparação com outros métodos — muito código.

Construtor Singleton

Este requer uma compreensão muito profunda de como o Javascript funciona, mas é realmente uma solução elegante.

Exemplo de Javascript :

Exemplo de texto datilografado:

E aqui está como usá-lo:

new ConstructorSingleton().invoke()

new ConstructorSingleton() === new ConstructorSingleton() // => true

Quando executamos nosso código pela primeira vez - ele inicializa cachee nossa criação da instância quando chega a constructor, verifica o valor de retorno e, no construtor de primeira execução, retorna undefinedo que força o Javascript a criar uma nova instância da classe. Mas todas as execuções a seguir obterão nossa instância cachee constructorretornarão nossa instância, em vez de undefinedindicar ao Javascript que deve retornar nossa instância existente.

7 Maneiras de Criar Singleton em Javascript

Solteiro Clássico

Importar Singleton

Decorador Singleton

Construtor Singleton

Recursos