如何将用户关键字添加到VS2013 TypeScript语言文本编辑器中？

Question

I need to add "self" as a "user keyword" but I cannot see to do this in VS2013. I would like it to be a user keyword for the TypeScript editor window.

I am making frequent use of "self" in my code. Is there a way that I can add the word "self." as a keyword and have it appear in a different color in my TypeScript text editing window?

Here's an example of where I would use self and would like to have it highlighted:

class X {
    abc=1;
    static $inject = ['$http'];
    constructor(private $http: ng.IHttpService) {}
    doTask = () => {
        var self = this;      
        this.$http({
            xx
        })
        .success((data) => {
            self.abc = data
        })
    }
}

Update:

I have added a few lines to the question to more closely match the way I am using self .

Answer 1

This will work fine with a lambda :

class X {
    doTask = () => {    
        this.doJob({
            foo: "bar"
        }).success((data) => {
            this.abc = data;
        });
    }
}

It compiles to:

function X() {
    var _this = this;
    this.doTask = function () {
        _this.doJob({
            foo: "bar"
        }).success(function (data) {
            _this.abc = data;
        });
    };
}

Answer 2

I recommend trying ReSharper ( http://www.jetbrains.com/resharper/ ) to extend the syntax highlighting options in VS2013. It's a 30-day trial, but if it does what you need then I'd say it's worth purchasing. Here's a link to the documentation for the extended color highlighting:

http://www.jetbrains.com/resharper/webhelp/Coding_Assistance__Syntax_Highlighting.html

From your question, it seems that all you're interested in doing is specifying another keyword to highlight so that it visually stands out in the code. ReSharper will allow you to easily do this.

Answer 3

This is how would your class look like property written in TypeScript using methods. Then you would not need to bother with self .

class X {
    private abc: number = 1;

    public doTask(): void {
        this.doJob()
            .success((data) => this.processData(data));
    }

    private processData(data: any): void {
        this.abc = data.id;
    }
}

Answer 4

You can modify your code example to take better advantage of TypeScript and avoid the need to define a self variable. Consider the following.

class X {
    abc = 1;
    static $inject = ['$http'];
    constructor(private $http: ng.IHttpService) { }
    doTask() {
        this.$http({
            xx
        })
        .success(data => {
            this.abc = <number>data;
        });
    }
}

The body of doTask is defined in a function rather than a lambda. When TypeScript sees a function (named or anonymous), it uses it as the scope that inner this references should apply to. TypeScript implements this by creating a _this variable in the .js file at the function level, which mirrors the self variable you were looking to create by hand.

Just as it is important to use a function at the outer scope, it is important to use a lambda for the success handler. If you had coded the handler like the following, it would create a new "this scope", causing _this to not be generated.

    .success(function (data) {
        this.abc = <number>data; // Not desired behavior - creates a new abc variable
    });