Duda con shuffle

[CamilaPerez]

Hola a todos en el foro:

Bueno, soy nueva por aquí y me gustaría pedirles ayuda, estoy aprendiendo javascript y quiero hacerle un shuffle a un array para después asignar cada valor que me dé a una variable, si es que es posible, pero he buscado y no he encontrado claramente como funcionan los parámetros del shuffle, agradecería si me pueden dar un ejemplo de como funciona por favor .

Saludos

Camila

[emprear]

En primer lugar, bienvenida a FDW @CamilaPerez
Hace poco estuvimos tratando eso por aqui y por aqui

Saludos

[CamilaPerez]

Hola emprear:

Gracias por contestar, estuve mirando los enlaces que me dejaste, y no encontré algún ejemplo claro de shuffle, la verdad no entiendo como funciona muy bien, por ejemplo, llegué a este enlace de otro tema:http://www.pepemolina.com/arrays/index.php, funciona muy bien, desordena el array, pero no comprendo eso de los dos parámetros, qué hace cada uno?

Saludos

Camila

[furoya]

Esa página de caricatos es muy buena. Aunque la mayoría de los inventos que hay ahí ya se incorporaron a todos los navegadores, el shuffle aún no es nativo de javascript. Hay que crearlo.

Hay varias formas, y en ese sitio se muestra una inventada por un caradura que no tenía nada mejor que hacer y se puso a escribir prototype's como si supiera.

Esos campos para parámetros no se usan en el shuffle. Están para otros métodos.
Con hacer un click, ves en un mensaje de alerta la lista de números ordenada, y desordenada al azar.

Todo eso viene de aquí

Manipular array

pero te recomiendo que leas desde el comienzo, porque así ves cómo fueron evolucionando todos los métodos.

[CamilaPerez]

Hola furoya:

Gracias por contestar, ahora me doy cuenta de que tú creaste ese método , que alegría hablar con el mismo creador , te agradezco haberme sacado la duda de esos parámetros, ahora probé lo que dijiste y me dí cuenta de que no son para el shuffle, voy a leer todo ese tema desde el comienzo para aprender, muchas gracias.

Saludos.

Camila.

[furoya]

Gracias por el "+1".

Recién me fijo que justo debajo del shuffle de este delincuente (servidor), en la lista hay otro que hace el mismo resultado, pero creado por alguien que sabe.
Aclaro para que no haya malos entendidos.

Y otro dato más, quizá innecesario, es que si vas a cambiar el array por valores literales, no olvidés que van entre comillas. P.E.

"alfa", "bravo", "charly", "delta", "eco"

¿Puedo preguntar para qué lo vas a usar?

Resulta que en uno de los enlaces que te puso el amigo emprear es muy probable que se agregue un ejemplo para pasar listas de baners. O alguna otra cosa parecida, a modo de ejemplo para estudiar.

Podés suscribirte al tema de IsaBelM para que el Foro te avise por email cuando le posteamos algo.

Saludos
furoya

[emprear]

@CamilaPerez
Sería bueno saber que uso le vas a dar, ya que los ejemplos que venimos tratando se complican porque se aplican al uso de un banner rotatorio, en caso de que el shuffle ó mezcla al azar sin repetir deba producirse tan solo una vez, el primer link que dejé en el post anterior puede ser la respuesta
Lo que se desarrolló posteriormente es un poco más complejo, si estás comenzando con js lo ideal es entender el primer caso.


Saludos

[CamilaPerez]

Iniciado por furoya

Gracias por el "+1".

Recién me fijo que justo debajo del shuffle de este delincuente (servidor), en la lista hay otro que hace el mismo resultado, pero creado por alguien que sabe.
Aclaro para que no haya malos entendidos.

Y otro dato más, quizá innecesario, es que si vas a cambiar el array por valores literales, no olvidés que van entre comillas. P.E.

"alfa", "bravo", "charly", "delta", "eco"

¿Puedo preguntar para qué lo vas a usar?

Resulta que en uno de los enlaces que te puso el amigo emprear es muy probable que se agregue un ejemplo para pasar listas de baners. O alguna otra cosa parecida, a modo de ejemplo para estudiar.

Podés suscribirte al tema de IsaBelM para que el Foro te avise por email cuando le posteamos algo.

Saludos
furoya

Hola furoya:

Revisaré el script de la página de caricatos, el que está abajo, aunque creo que tú también sabes , gracias por el dato, verás, yo cantaba por hobbie antes en un grupo de música y ahora queremos hacerlo más serio, ir a eventos y cosas así, por eso quiero hacer una página web, algo me manejaba en html así que por eso quiero aprender javascript, estuve revisando los enlaces de emprear, especialmente el primero, ese de jlx4, quizás me podría servir mmmmmm, lo que necesito hacer es que cuando entren a mi página se cambien al azar las fotos de los discos que estamos preparando, y ojalá quiero tratar de hacer algo así como un carusel de acuerdo al resultado del shuffle, sería bonito, pero no sé si me saldría, el ejemplo aleatorio de esos banners encuentro que sería quizás más engorroso porque tendría que cargar 4 imágenes aleatorias, encuentro que un shuffle sería más simple y menos engorroso, encuentran que estoy en lo cierto o no?

Saludos

Camila

Iniciado por emprear

@CamilaPerez
Sería bueno saber que uso le vas a dar, ya que los ejemplos que venimos tratando se complican porque se aplican al uso de un banner rotatorio, en caso de que el shuffle ó mezcla al azar sin repetir deba producirse tan solo una vez, el primer link que dejé en el post anterior puede ser la respuesta
Lo que se desarrolló posteriormente es un poco más complejo, si estás comenzando con js lo ideal es entender el primer caso.


Saludos

Hola emprear:

Como furoya igual me preguntó lo que necesitaba hacer no lo pondré de nuevo, sería innecesario , Me he dado cuenta de que últimamente hay hartos temas parecidos al que yo pregunté, debe ser algo astrológico, pero espero no aburrirlos con el tema.

Saludos

Camila

[marlanga]

En su día busqué la función mas eficiente para mezclar array, y tras una ardua búsqueda en la internet, me encontré con éste:

Código Javascript:

Array.prototype.mezclar= function() {
    var n=this.length;
    while(n--)
    {
        var i=Math.floor(n*Math.random());
        var tmp =this[i];
        this[i]=this[n];
        this[n]=tmp;
    }
    return this;
}
 
 
//Luego donde quieras
var miArray=["aaaaaaa","bbbbbbbbbbb","ccccccccccc","ddddddddddd"];
miArray.mezclar();
 

Más simple que el funcionamiento de un botijo, pero 100% rápido y fiable.

[CamilaPerez]

Iniciado por marlanga

En su día busqué la función mas eficiente para mezclar array, y tras una ardua búsqueda en la internet, me encontré con éste:

Código Javascript:

Array.prototype.mezclar= function() {
    var n=this.length;
    while(n--)
    {
        var i=Math.floor(n*Math.random());
        var tmp =this[i];
        this[i]=this[n];
        this[n]=tmp;
    }
    return this;
}
 
 
//Luego donde quieras
var miArray=["aaaaaaa","bbbbbbbbbbb","ccccccccccc","ddddddddddd"];
miArray.mezclar();
 

Más simple que el funcionamiento de un botijo, pero 100% rápido y fiable.

Hola marlanga:

Muchas gracias, lo voy a adaptar a lo que necesito, es un script muy simple y asombroso .

Saludos.

Camila

[jlx4]

Hola a todos:

Disculpen la pregunta, pero, prototype es una especie de librería que se debe descargar para poder usar ese método de shuffle?

Gracias, saludos.

[zerokilled]

¡buenas!

@jlx4. no, en este caso no. pese a que existe un framework llamado prototype, en javascript existe el concepto de prototipos, el cual es como una modalidad en que se estructura los objetos dentro del paradigma orientado a objeto. el punto es que en javascript se utiliza el keyword prototype para utilizar este aspecto del lenguaje. le recomiendo que lea el artículo de la wiki, de ser posible la versión en inglés.

[jlx4]

Iniciado por zerokilled

¡buenas!

@jlx4. no, en este caso no. pese a que existe un framework llamado prototype, en javascript existe el concepto de prototipos, el cual es como una modalidad en que se estructura los objetos dentro del paradigma orientado a objeto. el punto es que en javascript se utiliza el keyword prototype para utilizar este aspecto del lenguaje. le recomiendo que lea el artículo de la wiki, de ser posible la versión en inglés.

Hola zerokilled:

Gracias por sacarme de esa duda, la verdad estaba un poco confundido.

Saludos.

[IsaBelM]

Iniciado por marlanga

Más simple que el funcionamiento de un botijo, pero 100% rápido y fiable.

en qué te basas para decir eso?? mas elegante sí, fiable sí, pero rápido, .... veamoslo

Código:

var miArray1=["aaaaaaa","bbbbbbbbbbb","ccccccccccc","ddddddddddd"];
var miArray2=["aaaaaaa","bbbbbbbbbbb","ccccccccccc","ddddddddddd"];
var miArray3=["aaaaaaa","bbbbbbbbbbb","ccccccccccc","ddddddddddd"];




// MARLANGA

Array.prototype.mezclar= function() {
var ini = new Date().getTime();
    var n=this.length;
    while(n--)
    {
        var i=Math.floor(n*Math.random());
        var tmp =this[i];
        this[i]=this[n];
        this[n]=tmp;

    }
var fin = new Date().getTime();
var diff = fin - ini;
    return this + ' - ' + diff;
}
 
console.log(miArray1.mezclar());





// EMPREAR

var mezclar2 = function(arr){
var ini = new Date().getTime();
for(var i, tmp, n = arr.length; n; i = Math.floor(Math.random() * n), tmp = arr[--n], arr[n] = arr[i], arr[i] = tmp);
var fin = new Date().getTime();
var diff = fin - ini;
return arr + ' - ' + diff;
}

console.log(mezclar2(miArray2));







// MEZCLA MARLANGA/EMPREAR

Array.prototype.mezclar3 = function(){
var ini = new Date().getTime();
for(var i, tmp, n = this.length; n--; i = Math.floor(Math.random() * n), tmp = this[i], this[i] = this[n], this[n] = tmp);
var fin = new Date().getTime();
var diff = fin - ini;
return this + ' - ' + diff;
}

console.log(miArray3.mezclar3());

en definitiva. fiables los 3, elegante el de marlanga, rápido en aquellos que se usa el ciclo for por 1 milisegundo

[marlanga]

Yo he dicho rápido. No el "más rápido". El algoritmo de Emprear, que no accede al prototipado del objeto array, será ligeramente más rápido (porque acceder al prototipo tiene un coste). Pero por contra, su algoritmo consume justo el doble de memoria RAM.

La versión mejorada, que utiliza el prototipado, es prácticamente igual a la mía; en vez de un while, utiliza un for. Asi que los tiempos de ejecución y consumo de memoria son los mismos.

Y vuelvo a reincidir. La mía no es obra mía. Es un algoritmo que tiene 80 años de probada eficacia y rapidez. Se sigue utilizando en todas partes:

http://en.wikipedia.org/wiki/Fisher%...3Yates_shuffle

[furoya]

Perdón, no quisiera meterme en su discusión; pero me parece que empezar con cuestiones tan técnicas en un post que es más de lograr un efecto, no es la mejor idea.
Por eso le preguntamos a la autora para qué lo quería, y si hay un par de temas ya linkeados donde seguro vamos a hacer algún desarrollo técnico (porque justamente están para muestra y desarme de código), quizá convenga agregar en ellos el asunto del shuffle y seguir arañando milésimas de segundo fuera de aquí.

Qué sé yo, pienso, se me ocurre ...



Gracias.

[marlanga]

A mi me encantan las discusiones, es donde más se aprende xd. Y ya que estoy logeado, aportaré otra valiosa lección que acabo de recordar:

Ninguno de los algoritmos de Emprear está bien equilibrado. Aparentemente parece que el array está desordenado. De acuerdo. Pero si ejecutas 1000 veces ese algoritmo con el mismo array, y comparas los resultados usando cálculos estadísticos (de los cuales yo no tengo ni idea), verás que su solución no es tan aleatorioa como parece.
Demostrarlo ya digo que es difícil, pero entender el por qué es mucho más sencillo.

La direrencia principal entre su algoritmo y el que yo he posteado es ésta:
MARLANGA usa para obtener un número al azar el nuevo índice, la variable n. Pero esa variable va decreciendo con cada vuelta del bucle. Emprear sin embargo usa siempre el length del array a mezclar.

¿Cuál es el problema?
Imaginemos que tenemos un array de 4 posiciones con elementos diferentes.
¿Cuántas combinaciones podemos crear? Sencillo:
C=4! = 4*3*2*1 = 24 combinaciones.
¿Y cómo funciona el algoritmo de marlanga? IGual. Primero genera al azar un número usando todas las posiciones de array (4). Luego, sólo de 3, despues de 2, y finalmente de 1. Asi que cubro todas las posibles combinaciones sin repetir ninguna.

Ahora veamos el algoritmo de Emprear. Él, usando el array de 4 posiciones, 4 vueltas de bucle. Y en cada vuelta, genera un número entre 4 posibilidades. Asi que en total, el número de combinaciones que genera su algoritmo es de 4^4 = 4 * 4 * 4 * 4 =256 posibilidades.

Y aquí viene el problema: 256 no es múltiplo de 24, asi que varias (8) de sus combinaciones tiene más posibilidades de aparecer que otras (16). La mezcla no está equilibrada.

Los cálculos:
256/24=10;
256 - (24*10) = 16
24-16=8

[jlx4]

Hola a todos:

Tengo una duda con respecto al shuffle y me gustaría pedirles si me la pueden resolver, se supone que lo que hace este método es desordenar una array y luego "arroja" el resultado, en este caso imágenes, pero qué pasaría si fueran muchas más imágenes, por ejemplo 500 imágenes, me imagino que al ser más imágenes se demoraría un poco más en desordenarlas todas, pero, (y aquí va mi duda), en ese caso, la primera imagen al azar no se mostraría hasta terminar de hacer todo el desorden del array, o se mostraría y al mismo tiempo seguiría desordenando lo que faltara de desordenar del array?

Saludos.

[zerokilled]

@jlx4... en javascript, la ejecucción es lineal. es decir, síncrono. lo que quiere decir es que la siguiente línea no se interpreta hasta que la anterior finalice. hay muy pocas cosas que son asíncrona, por ejemplo XMLHttpRequest puede funcionar en ambos modos.

[furoya]

Y en realidad no es siempre necesario mezclar antes de repartir. Se pueden ir extrayendo las imágenes de a una en forma aleatoria aunque el array siga ordenado.

[APORTE] rotador aleatorio sin repetición pocas imágenes #7

Y no estoy seguro, pero por acá deberías encontrar algún otro.

Creación código para poner 3 imágenes aleatoria

Si las imágenes están numeradas desde el nombre, hasta se puede evitar la carga del array. Con generar la serie de números es suficiente. Y eso es rápido.

[jlx4]

Iniciado por zerokilled

@jlx4... en javascript, la ejecucción es lineal. es decir, síncrono. lo que quiere decir es que la siguiente línea no se interpreta hasta que la anterior finalice. hay muy pocas cosas que son asíncrona, por ejemplo XMLHttpRequest puede funcionar en ambos modos.

Iniciado por furoya

Y en realidad no es siempre necesario mezclar antes de repartir. Se pueden ir extrayendo las imágenes de a una en forma aleatoria aunque el array siga ordenado.

[APORTE] rotador aleatorio sin repetición pocas imágenes #7

Y no estoy seguro, pero por acá deberías encontrar algún otro.

Creación código para poner 3 imágenes aleatoria

Si las imágenes están numeradas desde el nombre, hasta se puede evitar la carga del array. Con generar la serie de números es suficiente. Y eso es rápido.

Muchas gracias por las respuestas zerokilled, furoya, no había podido entrar antes al foro en un buen tiempo, .