Uma análise abrangente do padrão de corpo único no padrão de design de JavaScript

Um monólito é um objeto usado para dividir um espaço para nome e organizar alguns atributos e métodos relacionados. Se ela puder ser instanciada, só poderá ser instanciada uma vez (ela só pode se casar uma vez, não o segundo casamento).

O padrão monolítico é um dos padrões mais básicos, mas úteis no JavaScript.

Características:

1. Pode ser usado para dividir os namespaces para limpar os perigos ou efeitos das variáveis globais.

2. Use a tecnologia de ramificação para encapsular as diferenças entre os navegadores.

3. O código pode ser organizado mais de uma maneira, facilitando a leitura e a manutenção.

Escrita básica do modo de corpo único:

 /* O padrão de monômero mais básico*/ var her = {nome: 'Anna', sexo: 'mulheres', digamos: function () {// Alguma lógica de processamento ...}, fazendo: function () {// Outras funções de processamento ...}}

1. Divida namespace:

 var box = {largura: 0, altura: 0, getarea: function () {return this.width * this.width; // O acesso a objetos em JS deve ser exibido, ou seja, isso não pode ser omitido}, init: function (w, h) {// width = w; // altura = h; Este método é equivalente à definição de duas variáveis globais (variáveis não declaradas com VAR são variáveis globais) // Não é uma atribuição à largura e altura do objeto // a seguir é a seguinte. this.Height = h;}} // Caixa divide um espaço para nome, e as variáveis no espaço de nome são válidas apenas no espaço

Todos os membros e métodos do monômero acima são públicos, ou seja, eles podem ser alterados arbitrariamente fora do monômero (mas não podem acessar variáveis locais). Então, por que o monômero fornece um espaço para nome?

Não se preocupe, vamos continuar olhando:

 var box = {width: 0, altura: 0, // a variável de monômero getarea: function () {return width * altura; // largura, a altura não é uma variável de monômero, mas uma variável global definida em init} init: function (w, h) {width = W; Box.GeGeAea (); Alert (init);}

Como a largura e a altura no init não são inicializadas, um erro será relatado, então mude assim:

 var box = {width: 0, altura: 0, getarea: function () {return width * altura;}, init: function (w, h) {width = w; altura = h;}} window.onload = function () {width = 0; altura = 0; // box.init (0,0); var init =t.earea (altura;

Verifica -se que está tudo bem. Como a largura e a altura usadas por init e getarea não são variáveis de propriedade do monólito, mas são uma variável global, podemos fazer chamadas aleatórias fora do monólito sem ser afetados.

 var box = {width: 0, altura: 0, getarea: function () {return width * altura; // o acesso do objeto em js deve ser exibido, isto é, isso não pode ser omitido}, init: function (w, h) {width = w; altura = h;}} // a largura aqui, altura não é realmente um único objeto. Box.GeGeAea (); Alert (Width);}

Dessa forma, será relatado que um erro será relatado. Pode -se observar que nosso método acima não cria um espaço de nome para variáveis globais, e as variáveis globais nos trazem perigo. Portanto, a palavra superior está correta, vamos verificar:

 var box = {largura: 2, altura: 2, getarea: function () {return this.width * this.Height; / / js o acesso deve ser exibido, ou seja, isso não pode ser omitido}, init: function (w, h) {this.width = w; this.height = h;}} janela.onload = function = {): // Não afetará as variáveis locais no monólito, ou seja, a altura do espaço para nome = 0; // Não afetará as variáveis locais no monólito, ou seja, o espaço de nome var width = box.getarea (); alerta (largura);}

Pode -se observar que a largura e a altura na janela.

2. Propriedades dos membros:

Embora não exista tão rigoroso orientado a objetos (OOP) em JavaScript, podemos usar o fechamento para imitá-lo. Afinal, não é bom definir algumas variáveis para o público.

 var her = (function () {var name = 'anna'; var sex = 'women'; retorna {getarea: function () {nome do retorno + 'é um' + sexo;}, init: function (b) {name = b;}}}}) (); janela.onload = function () {her.name = 'jock'; // não pode acessar o alerta (ger.getarea ()); her.init ('Lous'); alert (her.getarea ());}

Variáveis e métodos privados são somente leitura, enquanto as variáveis e métodos públicos são lidos por leitura.

acesso:

Para membros particulares, você pode acessá -los diretamente sem modificações diante deles.

Para acesso público, "isto". deve ser adicionado diante do escopo do monômero e "ela". (Nome da monobody.)

3. Use a tecnologia de ramificação para encapsular as diferenças entre os navegadores

Notas:

um. Certifique -se de usar o fechamento para obter uma ligação instantânea

b. Separe cada ramo com um semicolon

c. A última coisa que retorna é o nome do ramo

d. Use o nome único + nome do método do ramo ao chamar;

 // Use os objetos de ramificação monômero para definir objetos XHR (xmlHtttPrequest) e você deve usar um fechamento para implementar var xhr = (function () {// os três filmes Standard = {cxhr: functive () {return xmlHttprequest ();}}; var ativamente; ActivexObject ('msxml2.xmlHttp');}}; var ActiveXold = {cxhr: function () {return new ActiveXObject ('microsoft.xmlHttp');}}; // para atribuir (atribuir), tentar cada método; retorno; Se nenhum erro foi lançado} catch (e) {try {testObject = ActiveXNew.cxhr (); return ActiveXNew;} catch (e) {try {testObject = ActiveXold.cxhr (); return ActiveXNew;} catch (e) {Try {TestObject = Activexold.cxhr () (} catch (Tryx {TestObject = ActiveXold.cxhr (); XmlHttPrequestObject falhou! ');

O acima exposto é uma análise abrangente do modelo de corpo único do padrão de design JavaScript introduzido pelo editor. Espero que seja útil para todos. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a todos a tempo. Muito obrigado pelo seu apoio ao site wulin.com!