Javascript settimeout la récursivité

J'ai juste commencé à regarder javascript donc j'espère que ce sera quelque chose de simple. Je veux faire un diaporama d'images qui joue automatiquement. C'est très simple, et il y a quelques tutoriels sur elle, mais pour une raison que je n'ai pas été en mesure de l'obtenir pour fonctionner. C'est ce que j'ai:

var image1 = new Image();
var image2 = new Image(); 
var image3 = new Image();
image1.src = "images/website6.jpg";
image2.src = "images/website7.jpg";
image3.src = "images/sunset.jpg";
var images = new Array(
  "images/website6.jpg",
  "images/website7.jpg",
  "images/sunset.jpg"
);
setTimeout("delay(images,0)",2000);
function delay(arr,num){
  document.slide.src = arr[num % 3];
  var number = num + 1;
  setTimeout("delay(arr,number)",1000);
}

L'image que je suis en train de changer a l'id de la diapositive. Et j'ai aussi des preuves que cela fonctionne. Ce qui se passe est la première image se charge. Ensuite, la deuxième image charges (ce qui signifie que l'origine setTimeout appel doit être de travail). Puis rien ne se passe. Ce qui me suggère que c'est la récursivité qui ne fonctionne pas.

Je suis très familier avec la récursivité dans d'autres langues, donc je pense que ça doit juste être une syntaxe chose ou quelque chose, mais je n'arrive pas à le comprendre. Merci pour toute aide.

"les paramètres dans le deuxième setTimeout. que serait ma première estimation.
fait intéressant, si je fais ce que je ne comprends pas la deuxième image... ce qui suggère qu'est ce que c'est de faire le changement d'image une fois. Aussi, tous les exemples que j'ai vu a des guillemets, c'est pourquoi je les ai mis dans.
Le problème avec citant les variables il n'y a que la minuterie est en cours d'exécution de la chaîne complète "delay(arr,number)", plutôt que de convertir les variables à leurs valeurs mémorisées - c'est pourquoi unquoting il serait le travail (même si vous souhaitez toujours besoin de les citer comme si.... "delay('" + arr + "', '" + number + "'). Cependant, point discutable - Pointu, la réponse est mieux. Je suis simplement expliquer ce qui se passe.

OriginalL'auteur Paul | 2011-04-05

  1. 20

    Le problème est que lorsque vous passez dans des chaînes d'être évalué pour la setTimeout appel, l'évaluation sera faite (plus tard, quand il est temps de feu) dans le contexte mondial. Ainsi, vous êtes bien mieux (pour beaucoup d'autres raisons) en passant dans les fonctions réelles:

    setTimeout(function() { delay(images, 0); }, 2000);

function delay(arr, num) {
  document.slide.src = arr[num % 3];
  setTimeout(function() { delay(arr, num + 1); }, 1000);
}

    En plus les navigateurs modernes, vous pouvez utiliser le .bind() méthode pour les fonctions pour créer une fonction de pré-lié à quelque chose pour être utilisé comme this:

    setTimeout(delay.bind({arr: images, num: 0}), 2000);

function delay() {
  document.slide.src = this.arr[this.num % 3];
  setTimeout(delay.bind({arr: this.arr, num: this.num + 1}), 1000);
}

    Six de la, une demi-douzaine de l'autre, mais juste un exemple qui montre qu'il existe de multiples façons de faire les choses.

    Génial, ça fonctionne maintenant. Je suis encore un peu confus quant à pourquoi mon code ne fonctionne pas bien. Vous dites qu'il est évalué à "plus tard, quand il est temps de feu". Quand exactement est-ce, et pourquoi n'est-il jamais atteindre la partie? Et aussi pourquoi le fait d'utiliser une fonction anonyme changer cela? Si il y a du bon la documentation qui traite ce alors, j'apprécierais un lien. Merci.
    Le problème est que la chaîne de caractères, "de retard(arr,nombre)", doit être en mesure d'obtenir sur les variables "arr" et "nombre" pour qu'elle ait un sens. En raison de la façon dont la chaîne "eval()" fonctionne (et maintenant que j'y pense, il n'a pas d'importance si c'est au moment de l'appel de setTimeout ou plus tard), il est fait dans un contexte autre que le délai de votre fonction elle-même; c'est juste la façon dont le langage fonctionne.
    Lorsque vous utilisez un réel la fonction, l'interprétation de la fonction des moyens qui se passe dans la portée réelle de l'appel à "setTimeout()". Que la fonction ont accès aux variables locales il y a, à nouveau en raison de la façon JavaScript fonctionne.
    Je pense que la première version, en utilisant les fermetures est mieux dans ce cas. Il évite de se lier, qui introduit un terme supplémentaire (ce) dans le code. Et depuis setTimeout est appelée à partir de l'intérieur de delay(), il n'est pas nécessaire pour le premier appel de setTimeout, il suffit d'appeler delay() et peut-être changer de façon répétée des setTimeouts à un seul setInterval.
    oui je suis d'accord, mais je l'ai inclus uniquement pour des raisons pédagogiques 🙂

    OriginalL'auteur Pointy

  2. 2

    Je serais très méfiant de la deuxième setTimeout appel. Je voudrais le rendre plus clair à l'aide d'une fonction explicite vs une expression de chaîne

    setTimeout(function() { delay(arr, number); }, 1000);

    OriginalL'auteur JaredPar