Friday, 7 October 2011

Cross platform applications with HTML5/JavaScript and how this ties in with SOLID OO principles

I have just started to think about writing applications that are cross platform impendent ie that can run on devices like iPad. Here are some notes about this subject
Over the last few years I have made extensive use of SOLID. OO programmin principles as I developed C# applications in .Net.

SRP: The Single Responsibility Principle A class should have one, and only one, reason to change.
OCP: The Open Closed Principle You should be able to extend a classes behavior, without modifying it.
LSP: The Liskov Substitution Principle Derived classes must be substitutable for their base classes.
ISP: The Interface Segregation Principle Make fine grained interfaces that are client specific.
DIP: The Dependency Inversion Principle Depend on abstractions, not on concretions.

My first reaction was to reapply these principles in JavaScript. So I started to think of interfaces, dependency injection containers, mocking frameworks and Test Driven development. It turns out that there is a fundamental difference between C# and JavaScript in the sence that c# is class based and JavaScript is prototypical. So it is difficult to apply the notion of interfaces and abstraction in the world of JavaScript.

So the question is what principles are relevant to a Prototypical language over a Class based OO language. As far as I can see :

S Applicable
O Not Applicable
L Applicable
I Not Applicable
D Not Applicable

One principle that applys to both programming paradigms is DRY which stands for Don't Repeat Yourself

JavaScript Object Oriented Programming include classes, inheritance, and scope that can be used encapsulate, support namespaces, and avoid collisions. Actually JavaScript does not have a class entity BUT it implements the pattern of classes. The difference is in the inheritance model. In other object oriented languages, class is an actual data type that represents the blueprint for creating objects. In JavaScript, although we can use Functions to simulate an object blueprint, they are just in fact objects themselves. These objects are then used as models (aka prototypes) for other objects. Applying the concept of prototypal inheritance allows us to create “subclasses”, or objects that inherit the properties of another object. This becomes particularly useful when we want to use the methods of another object with some slight modifications.

The next thing I was thinking about is that after programming a while in Xaml I preffer to use the MVVM model over the MVC. This is in MVC the Controller is tightly coupled to the view. In practical terms this means that every time you need to change a control on the view the controller needs to change things like how this effects all the other controls. Where as in MVVM the View is completely separate from the VM and thus a change to a control results in minimal update to the ViewModel. It turns out that there is a JavaScript library called KnockOut.js that makes the MVVM pattern possible

Here are some examples of JavaScript. It can be seen that JavaScript is far from just a begineers language. JavaScript's prototypal OOP is flexible and it does not limit the programmer to things like static typing.

Here is an example of how to create your own foreach function:

for (var i=0; i= companrand:}
"=" : function(comporand){return function(e){return e= companrand:}


This is called Curring after Mr Curry.
btw If you uise this in DOS you will need toescape the > to ^>

Here is a way tobiuld up the arrays:
UpTo : function(Upeer,step)
var a[]
for(var i = this.valueof(Upper); j return a;


This is called High Order Programming

Here's a link to some further examples:

The next version of Visual Studio will have a lot more support for JavaScript development, so this should reduce the barrier to trying this out...