Subscribe to GameFromScratch on YouTube Support GameFromScratch on Patreon


30. November 2015

 

Along side the release of Visual Studio 2015 SP1, Microsoft shipped a new version of the TypeScript programming language.  I personally am a huge fan of TypeScript, but I am not entirely certain I am onboard with the changes introduced in 1.7.  Speaking of those changes, here they are, taken from the MSDN TypeScript blog:

 

Async/Await for ES6 targets

With the 1.7 release, TypeScript now supports Async functions for targets that have ES6 generator support enabled (e.g. node.js v4 and above). Functions can now be prefixed with the async keyword designating it as an asynchronous function. Theawait keyword can then be used to stop execution until an async function's promise is fulfilled. Following is a simple example:

"use strict";
// printDelayed is a 'Promise<void>'
async function printDelayed(elements: string[]) {
    for (const element of elements) {
        await delay(200);
        console.log(element);
    }
}
async function delay(milliseconds: number) {
    return new Promise<void>(resolve => {
        setTimeout(resolve, milliseconds);
    });
}
printDelayed(["Hello", "beautiful", "asynchronous", "world"]).then(() => {
    console.log();
    console.log("Printed every element!");
});

We are working on bringing async/await support in TypeScript for other targets, including a breadth of browsers, which might not have ES6 generators support. For more information on current implementation of async/await and how to use it, see our previous blog post.

Polymorphic this Typing

After much community discussion and feedback, TypeScript 1.7 adds a new polymorphic this type. A this type can be used in classes and interfaces to represent some type that is a subtype of the containing type (rather than the containing type itself). This feature makes patterns such as hierarchical fluent APIs much easier to express.

interface Model {
    setupBase(): this;
}
interface AdvancedModel extends Model {
    setupAdvanced(): this;
}
declare function createModel(): AdvancedModel;
newModel = newModel.setupBase().setupAdvanced(); // fluent style works 

For a deep dive on this typing, checkout the TypeScript Wiki.

As a part of supporting the feature, TypeScript 1.7 has made changes in inferring the type from this. In a class, the type of the value this will be inferred to the this type, and subsequent assignments from values of the original type can fail. As a workaround, you could add a type annotation for this. A code sample with recommended work around, along with a list of other potentially breaking changes is available at GitHub.

ES6 Module Emitting

TypeScript 1.7 adds es6 to the list of options available for the --module flag and allows you to specify the module output when targeting ES6. This provides more flexibility to target exactly the features you want in specific runtimes. For example, it is now a breeze to target Node.js v4 and beyond, which doesn't support ES6 modules (but does support several other ES6 features).

//tsconfig.json targeting node.js v4 and beyond
{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6"
    }
} 

ES7 Exponentiation

Finally, a little syntactic sugar! The ECMAScript committee recently moved the Exponentiation Operator proposal to stage 3. So we decided it was ready for TypeScript to adopt, and added support for it in TypeScript 1.7.

let squared = 2 ** 2;  // same as: 2 * 2
let cubed = 2 ** 3;  // same as: 2 * 2 * 2 

let num = 2;
num **= 2; // same as: num = num * num; 

Say goodbye to Math.pow()!

 

I hate Hate HATE the this operator in JavaScript, I think it is among the single biggest mistakes in language design I have ever encountered.  I really hope a polymorphic this in TypeScript isn’t a step down the road to AwfulVille™.  That said, I have faith in Anders Hejlsberg to do the right thing when it comes to language development, so I will take a wait and see approach.

 

You can get Typescript 1.7 as part of the Visual Studio 2015 service pack, or update using npm.

GameDev News

blog comments powered by Disqus

Month List

Popular Comments