Question

我是使用Typescript的新手。我想了解它。在官方文档中，静态描述：

静态属性

到目前为止，我们只讨论了类的实例成员，它们在实例化时显示在对象上。我们还可以创建类的静态成员，这些成员在类本身而不是实例上可见。在这个例子中，我们在原点上使用static，因为它是所有网格的一般值。每个实例都通过预先添加类的名称来访问此值。与此前相同。在实例访问之前，这里我们预先添加Grid。在静态访问之前。

所以代码是：

class Grid {
    static origin = {x: 0, y: 0};
        calculateDistanceFromOrigin(point: {x: number; y: number;}) {
            let xDist = (point.x - Grid.origin.x);
            let yDist = (point.y - Grid.origin.y);
            return Math.sqrt(xDist * xDist + yDist * yDist) / this.scale;
        }
    constructor (public scale: number) { }
}

let grid1 = new Grid(1.0);  // 1x scale
let grid2 = new Grid(5.0);  // 5x scale

console.log(grid1.calculateDistanceFromOrigin({x: 10, y: 10}));
console.log(grid2.calculateDistanceFromOrigin({x: 10, y: 10}));

将static origin = {x: 0, y: 0};更改为origin = {x: 0, y: 0};后，

let xDist = (point.x - this.origin.x);
let yDist = (point.y - this.origin.y);

输出相同。那么，有什么不同？谢谢你的帮助。

Answer 1

如果Grid.origin不是静态的，则调用origin会崩溃。我说＆＃34;应该＆＃34;在任何真正的OOP语言中都可以使用＆＃34;＆＃34;。问题是，打字稿只是一个被转换成js的中介，而不是OOP，并且不知道＆＃34;静态＆＃34;关键字。

正确使用它是在这种情况下使用static声明。请注意，虽然它似乎在运行时工作，但您的IDE仍应通知您该问题，因为IDE 知道静态意味着什么。

Answer 2

您使用它的方式没有区别，因为您没有更改origin值。静态属性或方法主要在类之外使用。

此外，不必创建类来使用静态属性/方法。因此，在下面的示例中，您可以获得origin这样的值。

class Grid {
    static origin = {x: 0, y: 0};
}

console.log(Grid.origin); // {x: 0, y: 0}

如果origin值不是static，那么您将创建一个new Grid()对象来获取值。

class Grid {
    origin = {x: 0, y: 0};
}

const grid = new Grid();
console.log(grid.origin); // {x: 0, y: 0}

否则你得到：Error TS2339: Property 'origin' does not exist on type 'typeof Grid'.

需要注意的一点是，所有Grid个对象的静态属性都是相同的。它是类级属性，而不是对象级属性。

class Grid {
    static origin = {x: 0, y: 0};

    constructor() {
        console.log(Grid.origin);
    }
}

console.log(new Grid()) // {x: 0, y: 0}
console.log(new Grid()) // {x: 0, y: 0}

// Change the static value
Grid.origin = {x: 5, y: 6}

console.log(new Grid()) // {x: 5, y: 6}
console.log(new Grid()) // {x: 5, y: 6}

如果您希望每个对象的origin不同，则不要使其为静态。

通常不会将类static与普通属性/方法混合使用。我可能在过去做过。在下面的示例中，我们将所有内容都设置为静态，因为我们在应用程序中只需要一个ScoreTracker实例。

class ScoreTracker {

    private static _score: number = 0;

    public static setScore(value: number): void {
        ScoreTracker._score = value;
    }

    public static getScore(): number {
        return ScoreTracker._score;
    }

    public static addPoints(value: number): void {
        ScoreTracker._score += value;
    }

    public static removePoints(value: number): void {
        ScoreTracker._score -= value;
    }

}

然后在我们的应用程序中，我们可以执行以下操作，并确保我们的分数在一个地方进行管理。

ScoreTracker.setScore(10);
ScoreTracker.addPoints(1);
ScoreTracker.removePoints(2);
console.log( ScoreTracker.getScore() ); // 9

希望这有帮助。

在Typescript中`this`和`static`有什么不同？

2 个答案: