TS深入浅出系列 - 泛型

除了水啥都不能包包装厂

除了水啥都不能包包装厂 - 老包

老包是 浙江省除了水啥都不能包包装厂 厂长，刚开业就接到了 浙江省大自然搬运工工厂 的大单子，需求是帮他们包装新生产的产品 搬运工水。合同一签，拿到搬运工水 工厂就忙活起来了。 很快流水线投产的样品就出来了，甲方很满意。老包的厂子算是活下来了，

// 搬运工水
interface NFWater {
  name: 'nfwater'
  /**
   * 重量
   **/
  weight: number
  /**
   * 材料
   **/
  material: 'water'
  origin: '中国浙江'
}

// 除了水啥都不能包包装厂
interface Wrapper {
  data: NFWater
  price: string
  phone: string
  name: string
  /**
   * 皮肤
   **/
  skin: string
  /**
   * 标语
   **/
  slogan: string
}
// 流水线

const nfsq: Wrapper = {
  data: {
    name: 'nfwater',
    weight: 500,
    material: 'water',
    origin: '中国浙江'
  },
  price: '建议零售价2.00',
  phone: '900 900 9900',
  name: '搬运工水',
  skin: '喜庆红',
  slogan: '我们不生产水，我们只是大自然的搬运工'
}

除了水啥都能包包装厂

除了水啥都能包包装厂 - 老包

做大做强之后，和业界各个工厂联系起来了，什么金拱门、开封菜，老包对自己的工厂只能包装水很不满与，于是决定改换门庭，成立了 浙江省除了水啥都能包包装厂 为了解决当前只能包装 搬运工水 ，老包决定新开两个生产线，以帮助业界朋友包装商品。

1. 金拱门生产线

// 金拱门套餐
interface JGM {
  name: 'jgm'
  /**
   * 重量
   **/
  weight: number
  /**
   * 材料
   **/
  material: 'xxx'
}
interface JGMWrapper {
  data: JGM
  price: string
  phone: string
  name: string
  /**
   * 皮肤
   **/
  skin: string
  /**
   * 标语
   **/
  slogan: string
}
const jgm: JGMWrapper = {
  data: {
    name: 'jgm',
    weight: 500,
    material: 'xxx',
  },
  price: '建议零售价19.99',
  phone: '900 900 9901',
  name: '金拱门套餐',
  skin: '金拱门定制红',
  slogan: '套餐只吃金拱门'
}

2. 开封菜生产线

// 开封菜套餐
interface KFC {
  name: 'kfc'
  /**
   * 重量
   **/
  weight: number
  /**
   * 材料
   **/
  material: 'xxx'
}
interface KFCWrapper {
  data: KFC
  price: string
  phone: string
  name: string
  /**
   * 皮肤
   **/
  skin: string
  /**
   * 标语
   **/
  slogan: string
}
const kfc: KFCWrapper = {
  data: {
    name: 'kfc',
    weight: 500,
    material: 'xxx',
  },
  price: '建议零售价19.98',
  phone: '900 900 9902',
  name: '开封菜套餐',
  skin: '开封菜定制红',
  slogan: '套餐只吃开封菜'
}

扩大生产线之后，虽然需要的人多起来了，但能接的业务更多了，工厂也蒸蒸日上。

任意包包装厂

四次元口袋，包啥都快！- 小包

老包的儿子小包是名牌大学毕业，回家继承父业，一到工厂就对工厂的生产线大刀阔斧的改革：说什么深化改革、工业制造4.0、智能化生产线。成立了 任意包包装厂，对外口号是 四次元口袋，包啥都快！对生产线进行了一系列改造：

设想中的智能化生产线（泛型）

// 引入泛型
interface SuperWrapper<T> {
  data: T
  price: string
  phone: string
  name: string
  /**
   * 皮肤
   **/
  skin: string
  /**
   * 标语
   **/
  slogan: string
}

const kfc: SuperWrapper<KFC> = ...
const jgm: SuperWrapper<JGM> = ...
const nfsq: SuperWrapper<NFWater> = ...
const any: SuperWrapper<any> = ...
...

受限于工厂工人储备、研发资金等问题，任意包包装厂 当前只能对水产品做定制化包装。 小包设定了5年计划、15年远景目标，展望到未来50年：

1. 5年内基本实现水的任意包
2. 15年内基本实现水周边产品的任意包
3. 展望未来50年真正实现任意包

实际可实现的生产线（泛型约束）

// 结合引入泛型约束
interface Water {
  ...
}
interface NFWater extends Water {
  ...
}
interface WHHWater extends Water {
  ...
}
interface WaterWrapper<T extends Water> {
  data: T
  price: string
  phone: string
  name: string
  /**
   * 皮肤
   **/
  skin: string
  /**
   * 标语
   **/
  slogan: string
}

const nfsq: WaterWrapper<NFWater> = ...
const whh: WaterWrapper<WHHWater> = ...
...

总结

1. 除了水啥都不能包包装厂 -> 包装 搬运工水
2. 做大做强 -> 除了水啥都能包包装厂 为了支持业务盲目新增生产线
3. 任意包包装厂 工业制造4.0、智能化生产线
4. 引入泛型、泛型约束、设定计划 逐步由水任意包包装厂 -> 任意包包装厂