Javascript: nombre Aléatoire de 5, pas de répétition jusqu'à ce que toutes ont été utilisés

Je suis en utilisant le code ci-dessous pour attribuer une classe aléatoires (sur cinq) de chaque image sur ma page.

$(this).addClass('color-' + (Math.floor(Math.random() * 5) + 1));

C'est vraiment génial de travailler, mais je veux faire en sorte qu'il n'y a jamais deux fois la même classe dans une rangée.

Serait encore mieux si il n'y a jamais deux fois le même dans une rangée, et il l'a fait aussi de ne pas utiliser n'importe quelle classe plus d'une fois jusqu'à ce que tous les 5 avait été utilisé... Comme dans, retirez chaque classe à partir de la matrice jusqu'à ce que tous d'entre eux ont été utilisés, puis recommencer, ne permettant pas la dernière des 5 et le premier des 5 prochaines à être de la même couleur.

L'espoir qui fait sens, et merci d'avance pour toute aide.

Créer une gamme de 1 à 5 et mélangez l'ensemble.

OriginalL'auteur user2860129 | 2013-10-14

  1. 19

    Vous avez besoin pour créer un tableau de valeurs possibles et à chaque fois que vous récupérez un hasard index à partir de la matrice d'utiliser l'une des valeurs, de vous retirer de la pile.

    Voici un objectif général de la fonction random qui ne sera pas répéter jusqu'à ce que toutes les valeurs ont été utilisées. Vous pouvez appeler cela et puis il suffit d'ajouter cet indice sur la fin de votre nom de classe.

    var uniqueRandoms = [];
var numRandoms = 5;
function makeUniqueRandom() {
    //refill the array if needed
    if (!uniqueRandoms.length) {
        for (var i = 0; i < numRandoms; i++) {
            uniqueRandoms.push(i);
        }
    }
    var index = Math.floor(Math.random() * uniqueRandoms.length);
    var val = uniqueRandoms[index];

    //now remove that value from the array
    uniqueRandoms.splice(index, 1);

    return val;

}

    De travail de démonstration: http://jsfiddle.net/jfriend00/H9bLH/

    Donc, votre code serait juste ceci:

    $(this).addClass('color-' + (makeUniqueRandom() + 1));

    Voici un orientée objet formulaire qui permettra à plus d'un de ces à être utilisé dans des endroits différents dans votre application:

    //if only one argument is passed, it will assume that is the high
//limit and the low limit will be set to zero
//so you can use either r = new randomeGenerator(9);
//or r = new randomGenerator(0, 9);
function randomGenerator(low, high) {
    if (arguments.length < 2) {
        high = low;
        low = 0;
    }
    this.low = low;
    this.high = high;
    this.reset();
}

randomGenerator.prototype = {
    reset: function() {
        this.remaining = [];
        for (var i = this.low; i <= this.high; i++) {
            this.remaining.push(i);
        }
    },
    get: function() {
        if (!this.remaining.length) {
            this.reset();
        }
        var index = Math.floor(Math.random() * this.remaining.length);
        var val = this.remaining[index];
        this.remaining.splice(index, 1);
        return val;        
    }
}

    Exemple D'Utilisation:

    var r = new randomGenerator(1, 9);
var rand1 = r.get();
var rand2 = r.get();

    De travail de démonstration: http://jsfiddle.net/jfriend00/q36Lk4hk/

    Si vous pouviez me montrer exactement comment le faire "appel", et "ajouter à l'index" pour le nom de la classe je vous serais éternellement reconnaissant. Je n'ai aucune expérience avec javascript, mais acheté un livre cette semaine et juste commencé aujourd'hui donc, je vais essayer de corriger cela. Merci encore, ce que vous avez posté est déjà très utile.
    J'ai ajouté à la fin.
    Une amélioration est de garder le tableau d'origine et en faire une copie pour l'épissage. Lorsque tous les membres ont été épissés, faire une autre copie (si nécessaire).
    pourquoi est-copie de plus simple que de créer un nouveau cas de besoin?
    Parce que l'original ne peut pas être simplement une séquence de chiffres, ou ont peu d'ordre comme "couleur1", de "couleur2", etc.

    OriginalL'auteur jfriend00

  2. 2

    Vous pouvez faire quelque chose comme ceci à l'aide d'un tableau et l' splice méthode:

    var classes = ["color-1", "color-2", "color-3", "color-4", "color-5"];
for(i = 0;i < 5; i++){
  var randomPosition = Math.floor(Math.random() * classes.length);
  var selected = classes.splice(randomPosition,1);
  console.log(selected);
  alert(selected);
}

    OriginalL'auteur Johann Echavarria

  3. 1
    var used = [];
var range = [0, 5];

var generateColors = (function() {
    var current;
    for ( var i = range[0]; i < range[5]; i++ ) {

        while ( used.indexOf(current = (Math.floor(Math.random() * 5) + 1)) != -1 ) ;
        used.push(current);
        $("   SELECTOR     ").addClass('color-' + current);
    }
});

    OriginalL'auteur Deepsy

  4. 1

    Juste pour expliquer mon commentaire à jfriend00 excellente réponse, vous pouvez avoir une fonction qui renvoie les membres d'un ensemble dans un ordre aléatoire jusqu'à ce que tous ont été retournés, puis recommence, par exemple:

    function RandomList(list) {
  var original = list;
  this.getOriginal = function() {
    return original;
  }
}

RandomList.prototype.getRandom = function() {
  if (!(this.remainder && this.remainder.length)) {
    this.remainder = this.getOriginal().slice();
  }
  return this.remainder.splice(Math.random() * this.remainder.length | 0,1);
}

var list = new RandomList([1,2,3]);

list.getRandom(); //returns a random member of list without repeating until all
                  //members have been returned.

    Si la liste peut être codé en dur, vous pouvez garder l'original dans une fermeture, par exemple

    var randomItem = (function() {
  var original = [1,2,3];
  var remainder;
  return function() {
    if (!(remainder && remainder.length)) {
      remainder = original.slice();
    }
    return remainder.splice(Math.random() * remainder.length | 0, 1);
  };
}());

    OriginalL'auteur RobG