如何在 JavaScript ECMA6 中重载构造函数?
How to overload constructors in JavaScript ECMA6?
Objective
在 JavaScript ECMA6
中实施允许构造函数重载的机制
为什么这不是重复的
题目,虽然相似,但和这个不一样。另一个主题仅关注使用 old ECMAScript 版本的构造函数重载,而本主题关注 ECMA6。如果您正在寻找更新的答案,那就是这里。
背景
我有一个带有给定构造函数的 JavaScript class,我希望用户在实例化一个对象时能够有不同的构造函数。我假装的一个例子如下:
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#,这是一个简单的示例,因为这些语言具有构造函数重载。
但是,从 documentation on classes from MDN 可以得出结论,Java脚本没有。
问题
- 有没有办法为使用 ECMA6 的 JavaScript classes 实现类似的机制?如果不是,best/closest 替代方案是什么?
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 中使用相同的逻辑。
您是对的(据我所知)这不是 JavaScript 类 功能支持。由于您已经在使用 ES6 功能,我在这里的建议是使用 default parameters 代替:
class Car {
constructor(numberWheels = 4, aName = "myCar", aColor = "black"){
this.wheelsNum = numberWheels;
this.name = aName;
this.color = aColor;
}
}
这显然伴随着一个警告,即您不能像示例中那样使用不同的参数顺序 'overloads'(尽管在我看来,这是一件好事 - 一致的 API更好用)。
meskobalazs 的回答也是一个不错的选择,尤其是当您有很多选项希望您的对象接受时。通过像这样的函数参数执行此操作可能会有点混乱!
Objective
在 JavaScript ECMA6
中实施允许构造函数重载的机制为什么这不是重复的
题目
背景
我有一个带有给定构造函数的 JavaScript class,我希望用户在实例化一个对象时能够有不同的构造函数。我假装的一个例子如下:
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#,这是一个简单的示例,因为这些语言具有构造函数重载。
但是,从 documentation on classes from MDN 可以得出结论,Java脚本没有。
问题
- 有没有办法为使用 ECMA6 的 JavaScript classes 实现类似的机制?如果不是,best/closest 替代方案是什么?
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 中使用相同的逻辑。
您是对的(据我所知)这不是 JavaScript 类 功能支持。由于您已经在使用 ES6 功能,我在这里的建议是使用 default parameters 代替:
class Car {
constructor(numberWheels = 4, aName = "myCar", aColor = "black"){
this.wheelsNum = numberWheels;
this.name = aName;
this.color = aColor;
}
}
这显然伴随着一个警告,即您不能像示例中那样使用不同的参数顺序 'overloads'(尽管在我看来,这是一件好事 - 一致的 API更好用)。
meskobalazs 的回答也是一个不错的选择,尤其是当您有很多选项希望您的对象接受时。通过像这样的函数参数执行此操作可能会有点混乱!