TypeScript 4.9及以上版本如何实现深层类型交叉？

TypeScript 4.9及以上版本对交叉类型的合并逻辑做了调整，深层嵌套的交叉类型不再自动合并，导致你原来的写法失效。针对这个需求，有两种可行的解决方式：

1. 手动合并类型（简单场景首选） #

直接写出交叉后最终的类型结构，避免依赖TypeScript自动合并嵌套交叉：

type G = {
  props: {
    a: {
      foo: 1;
      bar: 2;
      qux: 3;
    };
  };
};

const g: G = {
  props: {
    a: { foo: 1, bar: 2, qux: 3 }
  }
};

2. 使用工具类型自动合并（复杂场景适用） #

如果需要动态合并多个嵌套类型，可以自定义一个DeepMerge工具类型，递归处理深层属性的交叉合并：

type DeepMerge<T, U> = 
  T extends object 
    ? U extends object
      ? {
          [K in keyof T | keyof U]: 
            K extends keyof T 
              ? K extends keyof U 
                ? DeepMerge<T[K], U[K]> 
                : T[K]
              : K extends keyof U 
                ? U[K] 
                : never;
        }
      : U
    : U;

// 用DeepMerge合并目标类型
type G = DeepMerge<
  { props: { a: { foo: 1 }} & { a: { bar: 2 }} },
  { props: { a: { qux: 3 }} }
>;

const g: G = {
  props: {
    a: { foo: 1, bar: 2, qux: 3 }
  }
};

这个DeepMerge类型会递归遍历对象的每个属性：若两个属性均为对象则继续深层合并，若仅一方存在该属性则直接保留对应类型，还原旧版本TypeScript的交叉合并行为。如果需要处理数组、可选属性等复杂场景，可以进一步扩展这个工具类型的逻辑。

内容的提问来源于stack exchange，提问作者Seph Reed