Question

我将问题修改为更具体。现在我不关心所需的行为，我只需要纠正语法错误

我正在研究this tutorial我在这段代码中遇到错误。

严重性：'错误'

消息：'PagerserviceProvider'类型中不存在'属性'偏移'。'

实际上我对这三个变量有相同的错误。

that.pageSize，that.offset，that.size

public async getPager(tableName:string,pageSize: number = 10) {
let pageSize = pageSize;
let offset = 0;
let limit = pageSize;
let size = await this.getTotal(tableName);
let that = this;
return  {
        initialPage:function(){

            return new Promise((resolve,reject)=>{
                var d = [];
                that.executeSql(tableName,limit,offset).then((data)=>{
                    console.log(JSON.stringify(data));
                    for(var i = 0 ; i < data.rows.length ; i++)
                    {
                        d.push(data.rows.item(i));
                    }
                    resolve(d);
                },(e)=>{
                    reject(e);
                });
            });

        },
        nextPage:function(){
            if(that.offset <= that.size - that.pageSize )
            {  
                that.offset +=  that.pageSize;
            }
            return new Promise((resolve,reject)=>{
                var d = [];
                that.executeSql(tableName,limit,offset).then((data)=>{
                    for(var i = 0 ; i < data.rows.length ; i++)
                    {
                        d.push(data.rows.item(i));
                    }
                    resolve(d);
                },(e)=>{
                    reject(e);
                });
            });                    
        }            
    };}

Answer 1

当您使用关键字function来声明函数时，函数＆＃39; s不会引用上部this。所以在函数体中使用this指的是函数本身。

您遇到的问题与您的函数在已经定义了this的类中声明的事实有关，因此您需要一种方法来引用上部this嵌套函数。

class Test {

  hello () { console.log('hello') }

  method () {
    this.hello() // It will work because `this` refers to the class
    function sayHello () {
      return this.hello()
      // it won't work because `this` refers to the function sayHello
    }
    return sayHello()
  }
}

要绕过此限制，您可以在代码位于较高范围内时将上限this保存在变量中。此变量通常称为that或self。

class Test {

  hello () { console.log('hello') }

  method () {
    var that = this // that is now refering to the class
    this.hello() // It will work because `this` refers to the class
    function sayHello () {
      return that.hello()
      // that is still refering to the class so it will succeed
    }
    return sayHello()
  }
}

编辑：

避免使用that的另一个技巧是使用ES6箭头功能。在箭头函数中，this总是指上面的范围。

class Test {

  hello () { console.log('hello') }

  method () {
    this.hello() // It will work because `this` refers to the class
    // `this` refers to the upper scope by default so it works
    const sayHello = () => this.hello()
    return sayHello()
  }
}

编辑2：

您的代码应为：

  public async getPager(tableName: string, pageSize: number = 10) {
    let pageSize = pageSize;
    let offset = 0;
    let limit = pageSize;
    let size = await this.getTotal(tableName);
    let that = this;
    return  {
        initialPage: function () {

            return new Promise((resolve,reject)=>{
                var d = [];
                that.executeSql(tableName, limit, offset).then(data => {
                    console.log(JSON.stringify(data));
                    for(var i = 0 ; i < data.rows.length ; i++) {
                        d.push(data.rows.item(i));
                    }
                    resolve(d);
                }, e => {
                    reject(e);
                });
            });

        },
        nextPage: function () {
            if(offset <= size - pageSize ) {  
                offset += pageSize;
                // no need to use `that` because you used `let`
            }
            return new Promise((resolve, reject) => {
                var d = [];
                that.executeSql(tableName, limit, offset).then(data => {
                    for(var i = 0 ; i < data.rows.length ; i++) {
                        d.push(data.rows.item(i));
                    }
                    resolve(d);
                }, e => {
                    reject(e);
                });
            });                    
        }            
      };
    }

Answer 2

'that'只是用于在代码开头存储'this'原始值的变量的名称，因为'this'的值会发生变化。变量名称可以很容易地成为“狗”或“苹果”。

如果您打算在该时间点访问“this”的当前值，您可以选择稍后在代码中使用“this”。否则，您可能会引用存储其值的原始变量，例如： '那'，'狗'或'苹果'。

Answer 3

getPager是一种方法：如果您使用已经丢失的上下文调用它，that将获得当前this值，这不会指向正确的上下文。

const someInstance = new SomeClass()

someInstance.getPager() // You call getPager directly from the someInstance context

someHTMLButton.onClick = someInstance.getPager // Here the getPager method lost its context

解决方案是将getPager绑定到someInstance。这样，它的上下文this始终指向someInstance。

someHTMLButton.onClick = someInstance.getPager.bind(someInstance)

收到错误“属性不存在”

3 个答案: