24

Given that UML is oriented towards a more classic approach to object orientation, is it still usable in a reliable way to design JavaScript systems?

One specific problem that I can see is that class diagrams are, in fact, a structural view of the system, and JavaScript is more behaviour driven, how can you deal with it?

Please keep in mind that I'm not talking about the real world domain here; it's a model for the solution that I'm trying to achieve.

user2428118
  • 109
  • 6
Julio Rodrigues
  • 940
  • 2
  • 9
  • 19
  • 7
    Many of us would say UML are not adequate to design really anything. I'm of the opinion the only value whatsoever in the whole canon of UML is the sequence diagram. Every other UML diagram I have tried to understand has been better explained in english. But that's subjective for what it is. – Jimmy Hoffa Sep 15 '12 at 02:43
  • 1
    @JimmyHoffa I agree to a considerable extent. Especially with modern IDE's, a programmer should easily be able to look at object-oriented source code and obtain the same information (and more) that is depicted in a class diagram. I can imagine class diagrams being more useful before modern IDE's with syntax highlighting and auto-generated outlines were available. Class diagrams may be suited for depicting object-oriented structures to people without programming experience or in a large project where there is not enough time for the developer to verbally explain the design to everyone. – David Kaczynski Sep 15 '12 at 12:19
  • 1
    @JimmyHoffa Would you please recommend some good books or resources on systems modeled using sequence diagrams specifically? I read [Applying UML and Patterns](http://www.amazon.com/Applying-UML-Patterns-Craig-Larman/dp/0137488807) and it provided really good examples form using UML practically instead of just explaining the diagrams and syntax. – Songo Sep 15 '12 at 16:51
  • @JimmyHoffa: I agree to you almost, but not about sequence diagrams - because IMHO sequence diagram show nothing what cannot be better expressed with pseudo-code. The only diagram type which has real use for me are data-flow diagrams, and those are not part of UML. – Doc Brown Sep 16 '12 at 21:05
  • @DocBrown fair enough, let's just agree that learning UML should be avoided and rather a reading of the strunk & white should replace it perhaps :) – Jimmy Hoffa Sep 16 '12 at 21:07

6 Answers6

20

It sounds like you're asking two different things

  • Can UML be utilized to depict javascript systems?
  • Can class diagrams be utilized to depict javascript systems?

Keep in mind that UML includes many types of diagrams, specifically a branch of behavior diagrams, including sequence and use case diagrams. Such diagrams specifically address your concern of modeling javascript as a behavior driven language.

It is quite possible that a javascript system is not using object-oriented design. In such a case, class diagrams would probably not be appropriate, as you pointed out. However, since javascript does support object-oriented design, it is possible for class diagrams to effectively depict a system using javascript. It really depends on how the javascript is being used.

David Kaczynski
  • 1,376
  • 1
  • 10
  • 28
5

Your answer is hidden in your question:

One specific problem that I can see is that class diagrams are, in fact, a structural view of the system, and javascript is more behaviour driven, how can you deal with it?

Look at BDD (Behavior-driven development) techniques and choose tools that suit your design needs.

Related discussion that you may find useful to look - How to write stories / scenarios in BDD. And a very comprehensive article from Code magazine - Behavior-Driven Development

ps: In general, UML represent general types of behavior, however it can still be used to model your design with right set of selected category (like a sequence diagram). I would reference the Wikipedia and find the right UML diagram category to use.

Community
  • 1
Yusubov
  • 21,328
  • 6
  • 45
  • 71
  • It seems to be a problem definition or development management approach. I was actually talking about a lower level design, closer to the solution. – Julio Rodrigues Sep 15 '12 at 01:27
4

There has been work done to adapt web application to UML, its called the WAE extension and there is a book called Building Web Applications with UML by Jim Conallen explaining it in detail. You can see variables and function of JavaScript in the class diagram.

Why i believe its the best option to model web application ? Because evrybody know how class diagram works and this is the closest thing to it. Its very easy to understand and programmers are too lazy to read documentation in words, but looking at a diagram is not that hard ;). However, if you want to see what happens at the execution, then you should look for a sequence diagram because in web application, sometime files are generated dynamically.

Diagram generated by node.js package "wavi"

Bakunin95
  • 196
  • 2
3

There are behavior models, also, in UML that you can use to depict the behavior of the system like Sequence Diagrams or State Chart Diagram

Dummy Derp
  • 411
  • 1
  • 8
  • 18
1

Yes, you can use UML, most notably sequence diagrams.

With regard to the use of class diagrams, it depends on whether you design your application using object oriented design principles or not. If you have just a bunch of JavaScript functions, class diagrams don't add much. If you use JavaScript object prototypes to simulate a kind of classes, then these diagrams will be useful.

Based on my experience in designing Javascript front-ends in UML, I have written a white paper on the subject: Technical design in UML for Angular applications.

www.admiraalit.nl
  • 1,103
  • 5
  • 8
0

It seems that you can use UML for JavaScript, but it will depend on how you are going to approach your work.

Specifically JS/UML can automate UML documentation for JSDoc, Dojo, YUI.

I would guess that there's more out there but didn't run across anything else yet.

knguyeniii
  • 11