Facilmente dominar o modo JavaScript Singleton

Definição: verifique se um objeto (classe) possui apenas uma instância e fornece um ponto de acesso global para acessá -lo;

Princípio da implementação: use o fechamento para manter uma referência a uma variável local que mantém a única instância criada pela primeira vez;

Usado principalmente para: cache global, janela flutuante de login, etc., quando apenas uma instância exclusiva for necessária;

1. Métodos para implementar o padrão de singleton para um objeto de padrão que não seja de singleton (como demonstração):

Adicione um método estático à demonstração para implementar um Singleton:

 Demo.getSingle = (function () {var demo = null; retorna função (nome) {if (! Demo) {Demo = new Demo (nome);} retornar Demo;}}) ();

uso:

Modo não-Singleton: var a = nova demonstração ('Peter');

Modo Singleton:

 var b1 = Demo.getSingle ('Peter'); var B2 = Demo.getSingle ('sufei'); b1 === b2; // true, toda a nova demonstração ('Peter')

Implementar singletons por meio de aulas de proxy:

 var proxyDemo = (function () {var demo = null; retorna função (nome) {if (! Demo) {Demo = new Demo (nome);} retorna demonstração;}}) ();

uso:

Modo não-Singleton: var a = nova demonstração ('Peter');

Modo Singleton: var B = novo proxyDemo ('Peter');

2. Padrão preguiçoso de singleton: crie o singleton apenas quando necessário;

Aqui está como criar um singleton preguiçoso em geral:

 var getSingle = function (foo) {var single = null; Return function () {return single || (single = foo.apply (this, argumentos)); }};

uso:

 var createLoginlayer = function () {var fragment = document.createLedocumentFragment (); var div = document.createElement ('div'); div.style.display = 'nenhum'; // a seguir adiciona outros elementos de login ao div ... retornar div;} var createSingleLoginlayer = getsingle (createLoginlayer); // Quando o usuário clica no botão pela primeira vez (id = quando 'lgbtn'), crie e exiba a janela de login. Após o clique repetido do botão, não será criado repetidamente; document.getElementById ('LGBTN'). OnClick = function () {var Lg = CreateSingleLoginLayer (); lg.style.display = 'Block';}

Anexo: o resultado do cálculo da função de cache, como calcular uma sequência de números

A seguir, é apresentada uma maneira de escrever sem cache, o que é muito lento!

 function foo (n) {resulta = n <2? n: foo (n - 1) + foo (n - 2); Resultados de retorno;} console.log (foo (40)); // deve ser calculado por vários segundos

A seguir, é apresentado o método de escrita de cache e os resultados são basicamente produzidos instantaneamente!

 var cache = {}; função foo (n) {if (! cache [n]) {cache [n] = n <2? n: foo (n - 1) + foo (n - 2); } retornar cache [n];} console.log (foo (100));

Melhor escrita:

 var foo = (function () {var cache = {}; retorna função (n) {if (! cache [n]) {cache [n] = n <2? n: foo (n - 1) + foo (n - 2);} retornar cache [n];}}) ();

Referências:

"Modo JavaScript"

"Javascript Design Patterns and Development Practice"

O exposto acima é todo o conteúdo deste artigo. Espero que seja útil para o aprendizado de todos e espero que todos apoiem mais o wulin.com.