Typoskript-Klasse wird leer

Question

Gegeben ein bestimmtes Setup in Typoskript Ich enden zur Laufzeit mit leeren Klassenobjekte in Javascript. Das Setup besteht einfach aus 2 Klassen, die sich gegenseitig referenzieren, wobei einer davon im Bereich des anderen leer ist. Ich weiß, wie ich es vermeiden kann (indem ich eine dritte Klasse zwischen den beiden einführe), aber ich bin neugierig, warum es passiert und gibt es eine Möglichkeit, diese Querverweise noch zu machen und trotzdem einen funktionierenden Code zu haben. Ich habe jede Menge Setup versucht, um es zum Laufen zu bringen, also bin ich hier.

Setup: jede Klasse in einem eigenen Modul (Modulnamen und Klassennamen irrelevant) KlasseA ist unser Haupteintrag:

// KlasseA

import ClassB = require('ClassB'); 
import ClassC = require('ClassC'); 

class ClassA 
{ 
    constructor() 
    { 
     console.log(ClassC.TEST);// shows 1 
     new ClassB();// shows null 
     console.log(ClassC.TEST);// shows 1 
    } 
} 
export = ClassA; 

// ClassB (in verschiedenen Modul)

import ClassC = require('ClassC'); 

class ClassB 
{ 
    public static ClassBRef:any; 

    constructor() 
    { 
     console.log(ClassC.TEST);// in this scope ClassC is an empty object with no properties 
    } 
} 
export = ClassB; 

// ClassC (in anderen Modul)

import ClassB = require('ClassB'); 

class ClassC 
{ 
    public static TEST:number = 1; 

    constructor() 
    { 
     ClassB.ClassBRef; 
    } 
} 
export = ClassC; 

Da ClassB auf ClassC- und ClassC-Referenzen verweist ClassB hier ist das Ergebnis: ClassC in ClassA-Bereich existieren ohne Problem, aber innerhalb ClassB-Bereich, ClassC ist ein leeres Objekt zur Laufzeit ohne Eigenschaften. Mit anderen Worten, in Maschinenschrift ist alles in Ordnung, aber Javascript wird es nicht haben. Das Ändern von Modulnamen, Speicherort, Klassennamen, Verwendung des statischen oder Instanzbereichs, in Konstruktor- oder Instanzmethoden oder statischen Methoden usw. macht keinen Unterschied, und ClassC ist im ClassB-Bereich immer leer.

Wie gesagt, die Lösung ist eine dritte Klasse, die Kommunikation mit den 2 fehlerhaften Klassen (also mindestens eine der 2 Klassen hat keine Referenzen auf die zweite), aber meine Frage ist, wie es geht ohne Benötigen Sie eine dritte Klasse und ohne den Querverweis zwischen den 2 Klassen zu entfernen?

Answer 1

Sie haben eine zirkuläre Referenz zwischen ClassB und ClassC. In jeder JavaScript-Umgebung ist es wirklich schwierig, diese Probleme zu lösen.

Sie haben grundsätzlich zwei Szenarien.

ClassB ist require d. ClassC ist require d. ClassC Versuche zu requireClassB.

In diesem Fall, da ClassB noch erstellt wird (es hat nichts exportiert), wird es undefiniert sein. Der umgekehrte Fall kann auftreten, wenn zuerst ClassC geladen wird.

Es gibt eine Möglichkeit, die Sie lösen können, ohne zusätzliche Dateien, aber es fühlt sich falsch an.

import containerC = require('ClassC'); 
// or import * as containerC from 'ClassC'; in ES6 syntax 

export class ClassB 
{ 
    public static ClassBRef:any; 

    constructor() 
    { 
     console.log(containerC.ClassC.TEST);// in this scope ClassC is an empty object with no properties 
    } 
} 

// ClassC 
import containerB = require('ClassB'); 

export class ClassC 
{ 
    public static TEST:number = 1; 

    constructor() 
    { 
     containerB.ClassB.ClassBRef; 
    } 
} 

Dies ist möglich, weil der zurückgegebene Wert von erfordern von der Zeit wird die constructor von entweder Klasse läuft bestückt werden.

Sie können export = X Syntax nicht verwenden, müssen Sie die benannte Export-Syntax verwenden. Sie können auch nicht versuchen, auf beide Klassen zuzugreifen, nachdem das Modul geladen wurde. Also muss es in einem Konstruktor oder einer Funktion sein, die aufgerufen wird, nachdem die Klasse exportiert wurde.

Answer 2

die Syntax verwenden import { ClassC } from "./ClassC"; für die Klassen importieren, statt import ClassC = require('ClassC');

Klasse B:

import { ClassC } from "./ClassC"; // use this syntax 

class ClassB 
{ 
    public static ClassBRef:any; 

    constructor() 
    { 
     console.log(ClassC.TEST); 
    } 
} 
export { ClassB }; 

Klasse C:

import { ClassB } from "./ClassB"; // use this syntax 

class ClassC 
{ 
    public static TEST:number = 1; 

    constructor() 
    { 
     ClassB.ClassBRef; 
    } 
} 

export { ClassC };