静态属性创建优化

TypeScript - static property creation optimization

本文关键字:优化 创建 属性 静态      更新时间:2023-09-26

我是JavaScript新手,因为我来自强类型语言,所以我选择了TypeScript。

我想知道在这段代码中Red getter中的变量red发生了什么。它会在每次调用时重新创建(如Green getter)还是创建一次并每次使用?哪个是最好的?

class Color {
    public R: number;
    public G: number;
    public B: number;
    public A: number;
    static get Red(): Color {
        var red = new Color(255, 0, 0);
        Color.Red = function() { return red; }
        return red;
    }
    static get Green(): Color {
        return new Color(0, 255, 0);
    }
    constructor(red: number, green: number, blue: number, alpha: number = 255) {
        this.R = red;
        this.G = green;
        this.B = blue;
        this.A = alpha;
    }
}

其他答案完全正确,但我认为他们没有提到一个微妙的问题。因为Red被定义为getter,所以它也会获得一个什么都不做的自动空setter。当你调用Color.Red = function() { return red; }时,你将那个功能传递给Color的setter。红色,它没有任何作用,所以这个表述没有效果。你可以在getter中加入一个alert(),然后自己调用它几次。

如果您查看为这一部分生成的JavaScript,您将看到getter是通过Object.defineProperty创建的,这是一个有趣的东西。您可以自己调用Object.defineProperty来重新定义getter的动作,但是当private static red : Color = new Color(255,0,0);工作得很好时,这似乎要做很多工作。

至于哪个是最好的,这是一个权衡的问题,哪个对你更重要。总是返回一个新对象会使用更多的内存,但避免了有人修改Color的风险。绿色,并引起了一个有趣的bug来追踪。

如果你想让它被缓存,你可以这样做:

class Color {
    public R: number;
    public G: number;
    public B: number;
    public A: number;
    private static _red : Color = new Color(255,0,0);   
    static get Red(): Color {
        return _red;
    } 
    static get Green(): Color {
        return new Color(0, 255, 0);
    }
    constructor(red: number, green: number, blue: number, alpha: number = 255) {
        this.R = red;
        this.G = green;
        this.B = blue;
        this.A = alpha;
    }
}

这样就不会在每次使用Red时都调用构造函数。

每次使用getter时,都会调用实现它的函数。Red实现不会完成任何形式的缓存。