2014-07-17 6 views
6

Ho visto alcuni tutorial o esempi di codice in cui lo sviluppatore utilizzava il metodo _.extend di Underscore o il metodo _.assign di Lodash quando sarebbe sufficiente aggiungere semplicemente la proprietà, mi ha sempre confuso, qual è il vantaggio dell'utilizzo di estendi/assegna di aggiungere semplicemente la proprietà? Ci sono molte volte in cui posso vedere i benefici dell'uso di questi metodi, quando aggiungo più proprietà da un altro oggetto, per esempio, ma molto spesso l'ho visto usato come nell'esempio qui sotto dove non vedo alcun vantaggio.Scopo di _.extend/_. Assegna?

Esiste un vantaggio di cui non sono a conoscenza per il seguente codice invece di assegnare la proprietà?

http://tech.pro/tutorial/1734/building-decoupled-javascript-applications-with-postaljs

var Weather = function() { 
    this.channel = postal.channel("weather"); 
    this.channel.subscribe("fetch", this.fetch).withContext(this); 
}; 

_.extend(Weather.prototype, { 
fetch: function(city) { 
    $.ajax({ 
     url: "http://openweathermap.org/data/2.1/find/name?q=" + city + "&units=imperial", 
     dataType: "jsonp", 
     success: _.bind(function(data) { 
      this.channel.publish("fetched", data.list[ 0 ]); 
     }, this) 
    }); 
    } 
}); 

Per esempio, non poteva il codice di cui sopra essere riscritta così:

Weather.prototype.fetch = function(...){...} 

o c'è un negativo a questo?

+11

Potrebbe essere solo un idioma, utilizzando lo stesso stile per aggiungere una proprietà come mu ltiple. – Barmar

+0

Questo ha senso ed è quello che pensavo, volevo confermare che non mi stavo perdendo alcune prestazioni o benefici relativi ai bug. –

+0

Seguirò l'idioma; '_.extend (Weather.prototype ...' si legge esattamente come si fa, _extending del prototipo dell'oggetto 'Weather'_. – Mathletics

risposta

1

Esiste per lo stesso motivo per cui jQuery ha $.extend (incluso uno npm port) e non ha nulla a che fare con le prestazioni: aggiungere le proprietà di un oggetto a un altro oggetto, estendendone quindi l'una con l'altra. Lodash' version consente un controllo più preciso sul processo di unione mediante una funzione customizer.

oggetti Estensione ha un paio di usi, di cui uno è indicato dagli sviluppatori jQuery su writing plugins:

Un miglioramento che possiamo, e dovrebbe, fare al codice di cui sopra è quello di esporre le impostazioni del plugin di default . Questo è importante perché rende molto semplice per gli utenti di plugin sovrascrivere/personalizzare il plug-in con codice minimo. Ed è qui che iniziamo a sfruttare l'oggetto funzione.

// Plugin definition. 
$.fn.hilight = function(options) { 

    // Extend our default options with those provided. 
    // Note that the first argument to extend is an empty 
    // object – this is to keep from overriding our "defaults" object. 
    var opts = $.extend({}, $.fn.hilight.defaults, options); 

    // Our plugin implementation code goes here. 

}; 

// Plugin defaults – added as a property on our plugin function. 
$.fn.hilight.defaults = { 
    foreground: "red", 
    background: "yellow" 
}; 

Nell'esempio precedente si può chiaramente vedere che con fare con un oggetto preset con proprietà, che deve essere esteso o anche sovrascritto da un oggetto ignoto con proprietà sconosciute, poiché l'oggetto è fuori il controllo del plug-sviluppatore


a volte noi semplicemente non sappiamo quali proprietà sono l'oggetto di estensione, a volte solo rende le cose più leggibile e, a volte si tratta solo di ingombrante per farlo manualmente, soprattutto se avete bisogno di un fusione profonda.

Un'altra applicazione è dove si vuole simulare una semplice gerarchia di ereditarietà:

// very trivial example: 
var Super = { superFoo: function() {} }; 
var Sub1 = { sub1Foo: function() {} }; 
var Sub2 = { sub2Foo: function() {} }; 

$.extend(Sub1, Super) // now Sub1 has Super powers 
$.extend(Sub2, Super) // now Sub2 has Super powers too 
0

In molti casi, utilizzando Object.assign() (o l'equivalente libreria in dotazione) permette di scrivere uno in uno stile più funzionale. Invece di usare più istruzioni solo per aggiungere una singola proprietà a un oggetto, puoi fare tutto in un'unica grande espressione.

procedurale:

function doThing(options) { 
    options.x = 5; 
    return _doThing(options); 
} 

funzionale:

function doThing(options) { 
    _doThing(Object.assign(options, {x: 5})); 
} 

Inoltre, se utilizzato con un oggetto vuoto si crea idiomaticamente una copia in modo da non disturbare un passato-in oggetto in modi che potrebbero confondere il chiamante:

function doThing(options) { 
    _doThing(Object.assign({}, options, {x: 5})); 
}