JavaScript: Eine Funktion anhalten und auf eine globale Variable warten

Question

Es gibt eine globale Variable window.listNodes, die ein Array ist. Diese Variable wird alle 3 Sekunden aktualisiert und wird sequenziell gefüllt.

Eine weitere Funktion onOpen() wird vom Benutzer ausgelöst und muss die globale Variable window.listNodes mit 3 Elementen haben, nicht weniger. Was ich tun möchte: Wenn die globale Variable keine .length gleich 3 hat, dann wartet das Programm, dass der andere Teil des Codes window.listNodes füllt und dann wieder die Funktion onOpen() beginnt.

socket.onopen = function onOpen() { 
     if (window.listNodes.length === 3) { 
      // Do something 
     } else { 
      // Wait and when window.listNodes.length === 3: 
      onOpen(); 
     } 
    }); 
}; 

Gibt es einen einfachen Weg, es zu tun? Ich habe es mit der Funktion setTimeOut() versucht und mit einer Generatorfunktion und dem Schlüsselwort yield bin ich aber gescheitert.

Vielen Dank für Ihre wertvolle Hilfe :)

Answer 1

Diese setTimeout und ein benutzerdefiniertes Intervall zu warten, zum Beispiel verwenden könnte, 500ms, es zu tun:

function onOpen() { 
     if (window.listNodes.length === 3) { 
      // Do something 
     } else { 
      // Wait and when window.listNodes.length === 3: 
      setTimeout(onOpen, 500); 
     } 
    }); 
}; 

socket.onopen = onOpen; 

Answer 2

mit dem Versprechen:

function getListNodes() { 
    return new Promise(function check(resolve) { 
    if (window.listNodes.length === 3) { return resolve(window.listNodes); } 
    setTimeout(() => check(resolve), 500); 
    }); 
} 

socket.onopen = async function() { 
    const listNodes = await getListNodes(); 
    // use listNodes normally 
}; 

Innerhalb einer async Funktion wird das Schlüsselwort await die Funktion anhalten, bis das Versprechen, auf das gewartet wird, aufgelöst ist (oder r ausgeworfen).

Das von getListNodes() zurückgegebene Versprechen wiederholt alle 500 Millisekunden die Suche und löst auf, wenn festgestellt wird, dass die Länge ausreicht.

Beachten Sie, dass native Funktionen async nur in Chrome und in Edge unterstützt werden. Sie werden Babel + Babel Polyfill brauchen, um sie überall zu verwenden.