I'm encountering errors while trying to instantiate a basic class named Point using HTML and TypeScript. Whenever I click on the hyperlink, I receive the following error messages within each try/catch block:
Errors:
- Cannot read property 'Empty' of undefined.
- undefined is not a function.
- undefined is not a function.
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>TypeScript HTML App</title>
<script src="app.js"></script>
<script type="text/javascript">
function Test()
{
try { alert(MyLibrary.Point.Empty.ToString()); }
catch (e) { alert(e.message); }
try { alert(new MyLibrary.Point(10, 20).ToString()); }
catch (e) { alert(e.message); }
try { alert(MyLibrary.Point.FromPoint(new MyLibrary.Point(10, 20)).ToString()); }
catch (e) { alert(e.message); }
}
</script>
</head>
<body>
<a href="javascript:Test();">Click Me</a>
</body>
</html>
TypeScript:
module MyLibrary
{
export interface IPoint { X: number; Y: number; ToString(): string; }
export class Point implements MyLibrary.IPoint
{
private _X: number = 0;
private _Y: number = 0;
constructor(x: number, y: number)
{
this._X = x;
this._Y = y;
}
public get X(): number { return (this._X); }
public get Y(): number { return (this._Y); }
public ToString(): string
{
return ("{" + this._X.toString() + "," + this._Y.toString() + "}");
}
public static FromPoint(point: MyLibrary.Point): MyLibrary.Point
{
return (new MyLibrary.Point(point.X, point.Y));
}
private static _Empty: MyLibrary.Point = new MyLibrary.Point(0, 0);
public static get Empty(): MyLibrary.Point { return (MyLibrary.Point._Empty); }
}
}
The TypeScript compiler works fine and the project adheres to ECMA5 standards. The issue seems to arise when utilizing static properties in the class. Any insights into why this might be happening? The generated JavaScript for the static properties is shown below:
Object.defineProperty(Point, "Empty", {
get: function ()
{
return (MyLibrary.Point._Empty);
},
enumerable: true,
configurable: true
});
Point._Empty = new MyLibrary.Point(0, 0);