2016-11-15 2 views
3

Werfen Sie einen Blick auf die folgende Code-Struktur:Wie effektiv Debuggen von verketteten Funktionsargumenten?

myFunction(
    _(myArray) 
    .filter({ keep: true }) 
    .uniq('id') 
    .value() 
); 

myFunction() als Argument das Ergebnis einer Transformation Array lodash. Während ich den Stil des Codes mag, finde ich es schwierig zu debuggen und am Ende Refactoring es den lodash Code in einer anderen Funktion oder weisen Sie es zuerst einer Variablen, dann übergeben Sie die Variable auf myFunction().

Kennen Sie eine effektive Möglichkeit, den Funktionsargumentcode ohne Refactoring zu debuggen? Einige Gedanken:

  • Wie ist, kann man console.log 's nicht richtig einfügen.
  • In Chrome DevTools ist es nicht möglich, einen Haltepunkt z. zwischen .filter() und .uniq()
+5

Meine Gedanken: Wenn eine Aufgabe komplex genug ist, um das Debuggen zu erfordern, extrahieren Sie sie in eine separate Funktion, übergeben Sie sie in die Kette und setzen Sie dort einen Debug-Punkt. Sie können auch ".tap" verwenden, um einfach auszudrucken, was gerade drin ist. Allerdings sieht das hier vorgestellte Ding völlig in Ordnung aus - solange die Eingabedaten der Erwartung entsprechen, wird die Kette funktionieren, so dass es nicht nötig ist, _das_ zu debuggen, nur zu schauen, was reinkommt. – vlaz

+0

Verketteter Code wie dieser ist nicht einfach debuggen. Normalerweise halte ich jeden Schritt bis ich sie richtig verstanden habe. Dann, sobald ich die gewünschte Ausgabe habe, setze die Kette zusammen und falle sie idealerweise in einer Funktion aus. Wenn Sie den Code auch während des Debuggens nicht berühren können, ist das ein Pech ... –

+0

Ich wollte hinzufügen - was ich gesagt habe, ist wahr für lodash - wenn Sie Code haben, der fließende Schnittstelle unterstützt und Sie wollen diese Art von Kette debuggen. ..dann würde ich vorschlagen, keine fließende Schnittstelle zu verwenden. Es sei denn, Ihr Code ist im Konzept und im getesteten lodash so einfach. Wenn Sie relativ einfache Funktionen (z. B. Array -> Map -> Filter -> Map -> Reduzieren) mit trivialen Callbacks in jedem verketten, dann sollte das beim Debugging keinen großen Aufwand bedeuten. – vlaz

Antwort

1

können Sie als nächstes tun:

mixin Funktion

var debug = function (val) { 
    console.log(val); 
    return val; 
} 
_.mixin({'debug': debug}) 

erstellen und verwenden Sie es wie

_(myArray) 
    .debug() 
    .filter({ keep: true }) 
    .debug() 
    .uniq('id') 
    .debug() 
    .value() 

oder können Sie lodash Funktionen außer Kraft setzen, bevor sie wie verwenden

_.filter = _.wrap(_.filter, function(func, val) { 
    console.log(func(val)); 
    return func(val); 
}); 
Verwandte Themen