将构造对象的方法传递给JavaScript中的函数

时间:2022-12-05 14:37:05

The code below would work in case of regular functions but it doesn't work in case of object methods.

下面的代码适用于常规函数,但在对象方法的情况下不起作用。

I'm getting the following error:

我收到以下错误:

  return this.anotherService.get1(start, end);
              ^
  TypeError: Cannot read property 'anotherService' of undefined

How do I rewrite the code to make getTransactions a general helper function executing different methods passed as arguments?

如何重写代码以使getTransactions成为执行作为参数传递的不同方法的通用辅助函数?

class Service {
  constructor(arg1) {
    this.anotherService= new AnotherService(arg1);
  }

  getMethod1(start, end) {
    return this.anotherService.get1(start, end);
  }

  getMethod2(start, end) {
    return this.anotherService.get2(start, end);
  }
} 

function getTransaction1(arg1, arg2, arg3) {
  let service = new Service(arg1);
  getTransactions(arg2, arg3, service.getMethod1);
};

function getTransaction2(arg1, arg2, arg3) {
  let service = new Service(arg1);
  getTransactions(arg2, arg3, service.getMethod2);
};

function getTransactions(arg2, arg3, func) {
  let start = ......;
  let end = ........;
  func(start, end).then(data => {
    res.json(data);
  }).catch(console.log);
};

1 个解决方案

#1


You can use Function#bind to handle that:

您可以使用Function#bind来处理:

function getTransaction1(arg1, arg2, arg3) {
  let service = new Service(arg1);
  getTransactions(arg2, arg3, service.getMethod1.bind(service));
  // -------------------------------------------^^^^^^^^^^^^^^
}

function getTransaction2(arg1, arg2, arg3) {
  let service = new Service(arg1);
  getTransactions(arg2, arg3, service.getMethod2.bind(service));
  // -------------------------------------------^^^^^^^^^^^^^^
}

Function#bind returns a new function that, when called, will call the original with this set to be the object you pass to bind. (You can also pass additional arguments to bind, but that's not relevant here.)

Function#bind返回一个新函数,当调用该函数时,将使用此set调用原始函数作为传递给bind的对象。 (你也可以传递其他参数来绑定,但这里没有关系。)


Or, of course, you can create getMethod1 and getMethod2 within your constructor using fat arrow functions, which get a lexical this binding:

或者,当然,您可以使用胖箭头函数在构造函数中创建getMethod1和getMethod2,这将获得词法绑定:

class Service {
  constructor(arg1) {
    this.anotherService= new AnotherService(arg1);
    this.getMethod1 = (start, end) => {
        return this.anotherService.get1(start, end);
    };
    this.getMethod2 = (start, end) => {
        return this.anotherService.get2(start, end);
    };
  }
} 

...in which case you don't have to change getTransaction1 and getTransaction2 at all.

...在这种情况下,您根本不必更改getTransaction1和getTransaction2。


Side note: Function declarations (what you're using with getTransaction1 and getTransaction2) aren't statements, and so they aren't terminated with semicolons.

附注:函数声明(与getTransaction1和getTransaction2一起使用的函数)不是语句,因此它们不以分号结尾。

#1


You can use Function#bind to handle that:

您可以使用Function#bind来处理:

function getTransaction1(arg1, arg2, arg3) {
  let service = new Service(arg1);
  getTransactions(arg2, arg3, service.getMethod1.bind(service));
  // -------------------------------------------^^^^^^^^^^^^^^
}

function getTransaction2(arg1, arg2, arg3) {
  let service = new Service(arg1);
  getTransactions(arg2, arg3, service.getMethod2.bind(service));
  // -------------------------------------------^^^^^^^^^^^^^^
}

Function#bind returns a new function that, when called, will call the original with this set to be the object you pass to bind. (You can also pass additional arguments to bind, but that's not relevant here.)

Function#bind返回一个新函数,当调用该函数时,将使用此set调用原始函数作为传递给bind的对象。 (你也可以传递其他参数来绑定,但这里没有关系。)


Or, of course, you can create getMethod1 and getMethod2 within your constructor using fat arrow functions, which get a lexical this binding:

或者,当然,您可以使用胖箭头函数在构造函数中创建getMethod1和getMethod2,这将获得词法绑定:

class Service {
  constructor(arg1) {
    this.anotherService= new AnotherService(arg1);
    this.getMethod1 = (start, end) => {
        return this.anotherService.get1(start, end);
    };
    this.getMethod2 = (start, end) => {
        return this.anotherService.get2(start, end);
    };
  }
} 

...in which case you don't have to change getTransaction1 and getTransaction2 at all.

...在这种情况下,您根本不必更改getTransaction1和getTransaction2。


Side note: Function declarations (what you're using with getTransaction1 and getTransaction2) aren't statements, and so they aren't terminated with semicolons.

附注:函数声明(与getTransaction1和getTransaction2一起使用的函数)不是语句,因此它们不以分号结尾。