javascript - 使用装饰器将属性分配给非原型(prototype)

Question

我正在构建前端/后端数据结构之间的简单映射。为此，我创建了一个如下所示的装饰器:

function ApiField(
    apiKey: string,
    setFn: (any) => any = (ret) => ret,
    getFn: (any) => any = (ret) => ret
) {
    return function (target: AbstractModel, propertyKey: string) {
        target.apiFieldsBag = target.apiFieldsBag || {};
        _.assign(
            target.apiFieldsBag,
            {
                [propertyKey]: {
                    apiKey: apiKey,
                    setFn: setFn,
                    getFn: getFn
                }
            }
        );
    };
}

这就是我使用它的方式:

class AbstractCar {
    @ApiField('id')
    public id: string = undefined;
}

class BMW extends AbstractCar {
    @ApiField('cylinders')
    public cylinderCount: number;
}

class VW extends AbstractCar {
    @ApiField('yearCompanyFounded')
    public yearEstablished: number;
}

我看到的问题是，传递给装饰器的不是实际对象，而是始终是它的原型(prototype):

__decorate([
    ApiField('yearCompanyFounded')
], VW.prototype, "yearEstablished", void 0);

这意味着当我在装饰器中将东西分配给实例时，它总是附加到原型(prototype)，这反过来意味着我只想定义 VW 实例的属性也是可用的在 AbstractCar 和 BMW 类上(在本例中为 yearEstablished)。这使得不可能在两个不同的类中拥有两个名称相同但 API 字段不同的属性。

有什么办法可以避免这种行为吗？

Answer 1

现在，所有三个类都在向同一个对象添加属性。解决这个问题的关键是克隆 target.data 上的对象，这样每个类都使用不同的对象，而不是所有类都引用同一个对象。

下面是一个更简单的示例，演示了执行此操作的一种方法:

function ApiField(str: string) {
    return function (target: any, propertyKey: string) {
        // I tested with Object.assign, but it should work with _.assign the same way
        target.data = _.assign({}, target.data, {
            [propertyKey]: str
        });
    };
}

class AbstractCar {
    @ApiField("car")
    public carID;
}

class BMW extends AbstractCar {
    @ApiField("bmw")
    public bmwID;
}

class VW extends AbstractCar {
    @ApiField("vw")
    public vwID;
}

AbstractCar.prototype.data; // Object {carID: "car"}
BMW.prototype.data;         // Object {carID: "car", bmwID: "bmw"}
VW.prototype.data;          // Object {carID: "car", vwID: "vw"}