javascript - 如何将javascript类构造函数参数动态映射到实例属性

Question

我正在构建一个 Node.js 应用程序(Node v10.11.0)，并希望在不使用 Typescript 的情况下以 OOP 方式进行。所以我建立了一些这样的类:

class Component {
  constructor(param1, param2, param3) {
    this.param1= param1;
    this.param2 = param2;
    this.param3 = param3;
  }
}

我想知道javascript中是否有一种方法可以自动映射构造函数的参数而无需编写this.param1 = param1对于每个构造函数参数。

我已经尝试过运行 arguments像这样的对象:

constructor(param1, param2, param3) {
  Array.from(arguments).forEach(arg => {
    this[arg] = arg;
  }
}

但这不起作用。这种方法的结果是:

console.log(new Component("arg1", "arg3", "arg3"))

// Component { arg1: "arg1", arg2: "arg2", arg3: "arg3" }
// I want to have this:
// Component { param1: "arg1", param2: "arg2", param3: "arg3" }

Answer 1

如果您希望构造函数接受离散参数，没有什么比您已经在做的单独分配更好的了，至少现在是这样。

您可以让构造函数接受一个对象，这样您就可以这样做:

constructor(args) {
    Object.assign(this, args);
}

你这样称呼它:

new Component({param1: "arg1", param2: "arg2", param3: "arg3"});

但是如果它只是一到三个参数，那就是在每个调用站点而不是在构造函数代码中创建额外的工作，并且构造函数代码不太清楚。

第三种选择是接受一个休息参数:

constructor(...args) {
    ["param1", "param2", "param3"].forEach((name, index) => {
        this[name] = args[index];
    });
}

您以正常方式调用它，但是虽然它是主观的，但对我来说可读性受到损害。

顺便说一句，我想你可能知道，TypeScript 有这个功能。现在使用 TypeScript(它编译成 JavaScript 以在浏览器上使用)越来越普遍。 TypeScript 不依赖于 Angular，您可以将它与几乎任何框架(或没有)一起使用。

例如，在 TypeScript 中:

// TypeScript
class Component {
    constructor(
        public param1: string,
        public param2: string,
        public param3: string
    ) {
    }
}

构造函数中根本不需要代码，TypeScript 会自动将这些参数值分配给这些公共(public)属性。 (您也可以使用 private 或 protected 。)