Stringhe letterali e proprietà dell'oggetto in JavaScript

1

Le librerie JavaScript nello stesso spazio (widget dell'interfaccia utente) utilizzano due approcci diversi per la creazione di istanze dei componenti:

  1. Stringhe letterali per specificare i tipi e inlining il più possibile, ad esempio:

    var oTable = webix.ui({
        view: "datatable",
        columns: [
            { id: "rank",   header: "", css:"rank", width: 50 },
            { id: "title",  header: "Film title", width: 200 },
            { id: "year",   header: "Released", width: 80 },
            { id: "votes",  header: "Votes", width: 100 }
        ],
        autoheight: true,
        autowidth: true,
        data: tableData
    });
    
  2. Una gerarchia di classi complessa e oggetti che passano invece di stringhe:

    var oTable = new sap.ui.table.Table({
        title: "Movies",
    });
    
    
    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Film title"}),
        template: new sap.ui.commons.TextField().bindProperty("value", "title"),
        sortProperty: "title",
        filterProperty: "title",
        width: "200px"
    }));
    
    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Released"}),
        template: new sap.ui.commons.TextField().bindProperty("value", "released"),
        sortProperty: "released",
        filterProperty: "released",
        width: "80px"
    }));
    
    oTable.addColumn(new sap.ui.table.Column({
        label: new sap.ui.commons.Label({text: "Votes"}),
        template: new sap.ui.commons.TextField().bindProperty("value", "votes"),
        sortProperty: "votes",
        filterProperty: "votes",
        width: "100px"
    }));
    
    // add the other columns...
    
    var oModel = new sap.ui.model.json.JSONModel();
    oModel.setData({modelData: tableData});
    oTable.setModel(oModel);
    oTable.bindRows("/modelData");
    

In entrambi i casi, tableData è un semplice array JSON, quindi nessuna differenza:

[
    { id: 1, title: "Shawshank Redemption", year: 1994, votes: 678790, rank: 1 },
    { id: 2, title: "The Godfather", year: 1972, votes: 511495, rank: 2 }
]

Quali sono i vantaggi e gli svantaggi di questi due approcci, in termini di curva di apprendimento, manutenibilità, prevenzione di antipattern, riusabilità e altre best practice di ingegneria del software?

    
posta Dan Dascalescu 01.02.2015 - 11:49
fonte

2 risposte

2

La dichiarazione in linea può essere più semplice da leggere e conservare in casi semplici, più semplice da comprendere e gestire per i non programmatori, ma è più difficile estendere o gestire i problemi dinamici. Ad esempio, nel tuo esempio, se vuoi che certe colonne vengano utilizzate solo in determinate circostanze, le cose iniziano a diventare brutte e la semplicità e la leggibilità vengono annullate in fretta.

Il secondo approccio ha una curva di apprendimento più alta, avrà meno senso per i non programmatori, ma rende le preoccupazioni dinamiche dirette, fornisce trasparenza su ciò che sta realmente accadendo e tende a rendere possibile un maggior grado di flessibilità ed estensibilità.

Una libreria UI ideale fornirebbe entrambi i tipi di opzioni.

    
risposta data 01.02.2015 - 16:02
fonte
2

Quest'ultimo è più facile da estendere e personalizzare, separando le preoccupazioni sia per l'utente della biblioteca che dell'autore. Ad esempio, se per qualche motivo avesse senso nella tua applicazione, potresti facilmente creare colonne diverse all'interno di diverse funzioni. Per un altro esempio, l'utente può creare i propri componenti% gen_de% e MyLabel senza che la libreria debba sapere nulla al riguardo.

Il primo è molto più semplice da leggere, scrivere e gestire, a spese di essere più difficile da personalizzare ed estendere. In altre parole, sei in gran parte bloccato con ciò che ti viene dato. Questa è un'ottima cosa se ciò che ti viene dato è sufficiente per le tue esigenze. Altrimenti è una cosa molto brutta.

Si riduce al principio YAGNI. Se sei abbastanza sicuro che avrai solo bisogno delle configurazioni standard e delle loro personalizzazioni fornite, la complessità del secondo approccio non ti sta comprando nulla.

    
risposta data 01.02.2015 - 15:51
fonte