TypeScript for plugins development

I have been working on some plugins with vanilla JavaScript (ES5) and there was no problem so far; however, for something bigger (Luna Engine for example), I foung it there are some problems with JavaScript itself, so I decided to find a language/tool to help me there, and that's when I tried TypeScript.

Introduction

TypeScript is a superset of JavaScript which will be compiled into plain JavaScript. You can easily code anything in TypeScript and publish as plain JavaScript without any trouble, and they will be compatible with any browser support ES5/6.

TypeScript also takes the class notation in ES6, so coding in TypeScript is not so different to coding in plain JavaScript, except the type/interface defination we will talk below.

Types and Interface

TypeScript will check your code before compiling into JavaScript, so that any problem you might meet in development will be catched beforehand. And what awesome is the type and structure checking in TypeScript.

For example, you set variable var str: string, the variable will be forced to be string and will raise an error if you assign different type to that variable.

Furthermore, TypeScript allows us to define a new type of variable in a structure way. For example, we can force an object must have a defined structure:

interface Parameter {  
    strength: number;
    defense: number;
    agility: number;
    magic: number;
}

interface Actor {  
    id: number;
    name: string;
    parameters: Parameter;
}

var actor: Actor;  

Those above code will force the Actor type to the variable actor, and the compiler will raise an error if the object actor doesn't have the same structure we defined in the interface Actor.

So what's good?

Firstly, TypeScript syntax and notation are cleaner than ES5, while ES6 is not fully support in most browsers and RMMV's nw.js. I have converted most of the Luna Engine code base and think it looks more cleaner than the vanilla JavaScript version.

Secondly, writing your code in more structure way is good, it will help you a lot of problems in the future. For example, you always know the types of parameters (arguments) we pass to a function/method, and can easily find it to debug, while using vanilla JavaScript, you don't always find the type/class easily.

Thirdly, TypeScript is good for every traditional OOP lovers! I have seen a lot people coding JavaScript in Java/C# way, so why not try TypeScript.

What bad about TypeScript

TypeScript is good; however, there are still some problems with TypeScript.

Firstly, not all people want to learn a new language, even though TypeScript is mostly alike JavaScript (ES6). In real life jobs, many companies still prefer JavaScript than another superset. And if the RPG Maker community doesn't like TypeScript, you will be the only one who update the plugins!

Secondly, because of its structure and types, you have to manually define module, class, ... of third party JavaScript libraries so that the compiler won't raise any error in development. Luckily, most of popular libraries have a defination file for you. Sadly, RPG Maker MV library is not there.

Thirdly, the output JavaScript file might look ugly!

How to develop with TypeScript

Firstly, you have to learn the language itself. This will take very little time if you have been coding in JavaScript in a long time, and have a bit knowledge about OOP.

Secondly, you have to get the compiler. You can see the short tutorial in TypeScript homepage (http://www.typescriptlang.org/).

However, if the command-line is too hard for you, try Atom with atom-typescript, the code will be compiled by one press F6!

Please leave your opinions and comments ~

Dr.Yami

Read more posts by this author.

Oulu, Finland http://yami.moe