TypeScript: An Alternative to JavaScript

HTML5 is becoming a popular platform among game developers to deliver their games on web. Several game engines and tools have been developed to make the game development process smoother. But the basic limitation of HTML5 is that you get stuck with JavaScript. Unlike desktop games where you can use any language to develop games, same is not possible with HTML5 even in android there are different languages available e.g. Java, C++ and lua.

JavaScript is a nice language but it does not offer static type checking and class based object oriented programming. There are ways to simulate class based object oriented behavior through prototypes but currently there is no direct way. Hence things gets really complicated while developing large scale applications in JavaScript.

To deal with this situation, developers have come up with new languages which offer more functionality and features but they still get compiled into JavaScript only. So, you can develop applications and games in languages other than JavaScript but they will still run on web browsers as the compiled output will be a JavaScript only.

Several languages have been built upon JavaScript including some famous ones like coffee script, type script, Dart, etc. In this blog, we will talk about TypeScript.

typescript TypeScript: An Alternative to JavaScriptAs per Wikipedia: TypeScript is a free and open source programming language developed by Microsoft. It is a strict superset of JavaScript, and essentially adds optional static typing and class-based object oriented programming to the language. Anders Hejlsberg, lead architect of C#, has worked on development of TypeScript.

TypeScript extends JavaScript syntax, so any existing JavaScript programs work with TypeScript without any changes. TypeScript is designed for development of large applications and when compiled it produces JavaScript to ensure compatibility.

TypeScript is a language extension that adds features to JavaScript.

  • Type annotations and compile-time type checking
  • Classes
  • Interfaces
  • Modules
  • Abbreviated “arrow” syntax for anonymous functions

Getting Started with TypeScript

To use TypeScript you will need its compiler which is based on node.js. Hence, you need to first install node.js (Note: node.js is only required to compile the typescript to javascript)

Once you have installed node.js, install typescript

> npm install -g typescript

to compile any typescript file use tsc command

> tsc your.js

Let’s Say Hello to TypeScript

1
2
3
4
5
function greet()
{
  console.log(“Hello! World”);
}
greet();

As you can observe that above code is plain JavaScript which shows that typescript is nothing but a super set of JavaScript, hence your existing JavaScript project is already compatible with TypeScript.

Let’s write the above program using classes.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
class Greeting
{
private name:String;
constructor(n:String)
{
this.name = n;
}
sayHi():String
{
return “Hello!+ this.name;
}
doHi()
{
console.log(this.sayHi());
}
}
var greet = new Greeting(“Suyash”);
greet.doHi();

The corresponding JavaScript generated is

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var Greeting = (function () {
function Greeting(n) {
this.name = n;
}
Greeting.prototype.sayHi = function () {
return “Hello!+ this.name;
};
Greeting.prototype.doHi = function () {
console.log(this.sayHi());
};
return Greeting;
})();
var greet = new Greeting(“Suyash”);
greet.doHi();

You might think that if you have to write more code, then why to choose TypeScript. Because as your project scales, code gets complicated and a proper structuring of your code will be needed. TypeScript is developed keeping in mind the large-scale applications.

For game developers, TypeScript can be very useful as it supports class based object oriented programming and you can easily represent different game objects and people in your game through classes which will make your code easily represent the real world scenario.

If you have any questions or need any further assistance, please feel free to write us at support@shephertz.com.

twitter TypeScript: An Alternative to JavaScriptfacebook TypeScript: An Alternative to JavaScriptgoogle TypeScript: An Alternative to JavaScriptlinkedin TypeScript: An Alternative to JavaScriptpinterest TypeScript: An Alternative to JavaScriptreddit TypeScript: An Alternative to JavaScriptstumbleupon TypeScript: An Alternative to JavaScripttumblr TypeScript: An Alternative to JavaScript

4 thoughts on “TypeScript: An Alternative to JavaScript

  1. Javascript provides object-orientation, in fact nearly everything in Javascript is an object. Arrays are objects, RegExps are objects, even functions are objects. In fact only a handful of primitive types (string, number, boolean, and a few more) aren’t objects, but even they can be treated like objects and you can use the property-access-operator “.”(dot) on them and call instance-methods. So JavaScript is one of the most object oriented programming languages out there.

    What you meant was classical inheritance. Javascript provides prototypical inheritance instead, which is even more powerful than classical inheritance, e.g. you can easily implement classical inheritance through prototypical inheritance, but not the other way round.

    And by the way: The next version of ECMAScript (underlying specification of JavaScript) will have syntactic sugar for classical inheritance similar to TypeScripts or CoffeeScripts Syntax.

    • I agree with you. But for a developer who is coming from c++ or java language, may find prototype style object oriented programing a bit uncomfortable. Some developers might still prefer classical inheritance, for them typescript can be a good choice.

      Until ECMAScript 6 is released and adopted on all browsers, I would prefer to use typescript.

    • This article is about trying a language other than javascript that could be useful to developers who like classical style object oriented programming.

Leave a Reply

Your email address will not be published. Required fields are marked *


+ nine = 16

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>