I'm trying to write a class that exposes an inner data structure to its consumers, a data structure that the class itself will be using.
Example:
class Outer {
static Inner = class {
inInner: number
};
constructor(public inner: Outer.Inner) { }
}
The problem here is that Outer.Inner
is not recognized as a type.
The only answers that I've found are workarounds (in Typescript playground). I'm wondering if there are any elegant ways of doing this.
I have a bunch of Actions that are sent over WebSockets between client and server. Each Action
has its own Data
inner class. The Data
class itself is used elsewhere on the server. I could separate this into two classes (or an interface), like Action1
, Action1Data
, but I think that Action1.Data
is a more readable design.
Your second "workaround" is the prefer way to go:
class Outer {
constructor(public inner: Outer.Inner) { }
}
namespace Outer {
export class Inner {
inInner: number
};
}
// Spec
let outer1 = new Outer({ inInner: 3 });
let outerInner = new Outer.Inner();
let outer2 = new Outer(outerInner);
There are three types of declarations in TypeScript: namespace, type, and value.
You could use namespace
to organize types and value.
http://www.typescriptlang.org/docs/handbook/declaration-merging.html
It does not reduce readability because there is no concept of an "Inner Class" in TypeScript.
Remember that the class
syntax is just sugar of es5 prototypal inheritance.
How would you represent an inner class in prototypal inheritance? Do you put is as an instance variable? or under Outer.prototype.???
what it ends up in es5 is something like this:
var Outer = function Outer(...) { ... }
Outer.Inner = function Inner() { ... }
If you look at it, the Outer
in Outer.Inner
is only served as a "namespace" to hold the Inner
class.
I found a better workaround for this, that even allows the inner class to access the private members of the outer class, like you would expect in a C#-like language. You can actually easily get the type of the static property with the typeof
operator. This small modification to your example works:
class Outer
{
static Inner = class
{
inInner: number = 0;
};
constructor(public inner: typeof Outer.Inner.prototype) { }
}
But referring to the type as typeof Outer.Inner.prototype
gets cumbersome really quickly, so add in this underneath and you can simply refer to it as Outer.Inner
as you'd like:
namespace Outer
{
export type Inner = typeof Outer.Inner.prototype;
}
Combine this with another workaround to allow us to put decorators on the class by making it not an anonymous class and we end up with a fully functional true inner class:
class Outer
{
static Inner = (() =>
{
@decoratable()
class OuterInner
{
inInner: number = 0;
}
return OuterInner;
})();
constructor(public inner: Outer.Inner) { }
}
namespace Outer
{
export type Inner = typeof Outer.Inner.prototype;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With