Microsoft TypeScript: краткое введение и любовная интрига

Хорошо, я знал, что это будет. По крайней мере, я сделал вывод. Когда я несколько месяцев назад отправился в Microsoft, чтобы принять участие в саммите MVP, у нас была потрясающая сессия от Андерса, и я спросил его, каково будущее C #. Он пробормотал что-то вроде «JavaScript — это настоящий кроссплатформенный язык» (я правильно это слышал?)

И было предположение, что Андерс работает над чем-то связанным с JavaScript. И вот, Typescript здесь. TypeScript — это аккуратный маленький язык, который компилируется в JavaScript, и скомпилированный вывод кажется читаемым и довольно печатным, так что вы можете использовать скомпилированный JavaScript напрямую где угодно. Я играл с Typescript, и он выглядит довольно аккуратно (да, я повторяю термин «аккуратно»). Синтаксис имеет магическое сходство с эстетикой C # (или это было моё чувство?). Я видел, как мало кто задавался вопросом, является ли TypeScript версией Microsoft от Dart или это какой-то сценарий Coffee Script на стероидах, но после того, как я попробовал TypeScript некоторое время, я влюбился в Typescript. Я делал некоторые заметки и объединил их для этой записи в блоге.

Вы можете установить Typescript отсюда , а затем в Visual Studio попробуйте создать приложение HTML с Typescript. (Поклонники OSS, поднимите настроение, также доступна поддержка VI, Sublime и Emacs )

Быстрый Hello World в TypeScript

Вот краткий привет сценарий мира, который я написал, используя Typescript. Вы можете увидеть файл сценария типа (app.ts) и сгенерированный файл app.js. Как я уже говорил, синтаксис очень похож на C #. И большой сюрприз — как видно из названия, Type Script поддерживает «Типы». Смотрите мой класс HelloWorld ниже, у меня есть конструктор, который принимает HTMLElement, и у меня есть метод sayHello, который принимает сообщение типа string. Я чувствую, что эти контракты типов будут большим благом, потому что это поможет программистам определить ожидаемые типы для функции.

Вот код Typescript и сгенерированный код Javascript. Работая в Visual Studio, я заметил, что редактор Typescript в Visual Studio обеспечивает вывод типов, это круто. Смотрите мой класс HelloWorld — довольно понятно.

//Our TypeScript HelloWorld class

class HelloWorld {
    
    //A variable of type HTMLElement
    element: HTMLElement;

    //A Consctructor that accepts an element
    constructor (e: HTMLElement) { 
        this.element = e;
    }

    //A public method
    sayHello(message: string) {
        this.element.innerHTML = message;
    }

}

window.onload = () => {
    var e = document.getElementById('content');

    //Initiate HelloWorld Class
    var hello = new HelloWorld(e);
    hello.sayHello("Hello World");
};

var HelloWorld = (function () {
    function HelloWorld(e) {
        this.element = e;
    }
    HelloWorld.prototype.sayHello = function (message) {
        this.element.innerHTML = message;
    };
    return HelloWorld;
})();
window.onload = function () {
    var e = document.getElementById('content');
    var hello = new HelloWorld(e);
    hello.sayHello("Hello World");
};

//Our TypeScript class now with Callbacks

class HelloWorld {
    
    //A variable of type HTMLElement
    element: HTMLElement;

    //A Consctructor that accepts an element
    constructor (e: HTMLElement) { 
        this.element = e;
    }

    //A public method. See notify paramter is now taking a Function Type
    sayHello(message: string, notify: (feedback : string)=>any ) {
        alert(message);
        //Do some other complex stuff here
        notify("completed sayHello");
    }

}

window.onload = () => {
    var e = document.getElementById('content');

    //Initiate HelloWorld Class
    var hello = new HelloWorld(e);
    hello.sayHello("Hello World", function (feedback) {
            alert(feedback);
        }
    );
};

{name: string, age: number}

 interface Human 
   {
    name: string, 
    age: number
   }