javascriptarraysumldiagram

What kind of diagram for Javascript constructors and prototypes ?


In javascript, I have a big data structure of objects containing array of objects an so on... What kind of diagram should I use for represent them ? Especially, I want to show the relation between an array inside an object and the constructor of the objects it contains.

var Bar = function ()  {
    this.a;
    this.b;
}

var Foo = function () {
    this.a;
    this.b;
    this.c = []; // Array of Bar
}

Solution

  • To represent the structure of objects in UML, you can use:

    The latter seems to make more sense here, and there are several ways to represent your case.

    First, if you want to focus on Foo only, leaving the details of Bar for another diagram, you could just show a property of type Bar with a multiplicity between brackets (* stands for unbounded, i.e. 0 to infinity in size):

    class Foo with properties

    But if you want to show both classes, you could go for:

    class Bar and Foo with simple one-to-many association

    Now the problem with this is that it shows the association between Foo and Bar, but it doesn't show that Foo knows its Bars but Bar doesn't know anything about the Foo it belongs to.

    The perfect notation for your array would be the dot notation, putting a little dot on the Bar side. But this notation is unfortunately not well known, and many free and entry-level tools don't support it.

    An alternative is to use the navigability notation, using an arrow to show the direction of the link (and if needed a X on the other side to explicitly state the absence of navigation in the opposite direction, alas most modellers don't know about the meaning of this cross): class Bar and Foo with navigable one-to-many association

    P.S: As the UML guru qwerty_so noted in the comment of the other answer, the shared aggregation does not add any useful information compared to a simple association and should be avoided whenever possible. Moreover, the white diamond is not sufficient to indicate that there are many Foos for one Bar, because the same notation could be used for an and b as well. Multiplicity SHOULD be explicitly indicated for an array.