typescript - 如何实现这样的泛型？

Question

我想实现一个泛型，如下图

// define
class Zoom {
  values = {}
  addAnimal(animal = {}) {
    this.values[animal.name]= animal.total
  }
}

// use
const zoom = new Zoom()
zoom.addAnimal({ name: 'tiger', total: 10 })

// hint ====>>>
zoom.values.tiger

谢谢你提供的所有帮助！！！

标签： typescripttypescript-generics

Answer 1

请注意，TypeScript 不跟踪突变。见我的文章。

如果要推断values属性，则应从addAnimal方法中返回此属性。

考虑下一个例子：

type Animal = {
  name: string,
  total: number
}
// define
class Zoom {
  values: Record<string, number> = {}
  addAnimal<
    Name extends string,
    Total extends number,
    Animal extends { name: Name, total: Total }
  >(animal: Animal): this['values'] & Record<Animal['name'], Animal['total']>
  addAnimal(animal: Animal) {
    this.values[animal.name] = animal.total
    return this.values
  }
}

// use
const zoom = new Zoom()
const tigerLiteral = zoom.addAnimal({ name: 'tiger', total: 10 })

tigerLiteral.tiger // 10

// hint ====>>>
const tiger = zoom.values.tiger // number

操场

在这里，在我的博客中，您可以找到更多关于如何从函数参数推断文字类型的信息。TL；DR 您应该为要推断的每个值添加通用参数

更新

type Animal = {
  name: string,
  total: number
}
// define
class Zoom {
  values: Record<string, number> = {}
  addAnimal<
    Name extends string,
    Total extends number,
    Animal extends { name: Name, total: Total },
    >(animal: Animal): this & { values: Record<Animal['name'], Animal['total']> }
  addAnimal(animal: Animal) {
    this.values[animal.name] = animal.total
    return this
  }
}

// use
const zoom = new Zoom()
zoom
  .addAnimal({ name: 'tiger', total: 10 })
  .addAnimal({ name: 'cat', total: 2 })
  .values

操场

就像我说的，TS 不跟踪突变，因此你需要this从那里返回addAnimal以获得一些提示