打字稿 - 为类成员设置默认值

Question

我有一个简单的模型：

export class Profile extends ServerData {
  name: string;
  email: string;
  age: number;
}

当我调用服务器（Angular 4，$http）时，我经常得到以下响应：

{
  name: string;
  email: string;
}

缺少age属性。

有什么方法可以使用我的模型并创建默认年龄以防它丢失？ 如果可能，我宁愿不必创建 2 个单独的模型。

我不想将年龄创建为可选属性 - 我需要它，即使它只是具有不正确的默认值。

更新：

这是我对服务器的调用：

结果-manager.component.ts：

this.resultsManagerService.getResults(this.config.request.action, this.pagingAndSorting, this.args).subscribe(
  results => {
    this.results = this.results.concat(results as Profile[]);

结果-manager.service.ts：

getResults(action: string, pagingAndSorting: PagingAndSorting, args: string[]): Observable<Profile[]> {
return this.apiService.callServer(
  pagingAndSorting,
  action,
  ...args );

}

请求有效并且我收到了响应，但是即使我定义了默认值（如@msanford 的回答所建议的那样），当我在组件中收到响应时，它们也会被删除。 同样，如果我向模型添加构造函数（根据 Mike Tung 的回答）。

后端响应似乎完全覆盖了模型 - 而不仅仅是分配值。

我怎样才能让它只将值分配给模型而不删除它没有返回的值？

Answer 1

是的，很容易，而且您不需要添加类构造函数。

export class Profile extends ServerData {
  name: string;
  email: string;
  age: number = 0;
}

定义默认值的能力是区class和interface的主要因素之一。

为此，您需要在代码中的某处调用new Profile() ，否则将不会创建类实例并且您不会设置默认值，因为上述 TypeScript 将编译为以下 JavaScript：

var Profile = /** @class */ (function () {
    function Profile() {
        this.age = 0;
    }
    return Profile;
}());

因此，仅在编译时将其用于类型断言不足以在运行时设置默认值。

在TypeScript Playground 中查看它的运行情况。

Answer 2

您看到覆盖属性的原因是 TypeScript 中的类型擦除。 TypeScript 不知道在运行时将什么类型的对象分配给它的变量。 如果您不是来自 java/c# 背景，这对您来说似乎有些奇怪。

因为最终，它只是 JavaScript。 并且 JavaScript 不强制执行严格的类型检查。

为了确保您的个人资料对象始终具有年龄属性，您可以创建自己的对象，然后复制从响应中获得的值。 当涉及到域对象映射的有线格式时，这是通常的方法。

为此，首先创建您的域模型，在本例中为具有默认年龄属性的 Profile 类。

 export class Profile {
        constructor(
            public name: string,
            public email: string,
            public age: number = 0) { }
    }

然后将您的响应映​​射到域模型。

this.resultsManagerService.getResults(this.config.request.action, this.pagingAndSorting, this.args).subscribe(
  results => {
    let res = (results as Profile[]).map((profile) => new Profile(profile.name, profile.email, profile.age));
    this.results = this.results.concat(res);
 });

Answer 3

您不能完全自动执行此操作，但您可以为函数（可能是类构造函数）设置默认值：

function makeProfile({ name = '', email = '', age = 0 }) {
  const person = new Profile;
  person.name = name;
  person.email = email;
  person.age = age;
  return person;
}

现在，如果您调用makePerson({ name: 'name', email: 'email' })它将返回一个age = 0的Person 。

Answer 4

除了使用构造函数之外，您不需要做太多事情。

export class Profile extends ServerData {
  name: string;
  email: string;
  age: number;

  constructor(name: string = '', email: string = '', age: number = null) {
    this.name = name;
    this.email = email;
    this.age = age;
  }
}

这将为您缺少的东西创建默认参数。

Answer 5

export class Cell {
    constructor(
        public name: string = "",
        public rowspan: number = 1,
        public colspan: number = 1
    ){ }
}

export class Table {
    public c1 = new Cell()
    public c2 = new Cell()
    public c3 = new Cell()
    
}