VJET/VJET JS vs typescriptlang

From Eclipsepedia

Jump to: navigation, search

Today (10/1/2012) typescript was released and I wanted to a simple class comparison with VJET's type construction library vjo.js. You can get the benefits of classical inheritance without a new keyword so it runs right in the browser without compiling.

VJET js type construction library for building javascript types without a compile step. Uses a lightweight bootstrap js file to support runtime type construction


type script from [http://www.typescriptlang.org/] vjet vjo.js
class Greeter {
	greeting: string;
	constructor (message: string) {
		this.greeting = message;
	}
	greet() {
	    return "Hello, " + this.greeting;
	}
}
 
var greeter = new Greeter("world");
var button = document.createElement('button')
button.innerText = "Say Hello"
button.onclick = function() {
	alert(greeter.greet())
}
document.body.appendChild(button)
vjo.ctype("Greeter").protos({
    greeting:null, //< public String
    constructs:function(message){ //< public constructs(String message)
       this.greeting = message;
    },
   greet:function(){ //< public String fn()
       return "Hello, " + this.greeting;
   }
})
.endType()
 
 
var greeter = new Greeter("world");
var button = document.createElement('button')
button.innerText = "Say Hello"
button.onclick = function() {
 alert(greeter.greet())
}
document.body.appendChild(button)


type script from [http://www.typescriptlang.org/] vjet vjo.js
class Animal {
    constructor(public name) { }
    move(meters) {
        alert(this.name + " moved " + meters + "m.");
    }
}
 
class Snake extends Animal {
    constructor(name) { super(name); }
    move() {
        alert("Slithering...");
        super.move(5);
    }
}
 
class Horse extends Animal {
    constructor(name) { super(name); }
    move() {
        alert("Galloping...");
        super.move(45);
    }
}
 
var sam = new Snake("Sammy the Python")
var tom: Animal = new Horse("Tommy the Palomino")
 
sam.move()
tom.move(34)
vjo.ctype('Animal').protos({
	constructs:function(name){ //< public fn(String)
	       this.name = name;
	},
	//> public void fn(Number)
	 move:function(meters) {
	        alert(this.name + " moved " + meters + "m.");
	 }
}).endType()
 
vjo.ctype('Snake').inherits("Animal")
.protos({
	//> public constructs(String name)
	constructs:function(name){ this.base(name)},
	move:function() {
            alert("Slithering...");
            this.base.move(5);
    }
}).endType()
 
vjo.ctype('Horse').inherits("Animal")
.protos({
	//> public constructs(String name)
        constructs:function(name){ this.base(name)},
        move:function(){
            alert("Galloping...");
            this.base.move(45);
    }
 
})
.endType()
 
 
var sam = new Snake("Sammy the Python");
var tom = new Horse("Tommy the Palomino");
 
sam.move()
 
tom.move(34)


TODO:

  1. ts modules -> vjo.js
  2. ts interfaces -> vjo.itype
  3. ts functions -> js + vjetdoc
  4. how are callback functions described in ts
  5. how are function overloads described in ts
  6. how is an object literal described in ts


To try this out get VJET vjo from the [downloads page] and add to any .html page. No compiler needed. 

More typing is available check out this comparison of type semantics