Is there a way to nest classes in TypeScript. E.g. I'd like to use them like:
var foo = new Foo();
var bar = new Foo.Bar();
-
2For older typescript (<1.6), see Any way to nest classes in typescript?Rahul Tripathi– Rahul Tripathi2015-09-10 06:03:33 +00:00Commented Sep 10, 2015 at 6:03
Add a comment
|
6 Answers
In modern TypeScript we have class expressions which you can use to create a nested class. For example you can do the following :
class Foo {
static Bar = class {
}
}
// works!
var foo = new Foo();
var bar = new Foo.Bar();
9 Comments
Sergey
this example doesn't work in Typescript 1.6.3: Error TS4028 Public static property 'Bar' of exported class has or is using private name '(Anonymous class)'.
Dan Def
@Sergey I had the same problem so started using namespaces as per my answer below.
RoG
Is there a way to create interface inside a class? i.e. if we want that Bar will be an interface
LucasM
Any way to reuse the nested class from the parent class? class Foo { static Bar = class { }; fieldA: Bar; //doesn't work: Cannot find name 'Bar' fieldB: Foo.Bar; //doesn't work: 'Foo' only refers to a type, but is being used as namespace here. } // works! var foo = new Foo(); var bar = new Foo.Bar();
interjay
This doesn't let you use the inner type in type annotations.
|
Here is a more complex use case using class expressions.
It allows the inner class to access the private members of the outer class.
class classX {
private y: number = 0;
public getY(): number { return this.y; }
public utilities = new class {
constructor(public superThis: classX) {
}
public testSetOuterPrivate(target: number) {
this.superThis.y = target;
}
}(this);
}
const x1: classX = new classX();
alert(x1.getY());
x1.utilities.testSetOuterPrivate(4);
alert(x1.getY());
6 Comments
bnieland
@RyanCavanaugh Is the ability to access private members inside an "inner" class expression a bug?
bnieland
I verified this is correct usage with the TypeScript team. github.com/Microsoft/TypeScript/issues/…
shabunc
is it possible it access parent context without passing this directly ?
bnieland
@shabunc not to my knowledge
PEZO
idea if you need a "true" (not "static") inner class (as an object template), then use it like
() => new class |
I couldn't get this to work with exported classes without receiving a compile error, instead I used namespaces:
namespace MyNamespace {
export class Foo { }
}
namespace MyNamespace.Foo {
export class Bar { }
}
1 Comment
Will Beason
Same. 'Foo' only refers to a type, but is being used as a namespace here.
If you're in the context of a type declaration file, you can do this by mixing classes and namespaces:
// foo.d.ts
declare class Foo {
constructor();
fooMethod(): any;
}
declare namespace Foo {
class Bar {
constructor();
barMethod(): any;
}
}
// ...elsewhere
const foo = new Foo();
const bar = new Foo.Bar();
Comments
Static nesting
Defining the static nested class Foo.Bar can be done in the following two ways.
Option 1: Implementing
Barinside namespaceFoo.
The type is automatically declared using declaration merging.class Foo { } namespace Foo { export class Bar { } } let bar: Foo.Bar = new Foo.Bar()Option 2: Implementing
Barinside classFoo.
The type is declared in an ambient namespace declaration.class Foo { static Bar = class { } } declare namespace Foo { type Bar = typeof Foo.Bar.prototype } let bar: Foo.Bar = new Foo.Bar()
Non-static nesting
Defining the non-static nested class Foo.prototype.Bar may be done as follows.
The type is again declared in an ambient namespace declaration.
class Foo {
Bar = class { }
}
declare namespace Foo.prototype {
type Bar = typeof Foo.prototype.Bar.prototype
}
let foo: Foo = new Foo()
let bar: Foo.prototype.Bar = new foo.Bar()
Note: the call
new Foo.prototype.Bar()doesn't work, although it is valid Typescript even without type declaration.
Comments
I Hope this can be helpful
Able to:
- Create a new inner class instance
- Access outer class instance/prototype members
- Implement interfaces
- Use decorators
Use Case
export interface Constructor<T> {
new(...args: any[]): T;
}
export interface Testable {
test(): void;
}
export function LogClassName<T>() {
return function (target: Constructor<T>) {
console.log(target.name);
}
}
class OuterClass {
private _prop1: string;
constructor(prop1: string) {
this._prop1 = prop1;
}
private method1(): string {
return 'private outer method 1';
}
public InnerClass = (
() => {
const $outer = this;
@LogClassName()
class InnerClass implements Testable {
private readonly _$outer: typeof $outer;
constructor(public innerProp1: string) {
this._$outer = $outer;
}
public test(): void {
console.log('test()');
}
public outerPrivateProp1(): string {
return this._$outer._prop1;
}
public outerPrivateMethod1(): string {
return this._$outer.method1();
}
}
return InnerClass;
}
)();
}
const outer = new OuterClass('outer prop 1')
const inner = new outer.InnerClass('inner prop 1');
console.log(inner instanceof outer.InnerClass); // true
console.log(inner.innerProp1); // inner prop 1
console.log(inner.outerPrivateProp1()); // outer prop 1
console.log(inner.outerPrivateMethod1()); // private outer method 1
