Qu'est-ce que la version JavaScript de sleep()?

(Voir la mise à jour de réponse pour 2016)

Je pense qu'il est parfaitement raisonnable d'en souhaitez effectuer une action, attendre, puis effectuer une autre action. Si vous êtes habitué à l'écriture en multi-thread langues, vous avez probablement l'idée de céder à l'exécution pendant un certain temps jusqu'à ce que votre fils se réveille.

Le problème ici est que JavaScript est un thread unique événement à base de modèle. Alors que dans un cas spécifique, il peut être intéressant de disposer de l'ensemble moteur, attendez quelques secondes, en général, c'est une mauvaise pratique. Supposons que je voulais faire usage de vos fonctions lors de l'écriture de mon propre? Quand j'ai appelé votre méthode, mes méthodes seraient tous geler. Si JavaScript pourrait en quelque sorte de préserver votre fonction du contexte d'exécution, de le stocker quelque part, puis de le mettre en arrière et reprendre plus tard, puis le sommeil pourrait arriver, mais qui serait grosso modo le filetage.

Donc, vous êtes un peu coincé avec ce que d'autres ont suggéré-vous aurez besoin de casser votre code en plusieurs fonctions.

Votre question est un peu un faux choix, puis. Il n'y a pas moyen de dormir dans la manière que vous voulez, vous ne devriez pas poursuivre la solution que vous suggérez.

Seulement pour debug/dev , je poste ceci si c'est utile à quelqu'un

Des choses intéressantes, dans Firebug ( & probablement d'autres js consoles ), rien ne se passe en appuyant sur entrée après, seulement après, la durée du sommeil spécifié (...)

function sleepFor( sleepDuration ){
    var now = new Date().getTime();
    while(new Date().getTime() < now + sleepDuration){ /* do nothing */ } 
}

Exemple d'utilisation:

function sleepThenAct(){ sleepFor(2000); console.log("hello js sleep !"); }

Pour l'amour de $DIVINITÉ merci de ne pas faire un occupé-attendre une fonction de veille. setTimeout et setInterval faire tout ce dont vous avez besoin.

Si vous utilisez jQuery, quelqu'un a réellement créé un "retard" plugin qui n'est rien de plus qu'un wrapper pour setTimeout:

//Delay Plugin for jQuery
//- http://www.evanbot.com
//- © 2008 Evan Byrne

jQuery.fn.delay = function(time,func){
    this.each(function(){
        setTimeout(func,time);
    });

    return this;
};

Vous pouvez ensuite l'utiliser dans une ligne d'appels de fonction comme prévu:

$('#warning')
.addClass('highlight')
.delay(1000)
.removeClass('highlight');

Ici vous allez. Comme le code dit, ne pas être un mauvais dev et l'utiliser sur des sites web. C'est un développement de la fonction d'utilité.

//Basic sleep function based on ms.
//DO NOT USE ON PUBLIC FACING WEBSITES.
function sleep(ms) {
    var unixtime_ms = new Date().getTime();
    while(new Date().getTime() < unixtime_ms + ms) {}
}

Personnellement, j'aime le simple:

function sleep(seconds){
    var waitUntil = new Date().getTime() + seconds*1000;
    while(new Date().getTime() < waitUntil) true;
}

alors:

sleep(2); //Sleeps for 2 seconds

Je l'utilise tout le temps pour créer de faux temps de chargement lors de la création de scripts dans P5js

Meilleure solution pour faire des choses qui ressemblent à ce que la plupart des gens veulent, c'est d'utiliser une fonction anonyme:

alert('start');
var a = 'foo';
//lots of code
setTimeout(function(){  //Beginning of code that should run AFTER the timeout
    alert(a);
    //lots more code
},5000);  //put the timeout here

C'est probablement le plus proche que vous obtiendrez à quelque chose qui n'existe tout simplement ce que vous voulez.

Remarque, si vous avez besoin de plusieurs couchages cela peut devenir laid pressé et que vous pourriez réellement besoin de repenser votre conception.

Je résumerait setTimeOut dans une Promesse pour le code de la cohérence avec d'autres tâches asynchrones : la Démo en Violon

function sleep(ms)
{
    return(new Promise(function(resolve, reject) {        
        setTimeout(function() { resolve(); }, ms);        
    }));    
}

Utilisé comme ça :

sleep(2000).then(function() { 
   //Do something
});

Il est facile de se souvenir de la syntaxe si vous utilisez les Promesses.

J'ai cherché/googlé tout à fait un peu de pages sur javascript/sommeil attendre... et il n'y a PAS de réponse, si vous voulez javascript "d'EXÉCUTION, de RETARD, de COURIR"... ce que la plupart des gens ont été soit, "RUN, RUN(inutiles), EXÉCUTER" ou "RUN, RUN + retardé RUN"....

Donc j'ai mangé des hamburgers et eu la pensée:::
voici une solution qui fonctionne... mais vous devez couper votre exécution de codes...:::
oui, je sais, c'est juste un plus facile à lire refactoring... encore...

//.........................................
//exemple1:

<html>
<body>
<div id="id1">DISPLAY</div>

<script>
//javascript sleep by "therealdealsince1982"; copyrighted 2009
//setInterval
var i = 0;

function run() {
    //pieces of codes to run
    if (i==0){document.getElementById("id1").innerHTML= "<p>code segment "+ i +" is ran</p>"; }
    if (i==1){document.getElementById("id1").innerHTML= "<p>code segment "+ i +" is ran</p>"; }
    if (i==2){document.getElementById("id1").innerHTML= "<p>code segment "+ i +" is ran</p>"; }
    if (i >2){document.getElementById("id1").innerHTML= "<p>code segment "+ i +" is ran</p>"; }
    if (i==5){document.getElementById("id1").innerHTML= "<p>all code segment finished running</p>"; clearInterval(t); } //end interval, stops run
    i++; //segment of code finished running, next...
}

run();
t=setInterval("run()",1000);

</script>
</body>
</html>

//....................................
//exemple2:

<html>
<body>
<div id="id1">DISPLAY</div>

<script>
//javascript sleep by "therealdealsince1982"; copyrighted 2009
//setTimeout
var i = 0;

function run() {
    //pieces of codes to run, can use switch statement
    if (i==0){document.getElementById("id1").innerHTML= "<p>code segment "+ i +" ran</p>"; sleep(1000);}
    if (i==1){document.getElementById("id1").innerHTML= "<p>code segment "+ i +" ran</p>"; sleep(2000);}
    if (i==2){document.getElementById("id1").innerHTML= "<p>code segment "+ i +" ran</p>"; sleep(3000);}
    if (i==3){document.getElementById("id1").innerHTML= "<p>code segment "+ i +" ran</p>";} //stops automatically
    i++;
}

function sleep(dur) {t=setTimeout("run()",dur);} //starts flow control again after dur

run(); //starts
</script>
</body>
</html>

//.................
exemple3:

<html>
<body>
<div id="id1">DISPLAY</div>

<script>
//javascript sleep by "therealdealsince1982"; copyrighted 2009
//setTimeout
var i = 0;

function flow() {
    run(i);
    i++; //code segment finished running, increment i; can put elsewhere
    sleep(1000);
    if (i==5) {clearTimeout(t);} //stops flow, must be after sleep()
}

function run(segment) {
    //pieces of codes to run, can use switch statement
    if (segment==0){document.getElementById("id1").innerHTML= "<p>code segment "+ segment +" is ran</p>"; }
    if (segment==1){document.getElementById("id1").innerHTML= "<p>code segment "+ segment +" is ran</p>"; }
    if (segment==2){document.getElementById("id1").innerHTML= "<p>code segment "+ segment +" is ran</p>"; }
    if (segment >2){document.getElementById("id1").innerHTML= "<p>code segment "+ segment +" is ran</p>"; }
}

function sleep(dur) {t=setTimeout("flow()",dur);} //starts flow control again after dur

flow(); //starts flow
</script>
</body>
</html>

//..............
exemple4:

<html>
<body>
<div id="id1">DISPLAY</div>

<script>
//javascript sleep by "therealdealsince1982"; copyrighted 2009
//setTimeout, switch
var i = 0;

function flow() {
    switch(i)
    {
        case 0:
            run(i);
            sleep(1000);
            break;
        case 1:
            run(i);
            sleep(2000);
            break;
        case 5:
            run(i);
            clearTimeout(t); //stops flow
            break;
        default:
            run(i);
            sleep(3000);
            break;
    }
}

function run(segment) {
    //pieces of codes to run, can use switch statement
    if (segment==0){document.getElementById("id1").innerHTML= "<p>code segment "+ segment +" is ran</p>"; }
    if (segment==1){document.getElementById("id1").innerHTML= "<p>code segment "+ segment +" is ran</p>"; }
    if (segment==2){document.getElementById("id1").innerHTML= "<p>code segment "+ segment +" is ran</p>"; }
    if (segment >2){document.getElementById("id1").innerHTML= "<p>code segment "+ segment +" is ran</p>"; }
    i++; //current segment of code finished running, next...
}

function sleep(dur) {t=setTimeout("flow()",dur);} //starts flow control again after dur

flow(); //starts flow control for first time...
</script>
</body>
</html>

Un scénario où vous voudrez peut-être un sleep() de la fonction plutôt que d'utiliser setTimeout() si vous avez une fonction de répondre à un clic de l'utilisateur qui sera finalement l'ouverture d'un nouveau c'est à dire la fenêtre popup et que vous avez commencé un traitement qui nécessite une courte période afin de terminer avant que le popup s'affiche. Le déplacement de la fenêtre ouverte dans une fermeture signifie qu'il obtient généralement bloqué par le navigateur.

L'ajout de mes deux bits. J'avais besoin d'un occupé-attendre à des fins de test. Je n'ai pas envie de diviser le code en tant que ce serait beaucoup de travail, donc un simple pour fait pour moi.

for (var i=0;i<1000000;i++){                    
     //waiting
  }

Je ne vois aucun inconvénient à le faire et ça a fait l'affaire pour moi.

Un grand nombre de réponses n'est pas (directement) de répondre à la question, et pas plus que celui-ci...

Voici mes deux cents (ou fonctions):

Si vous voulez moins maladroit de fonctions que setTimeout et setInterval, vous pouvez les envelopper dans des fonctions qui vient de renverser l'ordre des arguments et de leur donner de nice noms:

function after(ms, fn){ setTimeout(fn, ms); }
function every(ms, fn){ setInterval(fn, ms); }

CoffeeScript versions:

after = (ms, fn)-> setTimeout fn, ms
every = (ms, fn)-> setInterval fn, ms

Vous pouvez ensuite les utiliser bien avec les fonctions anonymes:

after(1000, function(){
    console.log("it's been a second");
    after(1000, function(){
        console.log("it's been another second");
    });
});

Maintenant, il se lit facilement comme "après les N millisecondes, ..." (ou "toutes les N millisecondes, ...")

Pour le cas spécifique de vouloir faire de l'espace un ensemble d'appels en cours d'exécution par une boucle, vous pouvez utiliser quelque chose comme le code ci-dessous avec le prototype. Sans prototype, vous pouvez remplacer la fonction de délai avec setTimeout.

function itemHandler(item)
{
    alert(item);
}

var itemSet = ['a','b','c'];

//Each call to itemHandler will execute
//1 second apart
for(var i=0; i<itemSet.length; i++)
{
    var secondsUntilExecution = i;
    itemHandler.delay(secondsUntilExecution, item)
}

Une vieille question, à partir de 2009. Maintenant, en 2015, une nouvelle solution est possible avec des générateurs définis dans ECMAscript 2015 aka ES6. Il a été approuvé en juin, mais il a été implémenté dans Firefox et Chrome avant. Maintenant une fonction de veille peut être rendu non-occupé, non-blocage et imbriquées à l'intérieur des boucles et sous-fonctions, sans le figer le navigateur. Seule la pure JavaScript est nécessaire, pas de bibliothèques ou de cadres.

Le programme ci-dessous montre comment sleep() et runSleepyTask() peut être faite. Le sleep() fonction est uniquement un yield déclaration. Il est tellement simple qu'il est en fait plus facile d'écrire le yield déclaration directement en lieu et place de l'appel de sleep(), mais alors il n'y aurait pas de sommeil du tout-mot 🙂 Le rendement renvoie une valeur de temps à la next() méthode à l'intérieur d' wakeup() et attend. Le "sommeil" se fait dans wakeup() en utilisant le bon vieux setTimeout(). Au rappel de la next() méthode déclenche la yield déclaration de continuer, et de la "magie" de rendement est que toutes les variables locales et de l'ensemble de la pile des appels autour de lui, est encore intact.

Fonctions qui utilisent un sleep() ou de rendement doivent être définies comme des générateurs. Facile fait par l'ajout d'un astérisque, pour le mot-clé function*. Pour exécuter un générateur est un peu plus compliqué. Lorsqu'il est invoqué avec le mot-clé new le générateur retourne un objet qui a la next() méthode, mais le corps du générateur n'est pas exécutée (le mot-clé new est facultative et ne fait pas de différence). Le next() méthode déclenche l'exécution de la génératrice du corps jusqu'à ce qu'il rencontre un yield. La fonction wrapper runSleepyTask() démarrage de la table de ping-pong: next() attend un yield, et yield attend un next().

Une autre façon d'appeler un générateur est avec le mot-clé yield*, ici, il fonctionne comme un simple appel à la fonction, mais il comprend aussi la capacité de rendement jusqu'à next().

Cela est démontré par l'exemple drawTree(). Il dessine un arbre avec des feuilles sur une rotation 3D de la scène. Un arbre est dessiné comme un tronc avec 3 pièces en haut dans des directions différentes. Chaque partie est ensuite établi comme un autre, mais en plus petit arbre en appelant drawTree() de manière récursive après une courte nuit de sommeil. Un très petit arbre est dessiné comme seulement une feuille.

Chaque feuille a sa propre vie dans une autre tâche a commencé avec runSleepyTask(). Il naît, grandit, s'assied, s'arrête, tombe et meurt dans growLeaf(). La vitesse est contrôlée avec sleep(). Cela démontre comment il est facile de multitâche qui peut être fait.

JS:

function* sleep(milliseconds) {yield milliseconds};
function runSleepyTask(task) {
(function wakeup() {
var result = task.next();
if (!result.done) setTimeout(wakeup, result.value);
})()
}
////////////////written by Ole Middelboe  /////////////////////////////
pen3D =setup3D();
var taskObject = new drawTree(pen3D.center, 5);
runSleepyTask(taskObject);
function* drawTree(root3D, size) {
if (size < 2) runSleepyTask(new growLeaf(root3D))
else {
pen3D.drawTrunk(root3D, size);
for (var p of [1, 3, 5]) {
var part3D = new pen3D.Thing;
root3D.add(part3D);
part3D.move(size).turn(p).tilt(1-p/20);
yield* sleep(50);
yield* drawTree(part3D, (0.7+p/40)*size);
}
}
}
function* growLeaf(stem3D) {
var leaf3D = pen3D.drawLeaf(stem3D);
for (var s=0;s++<15;) {yield* sleep(100); leaf3D.scale.multiplyScalar(1.1)}
yield* sleep( 1000 + 9000*Math.random() );
for (var c=0;c++<30;) {yield* sleep(200); leaf3D.skin.color.setRGB(c/30, 1-c/40, 0)}
for (var m=0;m++<90;) {yield* sleep( 50); leaf3D.turn(0.4).tilt(0.3).move(2)}
leaf3D.visible = false;
}
///////////////////////////////////////////////////////////////////////
function setup3D() {
var scene, camera, renderer, diretionalLight, pen3D;
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(75, 
window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.set(0, 15, 20);
renderer = new THREE.WebGLRenderer({ alpha: true, antialias: true });
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
directionalLight = new THREE.DirectionalLight(0xffffaa, 0.7);
directionalLight.position.set(-1, 2, 1);
scene.add(directionalLight);
scene.add(new THREE.AmbientLight(0x9999ff));
(function render() {
requestAnimationFrame(render);
//renderer.setSize( window.innerWidth, window.innerHeight );
scene.rotateY(10/60/60);
renderer.render(scene, camera);
})();
window.addEventListener(
'resize',
function(){
renderer.setSize( window.innerWidth, window.innerHeight );
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
}, 
false
);
pen3D = {
drawTrunk: function(root, size) {
//root.skin = skin(0.5, 0.3, 0.2);
root.add(new THREE.Mesh(new THREE.CylinderGeometry(size/12, size/10, size, 16), 
root.skin).translateY(size/2));
root.add(new THREE.Mesh(new THREE.SphereGeometry(size/12, 16), 
root.skin).translateY(size));
return root;
},
drawLeaf: function(stem) {
stem.skin.color.setRGB(0, 1, 0);
stem.add(new THREE.Mesh(new THREE.CylinderGeometry(0, 0.02, 0.6), 
stem.skin) .rotateX(0.3).translateY(0.3));
stem.add(new THREE.Mesh(new THREE.CircleGeometry(0.2), 
stem.skin) .rotateX(0.3).translateY(0.4));
return stem;
},
Thing: function() {
THREE.Object3D.call(this);
this.skin = new THREE.MeshLambertMaterial({
color: new THREE.Color(0.5, 0.3, 0.2),
vertexColors: THREE.FaceColors,
side: THREE.DoubleSide
})
}
};
pen3D.Thing.prototype = Object.create(THREE.Object3D.prototype);
pen3D.Thing.prototype.tilt = pen3D.Thing.prototype.rotateX;
pen3D.Thing.prototype.turn = pen3D.Thing.prototype.rotateY;
pen3D.Thing.prototype.move = pen3D.Thing.prototype.translateY;
pen3D.center = new pen3D.Thing;
scene.add(pen3D.center);
return pen3D;
}

HTML:

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r71/three.min.js"></script>

La 3D est caché à l'intérieur setup3D() et est fourni uniquement pour le rendre moins ennuyeux que de la console.log(). Les anges sont mesurés en radians par la voie.

Testé pour fonctionner dans les navigateurs Firefox et Chrome. Pas implémenté dans Internet Explorer et iOS (ipad). Essayez d'exécuter vous-même.

Après un autre passage de réponses que j'ai trouvé, que Gabriel Ratener fait la même réponse il y a un an: https://stackoverflow.com/a/24401317/5032384

Si vous avez droit une fonction de veille comme ce

var sleep = function(period, decision, callback){
var interval = setInterval(function(){
if (decision()) {
interval = clearInterval(interval);
callback();
}
}, period);
}

et vous avez un asynchrones fonction à appeler plusieurs fois

var xhr = function(url, callback){
//make ajax request
//call callback when request fulfills
}

Et vous l'installation de votre projet comme celui-ci:

var ready = false;
function xhr1(){
xhr(url1, function(){ ready = true;});  
}
function xhr2(){
xhr(url2, function(){ ready = true; }); 
}
function xhr3(){
xhr(url3, function(){ ready = true; }); 
}

Ensuite, vous pouvez faire ceci:

xhr1();
sleep(100, function(){ return done; }, xhr2);
sleep(100, function(){ return done; }, xhr3);
sleep(100, function(){ return done; }, function(){
//do more
});

Au lieu d'infinies de rappel de l'indentation comme ceci:

xhr(url1, function(){
xhr2(url2, function(){
xhr3(url3, function(){
//do more
});
});
});

Code à partir de ce lien ne gèlera pas comp. Mais il ne fonctionne que sur ff.

/**
* Netscape compatible WaitForDelay function.
* You can use it as an alternative to Thread.Sleep() in any major programming language
* that support it while JavaScript it self doesn't have any built-in function to do such a thing.
* parameters:
* (Number) delay in millisecond
*/
function nsWaitForDelay(delay) {
/**
* Just uncomment this code if you're building an extention for Firefox.
* Since FF3, we'll have to ask for user permission to execute XPCOM objects.
*/
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
//Get the current thread.
var thread = Components.classes["@mozilla.org/thread-manager;1"].getService(Components.interfaces.nsIThreadManager).currentThread;
//Create an inner property to be used later as a notifier.
this.delayed = true;
/* Call JavaScript setTimeout function
* to execute this.delayed = false
* after it finish.
*/
setTimeout("this.delayed = false;", delay);
/**
* Keep looping until this.delayed = false
*/
while (this.delayed) {
/**
* This code will not freeze your browser as it's documented in here:
* https://developer.mozilla.org/en/Code_snippets/Threads#Waiting_for_a_background_task_to_complete
*/
thread.processNextEvent(true);
}
}

Ce n'est vraiment pas une bonne idée, de faire quelque chose comme cela serait la cause de la totalité de la page à geler pendant que le système attendu pour votre fonction de retour.

Embrasser le système de la nature de javascript!

Toutes les suivantes seront de retour immédiatement, mais ont un seul lieu de mettre le code que vous voulez courir après quelque chose qui s'est passé.

Les méthodes que j'ai décrites ici sont tous à différents cas d'utilisation et sont grossièrement classés en fonction de leur complexité.

Les différentes choses sont comme suit:

• De l'attente d'une condition pour devenir de véritables
• D'attente pour un ensemble de méthodes pour finir (dans n'importe quel ordre) avant d'appeler un simple rappel
• L'exécution d'une série d'un système de méthodes avec un état partagé dans un ordre particulier avant d'appeler un rappel

Attendre

En attendant de voir si une certaine condition est vrai, c'est usedful où il n'est pas accessible de rappel pour vous dire quand quelque chose a fini de s'exécuter.

C'est une jolie mise en œuvre de base qui suppose que la condition devienne vraie à un certain point. Avec un peu de bricolage, il pourrait être élargi afin d'être encore plus utiles (par exemple par la fixation d'un appel de limite). (J'ai seulement écrit ce un hier!)

function waitFor(predicate, successCallback) {
setTimeout(function () {
var result = predicate();
if (result !== undefined)
successCallback(result);
else
waitFor(predicate, successCallback);
}, 100);
}

code d'appel:

    beforeEach(function (done) {
selectListField('A field');
waitFor(function () {
var availableOptions = stores.scrapeStore(optionStore);
if (availableOptions.length !== 0)
return availableOptions;
}, done);
});

Ici, je vais appeler quelque chose qui charge un extjs "stocker" et attendre jusqu'à ce que le magasin contient quelque chose avant de continuer (la beforeEach est un jasmin framework de test de chose).

Attendre plusieurs choses à terminer

Une autre chose que j'avais à faire était d'utiliser un seul rappel après une charge de différentes méthodes fini. Vous pouvez le faire comme ceci:

createWaitRunner = function (completionCallback) {
var callback = completionCallback;
var completionRecord = [];
var elements = 0;
function maybeFinish() {
var done = completionRecord.every(function (element) {
return element === true
});
if (done)
callback();
}
return {
getNotifier: function (func) {
func = func || function (){};
var index = elements++;
completionRecord[index] = false;
return function () {
func.applyTo(arguments);
completionRecord[index] = true;
maybeFinish();
}
}
}
};

code d'appel:

    var waiter = createWaitRunner(done);
filterList.bindStore = waiter.getNotifier();
includeGrid.reconfigure = waiter.getNotifier(function (store) {
includeStore = store;
});
excludeGrid.reconfigure = waiter.getNotifier(function (store) {
excludeStore = store;
});

Vous avez juste à attendre pour les notifications ou peut encapsuler également d'autres fonctions qui utilisent les valeurs passées à la fonction. Lorsque toutes les méthodes sont appelés alors done sera exécuté.

Cours d'exécution asynchrone et les méthodes d'

J'ai utilisé une approche différente lorsque j'ai eu une série de méthodes asynchrones à appeler dans une rangée (de nouveau dans les tests). C'est un peu comme quelque chose que vous pouvez obtenir dans la bibliothèque Asynchrone de la série est d'environ la même chose et j'ai eu un peu de lecture de la bibliothèque d'abord pour voir si il fait ce que je voulais. Je pense que le mien a une belle api pour travailler avec des tests (+ c'était amusant de le mettre en œuvre!).

//provides a context for running asyncronous methods syncronously
//the context just provides a way of sharing bits of state
//use run to execute the methods.  These should be methods that take a callback and optionally the context as arguments
//note the callback is provided first so you have the option of just partially applying your function to the arguments you want
//instead of having to wrap even simple functions in another function
//when adding steps you can supply either just a function or a variable name and a function
//if you supply a variable name then the output of the function (which should be passed into the callback) will be written to the context
createSynchronisedRunner = function (doneFunction) {
var context = {};
var currentPosition = 0;
var steps = [];
//this is the loop. it is triggered again when each method finishes
var runNext = function () {
var step = steps[currentPosition];
step.func.call(null,
function (output) {
step.outputHandler(output);
currentPosition++;
if (currentPosition === steps.length)
return;
runNext();
}, context);
};
var api = {};
api.addStep = function (firstArg, secondArg) {
var assignOutput;
var func;
//overloads
if (secondArg === undefined) {
assignOutput = function () {
};
func = firstArg;
}
else {
var propertyName = firstArg;
assignOutput = function (output) {
context[propertyName] = output;
};
func = secondArg;
}
steps.push({
func: func,
outputHandler: assignOutput
});
};
api.run = function (completedAllCallback) {
completedAllCallback = completedAllCallback || function(){};
var lastStep = steps[steps.length - 1];
var currentHandler = lastStep.outputHandler;
lastStep.outputHandler = function (output) {
currentHandler(output);
completedAllCallback(context);
doneFunction();
};
runNext();
};
//this is to support more flexible use where you use a done function in a different scope to initialisation
//eg the done of a test but create in a beforeEach
api.setDoneCallback = function (done) {
doneFunction = done;
};
return api;
};

code d'appel:

beforeAll(function (done) {
var runner = createSynchronisedRunner(done);
runner.addStep('attachmentInformation', testEventService.getAttachmentCalled.partiallyApplyTo('cat eating lots of memory.jpg'));
runner.addStep('attachment', getAttachment.partiallyApplyTo("cat eating lots of memory.jpg"));
runner.addStep('noAttachment', getAttachment.partiallyApplyTo("somethingElse.jpg"));
runner.run(function (context) {
attachment = context.attachment;
noAttachment = context.noAttachment;
});
});

PartiallyApplyTo ici est essentiellement une version renommée de Doug Crockford de la mise en œuvre de Curry. Beaucoup de choses que je suis en train de travailler avec prend un rappel que le dernier argument simple, les appels peuvent être fait de cette manière plutôt que d'avoir à envelopper le tout avec une touche func.

Nous espérons que certaines des idées, il pourrait être utile aux gens.

Essayez ce simple fonction javascript:

function sleep(milliseconds) {
var $return = false;
if (typeof importScripts == 'function') {
var sleep_xhr = function (milliseconds) {
try {
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://128.0.0.1:' + (Math.random() * 100000).toFixed(0) + '/', false);
xhr.timeout = milliseconds;
xhr.send();
} catch (E) {
//Nothing to do...
}
};
milliseconds = milliseconds | 0;
if (milliseconds > 0) {
var start = Date.now();
while (Date.now() < start + milliseconds) {
sleep_xhr((start + milliseconds) - Date.now());
}
$return = Date.now() - start;
}
}
return $return;
}

Remarque: Cette fonction ne fonctionne que sur web de travailleurs.

Une fonction de veille, à l'aide d'un appel synchrone de laisser l'OS le faire.
L'utilisation de n'importe quel OS commande de mise en veille vous le souhaitez. Il n'est pas occupé d'attente dans le sens de l'utilisation du temps CPU.

J'ai choisi de ping sur un inexistant adresse.

const cp = require('child_process');
function sleep(ms)
{ 
try{cp.execSync('ping 192.0.2.0 -n 1 -w '+ms);}
catch(err){}
}

Un test pour vérifier qu'elle fonctionne

console.log(Date.now());
console.log(Date.now());
sleep(10000);
console.log(Date.now());
console.log(Date.now());

Et certains résultats de tests.

1491575275136
1491575275157

(et au bout de 10 secondes)

1491575285075
1491575285076

JS:

  await new Promise(resolve => setTimeout(resolve, 2000));

assurez-vous que votre fonction d'appel est asynchrone

vérifié et à travailler à

Si vous voulez dormir une fonction anonyme comme celui que vous avez créé en tant que gestionnaire, je recommande ce qui suit:

function()
{
if (!wait_condition)
{
setTimeout(arguments.callee, 100, /*comma-separated arguments here*/);
}
//rest of function
}

Ce code dit "Si la condition d'attente n'a pas encore été satisfaits, appeler cette fonction à nouveau avec ces arguments." J'ai utilisé cette méthode pour passer dans les mêmes arguments à ma gestionnaires, le rendant de ce code, un non-interrogation sleep() (qui ne fonctionne qu'au début de votre fonction).

Il y a une nouvelle bibliothèque proprement chaînes de fonctions en collaboration avec des délais d'attente de sorte que vous pouvez éviter de rappel de l'enfer.

Sequencr.js

Transforme ce:

setTimeout(function(timeout){
function1();
setTimeout(function(timeout){
function2();
setTimeout(function(timeout){
function3();
}, timeout, timeout)
}, timeout, timeout)
}, 10, 10);

dans cette:

Sequencr.chain([function1, function2, function3], 10);

Et a un support intégré pour les boucles qui "veille" entre chaque itération.

2019 mise à Jour à l'aide de Atomics.attendre

Devraient travailler en Nœud 9.3 ou plus.

J'avais besoin d'un assez précis de la minuterie dans Node.js et il fonctionne très bien pour cela.
Cependant, il semble qu'il y est extrêmement limité de support dans les navigateurs.

JS:

let ms = 10000;
Atomics.wait(new Int32Array(new SharedArrayBuffer(4)), 0, 0, ms);

A couru quelques 10 secondes de la minuterie de repères.

Avec setTimeout j'obtiens une erreur allant jusqu'à 7000 microsecondes. (7ms)

Avec Atomics mon erreur semble rester moins de 600 microsecondes. (0.6 ms)

- Je utiliser le multithread HTML5 Travailleur qui sera en mesure d'interrompre une synchrones XMLHttpRequest pointant vers un qui ne répond pas de l'URL. Ce n'est pas de bloquer le navigateur.

https://gist.github.com/el-gringo/6990785

Pour résumer (comme il a été dit dans les réponses précédentes):

Il n'est pas intégré dans le sommeil de la fonction en JavaScript. Vous devez utiliser setTimeout ou setInterval pour obtenir un effet similaire.

Si tu le voulais vraiment, vous pouvez simuler la fonctionnalité de veille avec une boucle for comme montré dans la question d'origine, mais ce serait faire de votre CPU à travailler comme un fou. À l'intérieur d'un Web Worker une solution alternative serait de faire un synchrones XMLHttpRequest à un non-réactif IP et définir un bon délai. Cela permettrait d'éviter l'utilisation de l'UC problème. Voici un exemple de code:

JS:

//Works only inside a web worker
function sleep(milliseconds) {
var req = new XMLHttpRequest();
req.open("GET", "http://192.0.2.0/", false);
req.timeout = milliseconds;
try {
req.send();
} catch (ex) {
}
}
console.log('Sleeping for 1 second...');
sleep(1000);
console.log('Slept!');
console.log('Sleeping for 5 seconds...')
sleep(5000);
console.log('Slept!');

Si vous vraiment souhaitez mettre en pause un script, vous pouvez le faire:

var milliseconds;
var pretime;
var stage;
function step(time){
switch(stage){
case 0:
//Code before the pause
pretime=time;
milliseconds=XXX;
stage=1;
break;
case 1:
//Code that is looped through while paused
if(time-pretime >= milliseconds){
//Code after the pause
pretime=time;
milliseconds=XXX;
stage=2;
}
break;
case 2:
//Code that is looped through while paused
if(time-pretime >= milliseconds){
//Code after the pause
pretime=time;
milliseconds=XXX;
stage=3;
}
break;
case 3:
//Etc...
}
Window.requestAnimationFrame(step)
}
step();

C'est probablement exactement ce que vous voulez si vous utilisez une boucle de toute façon, et vous pouvez modifier d'une manière de sorte que vous avez un pseudo-multi-threading, où vous avez quelques fonctions un peu de temps et les autres fonctionnent normalement. J'en utilise tout le temps pour les pur-JS jeux.