打字稿 – 铸造不铸造

2023年11月23日 225次阅读

我做了一个简单的Http调用：

http.get('/test/data/user.json').
    map(res => <User> res.json()).
    subscribe(user => {
        console.log(typeof user);
        console.log(user);
        console.log(user.getName());
});

使用user.json中的以下数据：

{
    "name":"Robert"
}

和以下User类：

export class User{
    name:string;
    lastName:string;
    getName():string{
        return this.name;
    }
}

问题是我在控制台中得到的结果：

console.log(typeof user);

object

console.log(user);

Object {name: “Robert”}

console.log(user.getName());

Uncaught TypeError: user.getName is not a function

问题

这里的问题是我的对象是一个对象,而不是一个用户,因此它没有所有属性,也没有方法.

还尝试使用基于Promise的调用和user.json()作为User而不是< User> res.json()

编辑：与转换为接口类似,因为接口没有自己的行为.

最佳答案 如果要使用getName方法,则需要在映射响应主体时实例化新的User对象：

http.get('/test/data/user.json').
  map(res => {
    let body = res.json();
    return new User(body.name, body.lastName);
  })
  subscribe(user => {
    console.log(typeof user);
    console.log(user);
    console.log(user.getName());
  });

User类将按如下方式进行调整：

export class User{
  constructor(private name:string, private lastName:string) {}

  getName():string{
    return this.name;
  }
}

转换对象不会向现有对象添加方法.响应的json方法将使用JSON.parse简单地解析响应主体并返回原始对象.

看到这个plunkr：https://plnkr.co/edit/7lKHvArpayrMAzm5Xgk1?p=preview.

点赞