2012-12-11 60 views
21

是否有一种方便的方法可以在模块中访问全局变量,而无需编译器错误,即下面使用CANVAS_WIDTH?Typescript全局变量

export class Bullet { 


     x: number = 22; 
     y: number = 22; 

     constructor (speed: number) { 
      this.xVelocity = speed; 
     } 

     inBounds() { 
      return this.x >= 0 && this.x <= CANVAS_WIDTH && 
       this.y >= 0 && this.y <= CANVAS_HEIGHT; 
     }; 
} 
} 
+0

您将在哪里设置CANVAS_WIDTH的值? –

+0

在用Bullet类导入模块的游戏类中GameObjects = module(“GameObjects”) – Nikos

+1

在Game类中有CANVAS_WIDTH,需要在Bullet类中访问它。我对吗? –

回答

24

您需要定义这些属性为静态的,那么你可以很容易地访问它像这样,

export class Game { 
    static canvas: JQuery; 
    static CANVAS_WIDTH: number; 
    static CANVAS_HEIGHT: number; 
    bullet: Bullet; 

    constructor(canvasElem: JQuery) { 
     Game.canvas = canvasElem; 
     Game.CANVAS_WIDTH = Game.canvas.width(); 
     Game.CANVAS_HEIGHT = Game.canvas.height(); 
    } 
} 

export class Bullet { 
    x: number = 22; 
    y: number = 22; 

    public inBounds() { 
     // accessing static properties 
     return this.x >= 0 && this.x <= Game.CANVAS_WIDTH && this.y >= 0 && this.y <= Game.CANVAS_HEIGHT; 
    } 
} 

这编译为:

define(["require", "exports"], function(require, exports) { 
    var Game = (function() { 
     function Game(canvasElem) { 
      Game.canvas = canvasElem; 
      Game.CANVAS_WIDTH = Game.canvas.width(); 
      Game.CANVAS_HEIGHT = Game.canvas.height(); 
     } 
     return Game; 
    })(); 
    exports.Game = Game; 

    var Bullet = (function() { 
     function Bullet() { 
      this.x = 22; 
      this.y = 22; 
     } 
     Bullet.prototype.inBounds = function() { 
      // accessing static properties 
      return this.x >= 0 && this.x <= Game.CANVAS_WIDTH && this.y >= 0 && this.y <= Game.CANVAS_HEIGHT; 
     }; 
     return Bullet; 
    })(); 
    exports.Bullet = Bullet; 
}); 
//# sourceMappingURL=dhdh.js.map 
+0

希望,这一个帮助。如果有帮助,接受为答案。 –

+0

感谢队友的帮助! – Nikos

+1

添加了编译的JS文件 –

2

这是一个人为的例子,但不是试图推动全球范围内,您可以使用该模块范围包围将从几个类中使用的变量。

module MyModule { 
    var x: number = 5; 

    export class FirstClass { 
     doSomething() { 
      x = 10; 
     } 
    } 

    export class SecondClass { 
     showSomething() { 
      alert(x.toString()); 
     } 
    } 
} 

var a = new MyModule.FirstClass(); 
a.doSomething(); 

var b = new MyModule.SecondClass(); 
b.showSomething(); 

所有关于使用同一个变量多的东西通常的规则适用于这里 - 你不希望强制调用代码事件的特定顺序。


编译为:

var MyModule; 
(function (MyModule) { 
    var x = 5; 

    var FirstClass = (function() { 
     function FirstClass() { 
     } 
     FirstClass.prototype.doSomething = function() { 
      x = 10; 
     }; 
     return FirstClass; 
    })(); 
    MyModule.FirstClass = FirstClass; 

    var SecondClass = (function() { 
     function SecondClass() { 
     } 
     SecondClass.prototype.showSomething = function() { 
      alert(x.toString()); 
     }; 
     return SecondClass; 
    })(); 
    MyModule.SecondClass = SecondClass; 
})(MyModule || (MyModule = {})); 

var a = new MyModule.FirstClass(); 
a.doSomething(); 

var b = new MyModule.SecondClass(); 
b.showSomething(); 
+0

这是否仍然在最新版本的打字机?它没有出现该示例编译... – Kyle

+0

我已经更新了这个TypeScript 0.9.x – Fenton

+0

添加了编译js作比较 –