Lavorare con le classi Javascript nel modo giusto

0

Domande sicuramente comparabili sono state fatte prima, ma mi piacerebbe sentire alcune parole sul mio modo specifico di implementare le classi Javascript.

Consentitemi di iniziare con un esempio di Javascript tratto da un'applicazione reale a cui ho lavorato di recente.

Esempio

PageControl= new function() {
  var self= this;

  // example additional control bound to page control
  var grid= new GridControl();

  self.initialise= function() {
    // initialise form fields, controls etc.
  };

  // example function
  self.load= function(id) {
    // reloads form with new data
  };

  $(document).ready(function() {
    self.initialise();
  });
};

Ogni pagina ha la propria istanza di PageControl con attività specifiche solo pertinenti per la pagina specificata.

Domanda:

Non sto cercando modi alternativi per implementarlo, vorrei solo sapere se l'esempio sopra riportato è un codice errato o sbagliato. La struttura di cui sopra ha funzionato fino ad ora, anche se lavoro con controlli secondari come PageControl.grid.reload(); ma non voglio attenermi al codice soggetto a errori.

    
posta SaschaM78 28.06.2014 - 13:01
fonte

2 risposte

2

Non sono sicuro che sia sbagliato o sbagliato, ma è confuso.

Il tuo PageControl non è una classe, è un'istanza di una classe anonima. In javascript una classe è un oggetto funzione che deve essere utilizzato con la nuova parola chiave per creare istanze di tale classe.

Il tuo codice utilizza la nuova parola chiave su una funzione anonima.

Quello che stai cercando di realizzare, penso, viene solitamente fatto usando la IIFE (Immediatamente invocata espressione della funzione).

PageControl= (function() {
  // you can create private variables and functions for use between your
  // functions, or add them to the self object to make them available.

  // example additional control bound to page control
  var grid= new GridControl();

  // Create your singleton w/ its member functions and possibly other properties
  // these functions can use 'this' to reference other members of the self object.
  // do it here so it can be referenced in the function closure used by
  // $(document).ready
  var self = {
    initialise: function() {
      // initialise form fields, controls etc.
    },

    load: function(id) {
      // reloads form with new data
    },

    // example additional control bound to page control
    grid: grid
  };

  $(document).ready(function() {
    self.initialise();
  });

  return self;      
})();

// your page can call those methods on the PageControl
PageControl.load("myId");
PageControl.grid.reload();

La chiave del pattern IIFE è la definizione di un'espressione di funzione che restituisce un oggetto e quindi chiama immediatamente (esegui) quella funzione (function() {})(); .

    
risposta data 28.06.2014 - 21:21
fonte
0

Non esiste un "modo giusto" per scrivere oggetti in javascript. Ci sono più tecniche diverse ognuna con pro e contro o solo sapori diversi.

Personalmente mi piace lo stile che hai dichiarato funzioni "pubbliche" nel tuo esempio perché, con la mia esperienza, aiuta a ridurre la curva di apprendimento per le persone con background OOP.

Ma penalizza perché stai ricreando ogni funzione su ogni istanza e questo come costo. Rende inoltre i tuoi oggetti non cancellabili attraverso strumenti come Sinon.js, perché non c'è un prototipo con cui fare confusione.

    
risposta data 28.06.2014 - 13:05
fonte

Leggi altre domande sui tag