25

客观的

在 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 类实现类似的机制？如果不是，最好/最接近的选择是什么？
4

2 回答 2

19

你是对的（据我所知）这不是 JavaScript 类支持的功能。我在这里的建议是，因为您已经在使用 ES6 功能，所以改为使用默认参数：

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

这显然伴随着警告，您不能像在示例中那样使用不同的参数顺序进行“重载”（尽管在我看来，这是一件好事 - 使用一致的 API 会更好）。

meskobalazs 的答案也是一个不错的选择，特别是如果您有很多选项希望您的对象接受。通过这样的函数参数这样做可能会有点混乱！

于 2016-07-07T08:30:49.850 回答
18

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 中使用相同的逻辑。

于 2016-07-07T08:30:24.473 回答