如果在参数前面加上@，CoffeeScript会自动将参数设置为构造函数中的实例属性。
在ES6中有没有什么技巧可以完成同样的工作？
答案 0 :(得分：22)
Felix Kling's comment概述了您最接近一个整洁的解决方案。它使用两个ES6功能 - Object.assign和object literal property value shorthand。
以下是tree和pot作为实例属性的示例：
class ChristmasTree {
constructor(tree, pot, tinsel, topper) {
Object.assign(this, { tree, pot });
this.decorate(tinsel, topper);
}
decorate(tinsel, topper) {
// Make it fabulous!
}
}
当然，这不是你想要的;一方面，你仍然需要重复参数名称。我开始编写一个可能更接近的辅助方法......
Object.autoAssign = function(fn, args) {
// Match language expressions.
const COMMENT = /\/\/.*$|\/\*[\s\S]*?\*\//mg;
const ARGUMENT = /([^\s,]+)/g;
// Extract constructor arguments.
const dfn = fn.constructor.toString().replace(COMMENT, '');
const argList = dfn.slice(dfn.indexOf('(') + 1, dfn.indexOf(')'));
const names = argList.match(ARGUMENT) || [];
const toAssign = names.reduce((assigned, name, i) => {
let val = args[i];
// Rest arguments.
if (name.indexOf('...') === 0) {
name = name.slice(3);
val = Array.from(args).slice(i);
}
if (name.indexOf('_') === 0) { assigned[name.slice(1)] = val; }
return assigned;
}, {});
if (Object.keys(toAssign).length > 0) { Object.assign(fn, toAssign); }
};
这会将名称以下划线为前缀的所有参数自动分配给实例属性：
constructor(_tree, _pot, tinsel, topper) {
// Equivalent to: Object.assign({ tree: _tree, pot: _pot });
Object.autoAssign(this, arguments);
// ...
}
它支持rest参数，但我省略了对默认参数的支持。它们的多功能性，再加上JS＆＃39;贫乏的正则表达式使得很难支持它们的一小部分。
就个人而言，我不会这样做。如果有一种本地方式来反映函数的形式参数，那么这将非常简单。事实上，这是一团糟，并没有让我觉得比Object.assign显着改善。
答案 1 :(得分：6)
我已经扩展了Function原型，以便为所有构造函数提供对参数自动采用的访问权限。我知道我们应该避免向全局对象添加功能，但是如果你知道你正在做什么，就可以。
所以这里是adoptArguments函数：
var comments = /((\/\/.*$)|(\/\*[\s\S]*?\*\/))/g;
var parser = /^function[^\(]*\(([^)]*)\)/i;
var splitter = /\s*,\s*/i;
Function.prototype.adoptArguments = function(context, values) {
/// <summary>Injects calling constructor function parameters as constructed object instance members with the same name.</summary>
/// <param name="context" type="Object" optional="false">The context object (this) in which the the calling function is running.</param>
/// <param name="values" type="Array" optional="false">Argument values that will be assigned to injected members (usually just provide "arguments" array like object).</param>
"use strict";
// only execute this function if caller is used as a constructor
if (!(context instanceof this))
{
return;
}
var args;
// parse parameters
args = this.toString()
.replace(comments, "") // remove comments
.match(parser)[1].trim(); // get comma separated string
// empty string => no arguments to inject
if (!args) return;
// get individual argument names
args = args.split(splitter);
// adopt prefixed ones as object instance members
for(var i = 0, len = args.length; i < len; ++i)
{
context[args[i]] = values[i];
}
};
采用所有构造函数调用参数的结果调用现在如下：
function Person(firstName, lastName, address) {
// doesn't get simpler than this
Person.adoptArguments(this, arguments);
}
var p1 = new Person("John", "Doe");
p1.firstName; // "John"
p1.lastName; // "Doe"
p1.address; // undefined
var p2 = new Person("Jane", "Doe", "Nowhere");
p2.firstName; // "Jane"
p2.lastName; // "Doe"
p2.address; // "Nowhere"
我的上层解决方案采用所有函数参数作为实例化对象成员。但是，正如您指的是CoffeeScript，您试图采用刚刚选择的参数，而不是全部。在以@开头的Javascript标识符中为illegal by specification。但是，您可以在其前面添加$或_之类的其他内容，这在您的情况下可能是可行的。所以你现在需要做的就是检测这个特定的命名约定，只添加那些通过这个检查的参数：
var comments = /((\/\/.*$)|(\/\*[\s\S]*?\*\/))/g;
var parser = /^function[^\(]*\(([^)]*)\)/i;
var splitter = /\s*,\s*/i;
Function.prototype.adoptArguments = function(context, values) {
/// <summary>Injects calling constructor function parameters as constructed object instance members with the same name.</summary>
/// <param name="context" type="Object" optional="false">The context object (this) in which the the calling function is running.</param>
/// <param name="values" type="Array" optional="false">Argument values that will be assigned to injected members (usually just provide "arguments" array like object).</param>
"use strict";
// only execute this function if caller is used as a constructor
if (!(context instanceof this))
{
return;
}
var args;
// parse parameters
args = this.toString()
.replace(comments, "") // remove comments
.match(parser)[1].trim(); // get comma separated string
// empty string => no arguments to inject
if (!args) return;
// get individual argument names
args = args.split(splitter);
// adopt prefixed ones as object instance members
for(var i = 0, len = args.length; i < len; ++i)
{
if (args[i].charAt(0) === "$")
{
context[args[i].substr(1)] = values[i];
}
}
};
完成。也可以在严格模式下工作。现在，您可以定义前缀构造函数参数，并将它们作为实例化对象成员进行访问。
实际上我已经编写了一个功能更强大的版本，带有以下签名，暗示了它的附加功能，适合我在我创建控制器/服务/等的AngularJS应用程序中的场景。构造函数并向其添加其他原型函数。由于构造函数中的参数是由AngularJS注入的，我需要在所有控制器函数中访问这些值，我只需通过this.injections.xxx访问它们。使用此功能比使用多个额外的线更简单，因为可能有许多注射。甚至没有提到注射的变化。我只需要调整构造函数参数，然后立即在this.injections内传播它们。
反正。承诺签名（不包括实施）。
Function.prototype.injectArguments = function injectArguments(context, values, exclude, nestUnder, stripPrefix) {
/// <summary>Injects calling constructor function parameters into constructed object instance as members with same name.</summary>
/// <param name="context" type="Object" optional="false">The context object (this) in which the calling constructor is running.</param>
/// <param name="values" type="Array" optional="false">Argument values that will be assigned to injected members (usually just provide "arguments" array like object).</param>
/// <param name="exclude" type="String" optional="true">Comma separated list of parameter names to exclude from injection.</param>
/// <param name="nestUnder" type="String" optional="true">Define whether injected parameters should be nested under a specific member (gets replaced if exists).</param>
/// <param name="stripPrefix" type="Bool" optional="true">Set to true to strip "$" and "_" parameter name prefix when injecting members.</param>
/// <field type="Object" name="defaults" static="true">Defines injectArguments defaults for optional parameters. These defaults can be overridden.</field>
{
...
}
Function.prototype.injectArguments.defaults = {
/// <field type="String" name="exclude">Comma separated list of parameter names that should be excluded from injection (default "scope, $scope").</field>
exclude: "scope, $scope",
/// <field type="String" name="nestUnder">Member name that will be created and all injections will be nested within (default "injections").</field>
nestUnder: "injections",
/// <field type="Bool" name="stripPrefix">Defines whether parameter names prefixed with "$" or "_" should be stripped of this prefix (default <c>true</c>).</field>
stripPrefix: true
};
我排除了$scope参数注入，因为与服务/提供商等相比，它应该只是数据而没有行为。在我的控制器中，我总是将$scope分配给this.model成员，即使我不会＆＃ 39; t甚至必须在视图中自动访问$scope。
答案 2 :(得分：5)
对于那些偶然发现Angular 1.x解决方案的人来说
以下是它的工作原理：
class Foo {
constructor(injectOn, bar) {
injectOn(this);
console.log(this.bar === bar); // true
}
}
以下是关注注入服务的内容：
.service('injectOn', ($injector) => {
return (thisArg) => {
if(!thisArg.constructor) {
throw new Error('Constructor method not found.');
}
$injector.annotate(thisArg.constructor).map(name => {
if(name !== 'injectOn' && name !== '$scope') {
thisArg[name] = $injector.get(name);
}
});
};
});
<强> Fiddle link
修改
由于$scope不是服务，因此我们无法使用$injector来检索它。据我所知，如果不重新实例化一个类，就无法检索它。因此，如果您在constructor方法之外注入并需要它，则需要手动将其分配给班级的this。
答案 3 :(得分：2)
ES6或任何当前的ECMAScript规范中没有此类功能。任何涉及构造函数参数解析的解决方法都不可靠。
功能参数名称应在生产中尽量减少：
class Foo {
constructor(bar) {}
}
成为
class o{constructor(o){}}
参数名称丢失，不能用作属性名称。这将可能的使用范围限制为不使用最小化的环境，主要是服务器端JavaScript（Node.js）。
已编译类参数中的参数可能与本机类不同，例如Babel transpiles
class Foo {
constructor(a, b = 1, c) {}
}
到
var Foo = function Foo(a) {
var b = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
var c = arguments[2];
_classCallCheck(this, Foo);
};
具有默认值的参数从参数列表中排除。本地Foo.length为1，但是Babel使Foo签名无法解析以获取b和c的名称。
这是一种变通办法，适用于本机ES6类，但不适用于涉及参数解析的转译类。显然，它在缩小的应用程序中也不起作用，这使其成为主要的Node.js解决方案。
class Base {
constructor(...args) {
// only for reference; may require JS parser for all syntax variations
const paramNames = new.target.toString()
.match(/constructor\s*\(([\s\S]*?)\)/)[1]
.split(',')
.map(param => param.match(/\s*([_a-z][_a-z0-9]*)/i))
.map(paramMatch => paramMatch && paramMatch[1]);
paramNames.forEach((paramName, i) => {
if (paramName)
this[paramName] = args[i];
});
}
}
class Foo extends Base {
constructor(a, b) {
super(...arguments);
// this.b === 2
}
}
new Foo(1, 2).b === 2;
可以使用使用类mixin的装饰器函数形式将其重写：
const paramPropsApplied = Symbol();
function paramProps(target) {
return class extends target {
constructor(...args) {
if (this[paramPropsApplied]) return;
this[paramPropsApplied] = true;
// the rest is same as Base
}
}
}
并在ES.next中用作装饰器：
@paramProps
class Foo {
constructor(a, b) {
// no need to call super()
// but the difference is that
// this.b is undefined yet in constructor
}
}
new Foo(1, 2).b === 2;
或作为ES6中的辅助功能：
const Foo = paramProps(class Foo {
constructor(a, b) {}
});
已编译的或函数类可以使用第三方解决方案，例如fn-args来解析函数参数。它们可能会遇到默认参数值之类的陷阱，或者因复杂语法（如参数解构）而失败。
参数名称解析的一种适当替代方法是注释类属性以进行分配。这可能涉及基类：
class Base {
constructor(...args) {
// only for reference; may require JS parser for all syntax variations
const paramNames = new.target.params || [];
paramNames.forEach((paramName, i) => {
if (paramName)
this[paramName] = args[i];
});
}
}
class Foo extends Base {
static get params() {
return ['a', 'b'];
}
// or in ES.next,
// static params = ['a', 'b'];
// can be omitted if empty
constructor() {
super(...arguments);
}
}
new Foo(1, 2).b === 2;
同样，可以用装饰器代替基类。 used in AngularJS to annotate functions for dependency injection的配方与缩小方法兼容。由于应该使用$inject来标注AngularJS构造函数，因此解决方案can be seamlessly applied to them就是这样。
CoffeeScript @可以用constructor parameter properties在TypeScript中实现：
class Foo {
constructor(a, public b) {}
}
哪个是ES6的语法糖：
class Foo {
constructor(a, b) {
this.b = b;
}
}
由于此转换是在编译时执行的，因此缩小不会对其产生负面影响。