Category Archives: TypeScript

Test of Typescript SyntaxHilighter 1.5

 

//#region person class
class Person {
  @memoize('test')  //Typescript 1.5 decorators
  get name() { return '${this.first} ${this.last}'; }
  //test
  set name(val) {
    let [first, last] = val.split(' ');
    this.first = first;
    this.last = last;
  }
  greeting: string;
  constructor(message: string) {
    this.greeting = message;
  }
  //test of comment with a > and a < in it. Plus a #. Plus @test2
  greet(@anotherDecorator z : string) : string {
    var x = greeting || test;
    var t = 12 + 3;
    var b = !!x;
    $(".js-alert-link").on("click", (event:JQueryEventObject) => this.startTimer(event));
    return "Hello, " + this.greeting;
  }
}
//#endregion


TYPESCRIPT CONVERSION A MONTH LATER

I’d like to report that the port of my project to TypeScript has been a success, so far the issues encountered have been minimal.  One issue I did bump into recently was due to a typo on my part.  I had used a variable in a small method as both a string and number at different points, like so

var x = parseInt(somestring);

...

x = x.toString();

During the conversion to TypeScript, I resolved the type errors caused by this by creating a string and a numeric variable like so

var xn : number = parseInt(somestring);

...

var xs:string = xs.toString();

but notice the typo, I did xs.toString() and assigned it to xs itself, not xn.toString().  This does not cause any compilation errors in TypeScript, but the code is essentially a guaranteed null reference error at run-time.  In my case it was a month before the little used method was executed.

TYPESCRIPT WORDPRESS PLUGIN FOR SYNTAX HIGHLIGHTER EVOLVED

I developed a simple WordPress Plugin for Syntax Higlighter Evolved for displaying TypeScript (http://wordpress.org/plugins/syntax-highlighter-evolved-typescript/)

I found these links helpful in publishing and deploying the plugin. 

First I signed up as suggested here (https://wordpress.org/plugins/about/) and then I got the relevant SVN information via e-mail.

Afterwards, I used TortoiseSVN as described here (http://eamann.com/tech/how-to-publish-a-wordpress-plugin-subversion/) and deployed.

TYPESCRIPT CONVERSION TAKEAWAY

The conversion of the 20,000 lines of legacy Javascript in the Windows Control Library was a success.  I touched on the major issues in my previous posts.   The issues encountered themselves weren’t any kind of flaw in TypeScript,  it just demonstrated the need to keep in mind the style of Javascript code that is being generated.  After going through the experience, the following steps are what I would recommend for TypeScript conversion:

1) Rename your .js (Javascript) files to .ts (TypeScript) files and compile.  Fix all errors that arise and test your fixes.

2) Add type annotations to all variable and parameter declarations.  Minimize the use of the ‘any’ type.  Add interfaces to define function signatures.  Use interfaces to describe existing data structures.  Don’t refactor any of your code yet, wait until conversion is complete.

3) Restructure your JavaScript code into modules and classes.  I myself did Step 3 before Step 2, but if I did it again I would do Step 2 first.