TypeScript 'this'的范围问题[英] TypeScript 'this' scoping issue

本文是小编为大家收集整理的关于TypeScript 'this'的范围问题的处理/解决方法,可以参考本文帮助大家快速定位并解决问题,中文翻译不准确的可切换到English标签页查看源文。

问题描述

我的代码:

export class WordService {
    constructor(private http:Http, private storage:Storage){}
    impulseData={
        get():Promise<any>{
            return this.storage.get('impulseData');
        }
    };
}

当我致电myWordService.impulseData.get()时,我发现this.storage是undefined.那么如何到达impulseData.get中的属性storage?

我猜这个问题是由this的范围引起的.也许我应该让this内部和外部impulseData共享相同的范围?

更新:

感谢Suren Srapyan的回答,我终于将代码更改为

impulseData={
    get:()=>{
        return this.storage.get('impulseData');
    }
};

推荐答案

this是指没有storage属性的get()函数上下文.

您可以使用arrow functions

export class WordService {
    constructor(private http:Http, private storage:Storage){}
    impulseData = {
        get: (): Promise<any> => {
            return this.storage.get('impulseData');
        }
    };
}

或尝试将this放在外部,然后在构造函数中创建对象.另外,在这种情况下,您需要将对象连接到this,因为现在它在构造函数中范围内,并且在其外部不可见,如果它不连接到this.

.
export class WordService {
    impulseData;

    constructor(private http: Http, private storage: Storage) {
        const context = this;
        this.impulseData = {
            get(): Promise<any> {
                return context.storage.get('impulseData');
            }
        };
    }
}

,如果您在构造函数中创建

,则只能使用storage.get('impulseData')

其他推荐答案

在这种情况下,您可以使用构造函数参数,而无需this.

constructor(private http:Http, private storage:Storage){
  impulseData = {
    get():Promise<any>{
        return storage.get('impulseData');
    }
  };

否则,您应该使用本地变量

constructor(private http:Http, private storage:Storage){
  let self = this;
  impulseData={
    get():Promise<any>{
        return self.storage.get('impulseData');
    }
  };

本文地址:https://www.itbaoku.cn/post/2288304.html

问题描述

My code:

export class WordService {
    constructor(private http:Http, private storage:Storage){}
    impulseData={
        get():Promise<any>{
            return this.storage.get('impulseData');
        }
    };
}

When I call myWordService.impulseData.get(), I found this.storage is undefined. So how can I reach the property storage inimpulseData.get?

I guess this problem was caused by the scoping of this. Maybe I should let the this inside and outside impulseData share the same scope?

Update:

Thanks to Suren Srapyan's answer, I finally change my code to this:

impulseData={
    get:()=>{
        return this.storage.get('impulseData');
    }
};

推荐答案

this refers to the get() function's context which doesn't have storage property.

You can use arrow functions

export class WordService {
    constructor(private http:Http, private storage:Storage){}
    impulseData = {
        get: (): Promise<any> => {
            return this.storage.get('impulseData');
        }
    };
}

Or Try to get the this outside and create the object in the constructor. Also in this case you need to attach your object to this, because now it is scoped in the constructor and is not visible outside it, if it is not attached to this.

export class WordService {
    impulseData;

    constructor(private http: Http, private storage: Storage) {
        const context = this;
        this.impulseData = {
            get(): Promise<any> {
                return context.storage.get('impulseData');
            }
        };
    }
}

Or you can use only storage.get('impulseData'), if you create in the constructor

其他推荐答案

In this case you could use the constructor parameter without this.

constructor(private http:Http, private storage:Storage){
  impulseData = {
    get():Promise<any>{
        return storage.get('impulseData');
    }
  };

Otherwise you should use a local variable

constructor(private http:Http, private storage:Storage){
  let self = this;
  impulseData={
    get():Promise<any>{
        return self.storage.get('impulseData');
    }
  };