Creazione dell'API JavaScript per la prima volta

Question

Sto creando per la prima volta un'API commerciale per le pagine Web reattive/applicazioni Web (dispositivi mobili).

Sono nuovo e, purtroppo, lavoro da solo e anche nuovo su Javascript (lunga storia complicata).

Mi stavo chiedendo se qualcuno l'industria potrebbe offrire il loro parere professionale sul seguente formato di un "get" chiamata: chiamata

var getSample = function(params) { 
    //Returns Object 
    return $.ajax({ 
     url: URL + 'downloadQuadrat.php', 
     type: 'GET', 
     data: { 'projectID': params.pid, 'quadratID': params.qid }, 
     dataType: dataType 
    }); 
} 

Funzione:

var printList = function(lid,options,get) { 
    var list = $("ul#"+lid); 
    var promise = get(options); 

    promise.promise().then(
     function(response) { 
      var items = response; 
      list.empty(); 

      $.each(items, function(item,details) { 
       var ul = $('<ul/>'); 
       ul.attr('id', lid+'_'+details.ID); 
       var li = $('<li/>') 
       .text(details.ID) 
       .appendTo(list); 
       ul.appendTo(list); 

       $.each(details,function(key,value) { 
        var li = $('<li/>') 
        .text(key+': '+value) 
        .appendTo(ul); 
       }); 
      }); 
     } 
    ); 
} 

Qualsiasi ingresso o di orientamento sarà molto apprezzato

Answer 1

Io non sono un professionista del settore, per sé, ma ci sono alcune cose che penso che potrebbe migliorare il tuo codice:

• formato secondo le convenzioni comuni. È difficile vedere cosa sta facendo il tuo codice senza un indentazione adeguata.
• Basta usare $("#"+lid) anziché $("ul#"+lid). Lo ul all'inizio non aggiunge alcuna disambiguazione perché gli attributi id devono essere univoci e richiede solo un tempo di analisi più lungo.
• Ditch localstorage in questo caso. Non è supportato su tutti i browser e, per quanto ne so, non ne hai bisogno qui. Utilizza direttamente i dati restituiti dalla risposta.

Ecco come vorrei cambiare il codice:

var printList = function(lid, options, get) { 
    var promise = get(options); 
    var list = $("#" + lid); 

    promise.success(function(response) { 
     var data = response; 
     list.empty(); 
     $.each(data, function(item, details) { 
      var ul = $('<ul/>').attr('id', lid + '_' + details.ID); 
      var li = $('<li/>').text(details.ID).appendTo(list); 
      ul.appendTo(list); 
      $.each(details, function(key, value) { 
       var li = $('<li/>').text(key + ': ' + value).appendTo(ul); 
      }); 
     }); 
    }); 
} 

EDIT: La versione modificata del codice guarda bene a me, tranne che per il minore ul# cosa.

Answer 2

Alcuni ulteriori suggerimenti per rendere il vostro API un po 'più professionale alla ricerca:

1 - namespacing

Utilizzare uno spazio dei nomi per mantenere il vostro codice confezionato ordinatamente in un suo spazio dove non sarà in conflitto con altre funzioni definizioni sulla pagina. Qualcosa di simile all'inizio:

window.MyNamespace = {}; 
MyNamespace.get = function(qid, pid) { 
    //things 
}; 
MyNamespace.anotherFunction = function() { 
    //other stuff 
} 

Se il codice inizia a ingrandirsi, è possibile avvolgere l'intero lotto in una chiusura. Inoltre è possibile definirlo tutto come classe e quindi istanziarlo una volta per rendere il codice più ordinato e consentire di memorizzare le variabili di istanza e chiamare this.anotherFunction(). Posso fornire anche esempi di quelli, se vuoi.

2 - metodo API firme

Un'altra cosa che preferisco vedere è argomenti espliciti alle funzioni, piuttosto che la funzione get (params) codice di stile. Rendere i parametri espliciti rende il tuo codice più facile da leggere e comprendere e scoraggia gli hack ad-hoc che è particolarmente importante quando si scrive un'API. È un caso solo perché puoi non significa che dovresti.

3 - Config

tenta di spostare le cose come gli ID e gli URL in variabili per cominciare a rendere il codice un po 'più facile da riutilizzare e lavorare.

In genere, gli sviluppatori di Javascript sono famosi per aver guardato il codice prima che guardino i documenti dell'API, quindi qualsiasi cosa tu possa fare per rendere i nomi delle funzioni API e dei nomi degli argomenti più espressivi e autodocumentanti li aiuterà.