TypeScript如何访问promise方法中的字段[重复]

Question

我正在尝试访问 promise 方法中的字段。

代码如下：

// Import stylesheets
import './style.css';
export class User{
  
  firstName:string;
  lastName:string;
  constructor(){
    this.firstName = "Tom";
    this.lastName = "Jack";
    this.getName = this.getName.bind(this);
  } 
  getName():Promise<string>{
    return new Promise((resolve,reject) =>{
      return resolve(`My Name is ${this.firstName} ${this.lastName}`);
    }) ;
  }
}

export class UserApi{
  userName:string;
  getUserName():string{
    let user = new User();
    user.getName().then(name => {
      return name;
    });
    return '';
  }
  
}
// Write TypeScript code!
const appDiv: HTMLElement = document.getElementById('app');
appDiv.innerHTML = `<h1>TypeScript Starter</h1>`;
let user = new UserApi();
appDiv.append('This is ' + user.getUserName());

user.getUserName() 返回空。

如何从promise方法中得到期望的字符串？

也就是说，如何在 Promise 方法中访问this？

更新：

我对 Promise 的返回值没有问题，请注意如何从返回 Promise 的类方法中访问类属性或值。

Answer 1

您应该从 getUserName 方法返回一个承诺。像这样：

getUserName(){
    let user = new User();
    return user.getName().then(name => {
        return name;
    });
}

如果你只是要返回上面的名字，你不需要“then”：

return user.getName();

当您使用 getUserName 方法时，您需要处理 promise。像这样：

let user = new UserApi();
user.getUserName().then((name) => {
    appDiv.append('This is ' + name);
});