Árvore Angular/TypeScript com referências de filho/pai - como evitar variável de escopo de bloco usada antes da sua declaração
Vamos ter uma árvore de nós/objetos muito simples com referências a pais e filhos, onde precisamos referenciar tanto o pai quanto os nós filhos. A parte complicada aqui é que queremos projetar e usar os nós não apenas na árvore, mas também de forma independente da árvore/separadamente. Ou seja, não podemos aninhá-los diretamente nos nós pai, mas sim por referência e também referenciar os nós filhos nos nós pai. Isso apresenta um problema de erro no Typescript:
2448 Variável com escopo de bloco 'rootNode' usada antes de sua declaração.ts(2448)
Se colocarmos os nós em ordem decrescente, podemos referenciar os filhos acima. Mas não os pais abaixo. E vice-versa. Se colocarmos os pais acima dos filhos, não podemos referenciar os filhos, pois eles são declarados depois deles.
Parece que o Typescript não é sofisticado o suficiente para pré-compilar declarações e lança erros em vez disso.
Como isso pode ser resolvido?
Aqui está um exemplo dos nós da árvore (colocados em ordem decrescente) e seus nós 'independentes' com referências:
export interface Node {
id: string,
value?: string,
parent?: Node,
children?: Node[]
}
export const nodeB2: Node = {
id: 'B2',
value: 'bbb-2',
parent: nodeA1 // ERR 2448
}
export const nodeB1: Node = {
id: 'B1',
value: 'bbb-1',
parent: nodeA1 // ERR 2448
}
export const nodeA1: Node = {
id: 'A1',
value: 'aaa-1',
parent: rootNode, // ERR 2448
children: [nodeB1, nodeB2]
}
export const rootNode: Node = {
id: 'ROOT',
value: 'root',
children: [nodeA1]
}
Resposta #1
Experimente isto:
declare let rootNode: Node;
export interface Node {
id: string,
value ? : string,
parent ? : Node,
children ? : Node[]
}
export const nodeB2: Node = {
id: 'B2',
value: 'bbb-2',
parent: rootNode // ERR 2448
}
export const nodeB1: Node = {
id: 'B1',
value: 'bbb-1',
parent: rootNode // ERR 2448
}
export const nodeA1: Node = {
id: 'A1',
value: 'aaa-1',
parent: rootNode, // ERR 2448
children: [nodeB1, nodeB2]
}
rootNode = {
id: 'ROOT',
value: 'root',
children: [nodeA1]
};
export default rootNode;
