Question

我第一次写这段代码并且没有用，它给了我错误http没有定义。

importFile(fileId: string, fileName: string): void {
    this.fileService.importFileById(fileId, fileName, this.refreshFiles);
}

第二次我写了这段代码并且确实有效，但我不明白有什么区别。

importFile(fileId: string, fileName: string): void {
    this.fileService.importFileById(fileId, fileName, () => {
        this.refreshFiles();
    });
}

refreshFiles（）的代码是这样的：

refreshFiles(): void {
    this.http.get('api/Files/GetFiles').subscribe(result => {
        //etc
    }, error => console.error(error));
}

这两段代码有什么区别？为什么第一个代码不起作用，第二个代码工作？

Answer 1

this.refreshFiles和this.refreshFiles()之间的区别在于第一个返回对没有上下文的函数的引用（当您调用此函数时需要提供this）而第二个直接调用函数并隐式提供this。

您可以做什么：您可以使用this.refreshFiles.bind(this)显式设置this.refreshFiles返回的函数的上下文并按原样传递。

this.fileService.importFileById(fileId, fileName, this.refreshFiles.bind(this));

您在工作示例中使用的箭头函数与bind非常相似（事实上，箭头函数是bind的语法糖。）

另一个例子：

const test = {
  run() {
    console.log(typeof this.run)
  }
}

console.log(test.run()) // function, because we call it as test.run() and provide test as `this`

let testrun = test.run;

console.log(testrun()) // undefined, because testrun has no `this`

testrun = test.run.bind(test);

console.log(testrun()) // function, because testrun has a bound `this`

TypeScript中这两个方法调用有什么区别？

1 个答案: