如何在JavaScript ECMA6中重载构造函数？

Question

目的

实现一种机制,允许JavaScript ECMA6中的构造函数重载

为什么这不重复

主题为什么JavaScript ES6不支持多构造函数类？虽然类似的不一样.另一个主题仅关注使用旧 ECMAScript版本的构造函数重载,而本主题则侧重于ECMA6.如果您正在寻找更新的答案,那就是这个地方.

背景

我有一个带有给定构造函数的JavaScript类,我希望用户在实例化对象时能够拥有不同的构造函数.我假装的一个例子如下:

const DEFAULT_WHEEL_NUMBER = 4;
const DEFAULT_COLOR = "black";    
const DEFAULT_NAME = "myCar";

class Car{

    constructor(numberWheels, aName, aColor){
        this.wheelsNum = numberWheels;
        this.name = aName;
        this.color = aColor;
    }

    constructor(aName){
        this(DEFUALT_WHEEL_NUMBER, aName, DEFAULT_COLOR);
    }

    constructor(){
        this(DEFUALT_WHEEL_NUMBER, DEFAULT_NAME, DEFAULT_COLOR);
    }
}

在此代码中,用户有三个可以使用的构造函数,每个构造函数都使用不同数量的参数.一个用法示例如下:

var car1 = new Car(3, "tricicle-car", "white");
var car2 = new Car("Opel"); //creates black car with 4 wheels called Opel
var car3 = new Car(); //creates a black car, with 4 wheels called myCar

问题

如果使用Java或C#,这是一个简单的例子,因为这些语言具有构造函数重载.

但是,从MDN的类文档可以得出结论,JavaScript没有.

题

1. 有没有办法使用ECMA6为JavaScript类实现类似的机制？如果没有,最好/最接近的替代方案是什么？

Answer 1

你是对的(据我所知),这不是JavaScript类支持的功能.我在这里建议,因为你已经在使用ES6功能,而是使用默认参数:

class Car {
    constructor(numberWheels = 4, aName = "myCar", aColor = "black"){
        this.wheelsNum = numberWheels;
        this.name = aName;
        this.color = aColor;
    }
}

这显然伴随着一个警告,即您不能像在示例中那样使用不同的参数顺序进行"重载"(尽管在我看来,这是一件好事 - 一致的API可以更好地使用).

meskobalazs的答案也是一个不错的选择,特别是如果你有很多你希望你的对象可以选择的选项.通过像这样的函数params这样做可能会有点混乱!

Answer 2

在JavaScript中没有内置的解决方案.另一种解决方案是使用arguments对象(在某些情况下),或者传递自己的配置选项,类似于:

const defaults = {
    numberWheels: 4,
    color: "black",   
    name: "myCar"
}

class Car {
    constructor(options) {
         this.wheelsNum = options.numberWheels || defaults.numberWheels;
         this.name = options.name || defaults.name;
         this.color = options.color || defaults.color;
    }
}

这基本上是旧学校的解决方案,我在ES3中使用相同的逻辑.