如何在Typescript接口文件中表示返回类型?

5 javascript typescript

以下代码有什么区别:

changeName(): ng.IPromise<any>;
Run Code Online (Sandbox Code Playgroud)

changeName: () => ng.IPromise<any>;
Run Code Online (Sandbox Code Playgroud)

我知道一个是返回类型,但我对第一个感到困惑.

这是函数体:

changeName = (): ng.IPromise<any> => {
        var self = this;
        self.chnAction = "PREFERENCES.CHANGE_NAME.SUBMITTING_BUTTON_TEXT";
        self.chnErrorMessage = null;
        return self.uss.changeName(
            self.chnNewFirstName,
            self.chnNewLastName)
            .then(
            (response: ng.IHttpPromiseCallbackArg<any>): any => {
                self.chnAction = "PREFERENCES.CHANGE_NAME.SUBMITTED_BUTTON_TEXT";
                self.chnNewFirstName = '';
                self.chnNewLastName = '';
                self.chnErrorMessage = null;
                self.logout();
                return this.$state.go('home.auth', { content: 'change_name_success' });
            },
            (error: ng.IHttpPromiseCallbackArg<any>): ng.IPromise<any> => {
                if (error.status === 500) {
                    self.chnErrorMessage = 'AUTH_SERVICE.UNABLE_TO_CONTACT_SERVER';
                } else {
                    var errors: string[] = [];
                    Object.keys(error.data.modelState).forEach((key) => {
                        errors.push.apply(errors, error.data.modelState[key]);
                    });
                    self.chnErrorMessage = errors[0];
                    self.chnErrorMessages = errors;
                    self.chnAction = "PREFERENCES.CHANGE_NAME.SUBMIT_BUTTON_TEXT";
                }
                return this.$q.reject(error);
            });
    };
Run Code Online (Sandbox Code Playgroud)

Dav*_*ret 8

根本区别在于:

  • changeName(): ng.IPromise<any>;代表一种方法
  • changeName: () => ng.IPromise<any>;表示可以保存函数的属性(这是匹配的,changeName = (): ng.IPromise<any> => { ... };因为它将函数分配给属性)。

因此,属性和方法之间的差异适用。下面是一个例子:

interface MyInterface {
    myMethod(): string;
    myProperty: () => string;
}

class MyBaseClass implements MyInterface {
    myMethod() {
        return "string";
    }

    myProperty = () => "string";
}

class MyChildClass extends MyBaseClass {
    myMethod() {
        return super.myMethod();
    }

    myProperty = () => super.myProperty(); // error
}
Run Code Online (Sandbox Code Playgroud)

有时使用箭头函数属性而不是方法的原因是因为分配给属性的箭头函数会保留this任何绑定到它的值...

class MyClass {
    myMethod() {
        console.log(this);
    }

    myProperty = () => console.log(this);
}

new MyClass().myMethod.call({});   // outputs {}
new MyClass().myProperty.call({}); // outputs the instance of MyClass
Run Code Online (Sandbox Code Playgroud)

...因为 的值this保留在构造函数中...

var MyClass = (function () {
    function MyClass() {
        // captures this here
        var _this = this;
        // guaranteed to always use instance of class for `this`
        this.myProperty = function () { return console.log(_this); };
    }
    MyClass.prototype.myMethod = function () {
        // not guarnateed to always use instance of class
        console.log(this);
    };
    return MyClass;
})();
Run Code Online (Sandbox Code Playgroud)

旁注:您可以.call此处阅读JS 中的内容。