typescript - 如何在 TypeScript 中自定义属性

Question

如何让 TypeScript 发出属性定义，例如：

Object.defineProperties(this, {
    view: {
        value: view,
        enumerable: false,
        writable: false,
        configurable: false
    },
});

Answer 1

你可以在 TypeScript 中使用getand set，它编译成Object.defineProperties.

这是 ECMAScript 5 的一个特性，所以如果你的目标是 ES3（编译器的默认值），你就不能使用它。如果您乐于以 ES5 为目标，请添加--target ES5到您的命令中。

打字稿：

class MyClass {
    private view;
    get View() { return this.view; }
    set View(value) { this.view = value }
}

编译为：

var MyClass = (function () {
    function MyClass() { }
    Object.defineProperty(MyClass.prototype, "View", {
        get: function () {
            return this.view;
        },
        set: function (value) {
            this.view = value;
        },
        enumerable: true,
        configurable: true
    });
    return MyClass;
})();

但是，如果您想完全控制设置可枚举和可配置 - 您仍然可以使用原始Object.defineProperties代码。

Answer 2

当我偶然发现TypeScript Handbook: Decorators时，我正在寻找完全相同的东西。在“方法装饰器”段落中，他们定义@enumerable了装饰器工厂，看起来像这样（我只是从那里复制粘贴）：

function enumerable(value: boolean) {
    return function (target: any, propertyKey: string, descriptor: PropertyDescriptor) {
        descriptor.enumerable = value;
    };
}

他们像这样使用它：

class Greeter {
    greeting: string;
    constructor(message: string) {
        this.greeting = message;
    }

    @enumerable(false)
    greet() {
        return "Hello, " + this.greeting;
    }
}

所以解决它的另一种方法是使用装饰器。

PS： 此功能需要experimentalDecorators将标志传递给tsc或设置在tsconfig.json.

Answer 3

如果您希望像这样发出所有属性，则当前不支持此功能。我建议在CodePlex 网站上提交一个问题，详细说明您的用例和要求是什么。

如果你用 --target ES5 编译，你可以有这样的东西：

class n {
    get foo() { return 3; }
    bar() { return 5; }
}

产生此代码：

var n = (function () {
    function n() { }
    Object.defineProperty(n.prototype, "foo", {
        get: function () {
            return 3;
        },
        enumerable: true,
        configurable: true
    });
    n.prototype.bar = function () {
        return 5;
    };
    return n;
})();