Che tipo di pattern di progettazione JavaScript è questo?

-1

Nel nostro luogo di lavoro utilizziamo una semplice libreria ajax per ottenere i dati della pagina e inviare modifiche al server. A volte è necessario modificare i valori dei campi del modulo. Sappiamo che i campi possono essere di qualsiasi tipo (menu a tendina, casella di testo, pulsanti radio, ecc.) E uno dei compiti più fastidiosi e noiosi è stato ricordare l'ID di ogni campo, in modo da poter effettuare la manipolazione. (L'attività può superare alcuni giorni, quindi ho dovuto conservare gli ID in un documento di testo). Così ho creato questo modello di progettazione per lavorare facilmente con i campi.

 function FormFieldsManager() {
            var FormMgr = {
                txtGradeName: function (txt) {
                    if (txt) {
                        $('#txtGradeName').val(txt);
                    }
                    else {
                        return $('#txtGradeName').val();
                    }
                },
                txtGradeDesc: function (txt) {
                    if (txt) {
                        $('#txtGradeDesc').text(txt);
                    }
                    else {
                        return $('#txtGradeDesc').text();
                    }
                },
                ddStatus: function (txt) {
                    if (txt) {
                        if (isNaN(txt)) {
                            $("#ddStatus").val(txt);
                        }
                        else {
                            $("#ddStatus")[0].selectedIndex = txt;
                        }
                    }
                    else {
                        return $('#ddStatus :selected').val();//selected value: A
                    }
                }
            };
        return FormMgr;
        };

Per utilizzare questa funzione, chiamo semplicemente il metodo e potrei navigare tra i campi del modulo e ottenere il pieno intellisense di JavaScript.

var form = FormFieldsManager();
form.txtGradeName('Software Developer');//to set the field value
form.txtGradeName();//to get the field value

Quindi le mie domande sono,

  1. Quale modello di design specifico è questo?
  2. Quali suggerimenti di miglioramento puoi fornire?

P.S.: Mi piace chiamarlo jsPageObject.

    
posta Owais Qureshi 24.03.2013 - 15:16
fonte

1 risposta

1

Questo è superfluo dal momento che avrai bisogno di una sola istanza di quell'oggetto sempre perché non ha stato. Puoi semplicemente fare

var FormFieldsManager = {
    txtGradeName: function (txt) {
        ...
    },
    txtGradeDesc: function (txt) {
        ...
    },
    ddStatus: function (txt) {
        ...
    }
};

Puoi semplicemente fare riferimento a questo, non è necessario crearlo. Questo è semplicemente il namespace delle funzioni statiche da qualche parte, non so se ha persino un nome.

Se si trattasse di un oggetto reale con stato, immagino che un miglioramento sarebbe utilizzare il prototipo, quindi non è così concreto come è ora. Anche tu non creerà gli oggetti funzione da zero ogni volta ma ciò conta solo quando crei 100+ istanze di qualcosa.

//This causes an error when you forgot to specify 'new' as in 'new FormFieldsManager()'
"use strict";

var method = FormFieldsManager.prototype;

function FormFieldsManager() {
    this.state = "something";
}

method.txtGradeName = function (txt) {
    ...
};

method.txtGradeDesc = function (txt) {
    ...
};

method.ddStatus = function (txt) {
    ...
};
    
risposta data 24.03.2013 - 15:24
fonte

Leggi altre domande sui tag