TypeScript中的构造函数重载

有人在TypeScript中做过构造函数重载吗?在语言规范(v 0.8)的第64页，有描述构造函数重载的语句，但没有给出任何示例代码。

我现在正在尝试一个非常基本的类声明;它是这样的，

interface IBox {    
    x : number;
    y : number;
    height : number;
    width : number;
}

class Box {
    public x: number;
    public y: number;
    public height: number;
    public width: number;

    constructor(obj: IBox) {    
        this.x = obj.x;
        this.y = obj.y;
        this.height = obj.height;
        this.width = obj.width;
    }   

    constructor() {
        this.x = 0;
        this.y = 0;
        this.width = 0;
        this.height = 0;
    }
}

当运行tsc BoxSample。Ts，它抛出一个重复的构造函数定义——这是显而易见的。任何帮助都是感激的。

当前回答

在可选的类型参数足够好的情况下，考虑以下代码，它可以在不重复属性或定义接口的情况下实现相同的功能:

export class Track {
   public title: string;
   public artist: string;
   public lyrics: string;

   constructor(track?: Track) {
     Object.assign(this, track);
   }
}

请记住，这将分配所有传递到track的属性，即使它们没有在track上定义。

2016-11-06 00:22:21

其他回答

interface IBox {
    x: number;
    y: number;
    height: number;
    width: number;
}

class Box {
    public x: number;
    public y: number;
    public height: number;
    public width: number;

    constructor(obj: IBox) {
        const { x, y, height, width } = { x: 0, y: 0, height: 0, width: 0, ...obj }
        this.x = x;
        this.y = y;
        this.height = height;
        this.width = width;
    }
}

2016-11-30 05:11:40

注意，你也可以通过TypeScript中的默认参数来解决在实现级别上缺乏重载的问题，例如:

interface IBox {    
    x : number;
    y : number;
    height : number;
    width : number;
}

class Box {
    public x: number;
    public y: number;
    public height: number;
    public width: number;

    constructor(obj : IBox = {x:0,y:0, height:0, width:0}) {    
        this.x = obj.x;
        this.y = obj.y;
        this.height = obj.height;
        this.width = obj.width;
    }   
}

编辑: 截至2016年12月5日，请参阅本森的回答，以获得更灵活的更详细的解决方案。

2012-10-09 06:29:27

你应该记住……

contructor()

constructor(a:any, b:any, c:any)

它和new()或者new("a"，"b"，"c")一样

Thus

constructor(a?:any, b?:any, c?:any)

和上面一样，而且更灵活…

新()或新的(“a”)或(“a”、“b”)或新(“a”、“b”、“c”)

2018-06-02 14:15:35

正如chuckj所说，简单的答案是一个可选形参，但是如果我们想用多个形参重载构造函数，或者我们想改变形参顺序，该怎么办呢?

事实证明，构造函数可以像函数一样重载:

class FooBar {
  public foo?: number;
  public bar?: string;

  // Constructor A
  constructor(foo: number, bar?: string);
  // Constructor B
  constructor(bar: string, foo?: number);
  // Constructor C
  constructor(bar: string);
  // Constructor D
  constructor(foo: number);
  // Constructor E
  constructor();

  constructor(...args: any[]) {
    switch (args.length) {
      case 2:
        if (typeof args[0] === "number") {
          this.foo = args[0];
          this.bar = args[1];
        } else {
          this.bar = args[0];
          this.foo = args[1];
        }
        break;
      case 1:
        if (typeof args[0] === "number") {
          this.foo = args[0];
        } else {
          this.bar = args[0];
        }
    }

    console.log(this.foo, this.bar);
  }
}

const fooBarConstructorA = new FooBar("150", 25);
const fooBarConstructorB = new FooBar(25, "150");
const fooBarConstructorC = new FooBar("150");
const fooBarConstructorD = new FooBar("150");
const fooBarConstructorE = new FooBar();

2022-11-29 20:23:37

下面是一个工作示例，您必须考虑每个具有更多字段的构造函数都应该将额外的字段标记为可选。

class LocalError {
  message?: string;
  status?: string;
  details?: Map<string, string>;

  constructor(message: string);
  constructor(message?: string, status?: string);
  constructor(message?: string, status?: string, details?: Map<string, string>) {
    this.message = message;
    this.status = status;
    this.details = details;
  }
}

2020-03-04 08:41:45

TypeScript中的构造函数重载

推荐文章

最新文章

标签