类实现含同名不同返回类型方法的多接口时的冲突解决方法

当类需要同时实现两个包含同名但返回类型不同方法的接口时，比如你提供的示例中接口A的myFunction返回void、接口B的myFunction返回string，直接编写两个同名方法会触发语法冲突。以下是几种可行的解决和规避方案：

方案一：显式实现冲突接口的方法 #

通过接口名限定的方式实现其中一个接口的方法，TypeScript会识别这种显式实现的关联：

interface A {
  myFunction: () => void;
}

interface B {
  myFunction: () => string;
}

class C implements A, B {
  // 实现B的myFunction作为类的公共方法
  myFunction(): string {
    return 'asd';
  }

  // 显式实现A的myFunction，方法名格式为[接口名][方法名]
  AmyFunction(): void {
    console.log('asd');
  }
}

// 调用示例
const cInstance = new C();
cInstance.myFunction(); // 调用B的版本，返回字符串"asd"
(cInstance as A).myFunction(); // 断言为A类型后，调用A的版本，执行console.log

这种方式保留了类对两个接口的实现能力，通过类型断言可以触发对应接口的方法逻辑。

方案二：拆分职责，通过组合避免冲突 #

遵循单一职责原则，将两个接口的实现拆分到独立类中，再通过组合的方式在C类中提供调用入口：

interface A {
  myFunction: () => void;
}

interface B {
  myFunction: () => string;
}

class AImpl implements A {
  myFunction(): void {
    console.log('asd');
  }
}

class BImpl implements B {
  myFunction(): string {
    return 'asd';
  }
}

class C {
  private aHandler = new AImpl();
  private bHandler = new BImpl();

  // 封装A接口方法的调用
  callAMyFunction(): void {
    this.aHandler.myFunction();
  }

  // 封装B接口方法的调用
  callBMyFunction(): string {
    return this.bHandler.myFunction();
  }
}

// 调用示例
const cInstance = new C();
cInstance.callAMyFunction(); // 执行console.log
cInstance.callBMyFunction(); // 返回字符串"asd"

这种方式让代码职责更清晰，避免了单个类承担冲突的接口实现逻辑。

方案三：调整接口设计，从根源消除冲突 #

如果接口属于你可控的范围，直接修改接口中的方法名，通过命名区分不同的方法：

interface A {
  myVoidFunction: () => void;
}

interface B {
  myStringFunction: () => string;
}

class C implements A, B {
  myVoidFunction(): void {
    console.log('asd');
  }

  myStringFunction(): string {
    return 'asd';
  }
}

// 调用示例
const cInstance = new C();
cInstance.myVoidFunction();
cInstance.myStringFunction();

这是最直观的解决方式，代码可读性更强，后续维护成本更低。

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