UML per javascript?

Question

Sto cercando un modo di rappresentare graficamente oggetti JavaScript ...

So che c'è UML, ma per esempio, come rappresentare i catena tra 2 oggetti, come ad esempio:

var a, b; 

a = {}; 
b = Object.create(a); 

Intuitivamente, mi piacerebbe disegnare qualcosa di simile:

+-----+ 
|b | 
|-----| 
|  | 
+--+--+ 
    |  +-----+ 
    +---->|a | 
     |-----| 
     |  | 
     +-----+ 

ma c'è una rappresentazione decente in UML?

E che dire di mixins?

c = $.extend({}, a, b) 

+-----+   +-----+ 
|a |   |b | 
|-----|   |-----| 
|  |<----------|  | 
+-----+   +-----+ 
    +  +-----+ 
    |  |c | 
    |  |-----| 
    +---->|  | 
     +-----+ 

Answer 1

Sembra che si stia tentando di mostrare la relazione tra istanze di oggetto in un diagramma di classi. Questo non funzionerà davvero; probabilmente vorrai provare a utilizzare un diagramma di istanza UML (potrebbe anche essere chiamato un diagramma di oggetti). Un diagramma di classe ha lo scopo di catturare i concetti di sistema, la loro struttura e le loro relazioni in modo statico. Può essere d'aiuto iniziare con un diagramma di classe e poi passare a un diagramma di istanze in cui è possibile collegare alcuni valori nelle "slot" o proprietà delle istanze dell'oggetto per vedere se il modello nel diagramma di classe funziona.

Answer 2

La prima cosa che devi sapere è che JavaScript utilizza prototype-based inheritance. Ciò significa che non vi è alcuna distinzione tra classi e istanze come in altri linguaggi OO (come Java). Ci sono solo oggetti. Una delle implicazioni è che la differenziazione tra class e object diagrams non ha senso.

Per il vostro primo esempio:

var a, b; 

a = {}; 
b = Object.create(a); 

Questa è l'eredità - oggetto b eredita proprietà dell'oggetto a.

modo corretto per modellare questo UML è questo diagramma classe/oggetto:

Mixin può essere visto come una forma di ereditarietà multipla, oggetto c eredita oggetti di oggetto a e b, diagramma per che potrebbe assomigliare a questo:

Answer 3

I suoi esempi sono le relazioni che rappresentano anche tra oggetti, non classi, quindi il diagramma degli oggetti UML è la strada da percorrere (come già sottolineato da RobertMS).

Gli oggetti sono collegati tra loro, nel senso che (nel primo caso) oggetto a è il prototipo dell'oggetto b. Vorrei usare una relazione di dipendenza per questo. Wikipedia ha una buona descrizione della notazione di dipendenza UML here.

Il razionale per l'utilizzo di una dipendenza è che riflette la nozione che "una modifica all'elemento di modellazione influente o indipendente può influire sulla semantica dell'elemento di modellazione dipendente". Poiché spesso utilizziamo oggetti prototipo per contenere proprietà predefinite, nonché metodi, per una raccolta di oggetti "dipendenti" (ad es., oggetti della stessa "classe"), questo uso della dipendenza sembra giustificabile, se non forse un po 'controverso.

Vorrei etichettare la dipendenza con lo stereotipo "< proto >>".

UML ti offre molta flessibilità, sebbene sia piacevole seguire la convenzione.

C'è un buon trattamento degli schemi di oggetti su this page by Scott Ambler.

Nel secondo esempio, utilizzando la funzione extend di jQuery, non si dispone di una vera relazione prototipo, ma si uniscono le proprietà di alcuni oggetti in un altro oggetto. In questo caso, non sono sicuro che ci sia un termine di modellizzazione generale per questo. C'è una sorta di dipendenza qui, però. Suggerirei di consultare l'elenco degli stereotipi di dipendenza UML standard (elencati nella pagina di Wikipedia sopra menzionata) e vedere se qualcosa ha senso nella vostra applicazione specifica. Forse < < raffina >> funziona per te?