Javascript - Control of callbacks

Question

I don’t really know how to ask this. I don’t know much about JS, but come on... The system here has an API that adds and manages elements on the screen. For example, just to illustrate: if I put API.adicionar(tipo.CampoTexto, "idNome", posicao), he adds a input with a given ID at a given position.

That said, I have this JSON structure:

{
    "parent 1": [
        {
            "key 1.1.1": "item 1.1.1",
            "key 1.1.2": "item 1.1.2",
            "key 1.1.3": "item 1.1.3"
        },
        {
            "key 1.2.1": "item 1.2.1",
            "key 1.2.2": "item 1.2.2",
            "key 1.2.3": "item 1.2.3"
        },
      ],
      "parent 2": [
        {
            "key 2.1.1": "item 2.1.1",
            "key 2.1.2": "item 2.1.2",
            "key 2.1.3": "item 2.1.3"
        },
        {
            "key 2.2.1": "item 2.2.1",
            "key 2.2.2": "item 2.2.2",
            "key 2.2.3": "item 2.2.3"
        }
    ]
}

The problem is that I need to group this data the way it is in JSON: nested. When I use the API to add the parent 1, need to specify how many items will go with it. In the case of the example above, it would be 6 fields (need to divide 3 for each object).

I have a variable that stores the amount of fields that have been added and basically it is getting lost, because when I add a field, until the render time, it has already passed another instruction/condition and started setting another field to render...

How can I make these chains to start the part only when another one is already completed?

Follow a little code (I’m free to throw everything in the trash and start again, okay?)

var _objetoDados;

function DadosAgrupados(index, numeroCamposAdicionados) {
    this.index = index;

    // json vem de um HTTP Request no formato acima
    this.agrupamento = Object.values(json)[this.index];
    this.tituloAuditado = Object.keys(json)[this.index];
    this.numeroCamposAdicionados = numeroCamposAdicionados;
}

DadosAgrupados.prototype.agrupa = function(callback) {
    callback.call(this);
}

DadosAgrupados.prototype.retornaIndice = function() {
    return this.index;
}

DadosAgrupados.prototype.somaNumeroCamposAdicionados = function() {
    this.numeroCamposAdicionados++;
}

DadosAgrupados.prototype.retornaNumeroCamposAdicionados = function() {
    return this.numeroCamposAdicionados;
}

function montaDados() {

    var objetoAgrupado = this.agrupamento;
    var tamanhoItens = Object.keys(consolidado).length;

    if (!API.campo("CAMPO_TESTE").existe()) {

        /* PRIMEIRA ADIÇÃO - FUNCIONA OK */

        _objetoDados.somaNumeroCamposAdicionados();

        //Esse método não é necessário para a lógica do problema
        configuraDadosHTML(1, objetoAgrupado[0]);

        API.campo("CAMPO_TESTE").adicionaCamposAninhados(tamanhoItens - 1);
        API.campo("CAMPO_TESTE").adicionaEvento('tipoEspecificoCallback', function (e) {
            var indice = e.data.campo.indice - 1;

            _objetoDados.somaNumeroCamposAdicionados();

            //Até aqui, indice é o número de campos que foram adicionados
            configuraDadosHTML(indice, objetoAgrupado[indice - 1]);

            if (indice > (tamanhoItens - 1)) {
                criaNovoAgrupamento();
            }

        });
    }
    else {

        /** AQUI COMEÇA O PROBLEMA, O QUARTO ITEM ADICIONA NORMALMENTE, DEPOIS JÁ PERDE OS VALORES DE INDICE DE CAMPOS ADICIONADOS */
        else {
        _objetoDados.somaNumeroCamposAdicionados();
        configuraDadosTituloRepeticaoConsolidado(_objetoDados.retornaNumeroCamposAdicionados(), objetoAgrupado[0]);

        if (tamanhoItens > 1) {
            API.campo("CAMPO_TESTE").adicionaCamposAninhados(tamanhoItens - 1);
            API.campo("CAMPO_TESTE").adicionaEvento('tipoEspecificoCallback', function (e) {
                var indice = e.data.campo.indice - 1;

                _objetoDados.somaNumeroCamposAdicionados();
                configuraDadosHTML(_objetoDados.retornaNumeroCamposAdicionados(), objetoAgrupado[tamanhoItens - indice]);
                criaNovoAgrupamento();
            });
        }
        else {
            criaNovoAgrupamento();
        }
    }
    }
}

function criaNovoAgrupamento() {
    var novoIndice = 0;
    var camposAdicionados = 0;

    if (_objetoDados != undefined) {
        novoIndice = _objetoDados.retornaIndice() + 1;

        if (Object.keys(json)[novoIndice] == undefined) {
            return;
        }
        camposAdicionados = _objetoDados.retornaNumeroCamposAdicionados();
    }

    _objetoDados = new DadosAgrupados(novoIndice, camposAdicionados);
    _objetoDados.agrupa(montaDados);
}