Dudas con Array de Javascript(matriz y vector)

JuShTo

Hola buenas,

Estoy aprendiendo a programar javascript y no se me ocurre ninguna forma minimamente decente para comparar TODOS los valores de un array con un numero, y que si todos las posiciones tienen el mismo numero, haga algo.

Como me estoy leyendo y me he explicado con el culo mejor pongo un ejemplo.

Estoy haciendo un ahorcado y quiero que cuando se haya acertado todas las letras... me diga... HAS GANADO!!

El tema es que la unica solución que se me ocurre es una chapuza pues es con un if de la siguiente forma.

Basicamente en palabras sería...

Si todos los valores del array coinciden... muestrame un alert

	[code]if ( formu[0] == p1.charAt(0) && formu[1] == p1.charAt(1) && formu[2] == p1.charAt(2)  )
	{
		alert("El juego ha terminado porque has GANADO!!!")
	}[/code]

Y asi sucesivamente con todos los valores de un array.

Por si quereis revisarlo mi código entero es este:

<script type="text/javascript">

var w;
w= new Array(10);
w[0]="choverto";
w[1]="morlacos";
w[2]="mameluco";
w[3]="hijoputa";
w[4]="martukis";
w[5]="pelopopo";
w[6]="downdown";
w[7]="precioso";
w[8]="tuiteado";
w[9]="javasphp";
aleat=Math.random()*9;
aleat=Math.round(aleat);

function bordes(x, color)
{
    var bloquea=false;
    if(color=='2px solid green')
        {
            bloquea=true;
        }
    switch (x)
    {
        case 0:
        document.letter.l0.style.border = color;
        if(bloquea)
        document.letter.l0.disabled=true;
        break;
        case 1:
        document.letter.l1.style.border = color;
        if(bloquea)
        document.letter.l1.disabled=true;
        break;
        case 2:
        document.letter.l2.style.border = color;
        if(bloquea)
        document.letter.l2.disabled=true;
        break;
        case 3:
        document.letter.l3.style.border = color;
        if(bloquea)
        document.letter.l3.disabled=true;
        break;
        case 4:
        document.letter.l4.style.border = color;
        if(bloquea)
        document.letter.l4.disabled=true;
        break;
        case 5:
        document.letter.l5.style.border = color;
        if(bloquea)
        document.letter.l5.disabled=true;
        break;
        case 6:
        document.letter.l6.style.border = color;
        if(bloquea)
        document.letter.l6.disabled=true;
        break;
        case 7:
        document.letter.l7.style.border = color;
        if(bloquea)
        document.letter.l7.disabled=true;
        break;
    }
}

function comprobar()
{
	var formu;
    formu = new Array(8);
    formu[0]=document.letter.l0.value;
    formu[1]=document.letter.l1.value;
    formu[2]=document.letter.l2.value;
    formu[3]=document.letter.l3.value;
    formu[4]=document.letter.l4.value;
    formu[5]=document.letter.l5.value;
    formu[6]=document.letter.l6.value;
    formu[7]=document.letter.l7.value;
    var p1, p, yes;
    p1=w[aleat];
    p=0;
    var verde, rojo, amarillo;
    verde='2px solid green';
    rojo='2px solid red';
    amarillo='2px solid yellow';
    for (p=0;p<8;p++)
    {
		
        if ( formu[p] == p1.charAt(p) )
        {
            bordes(p, verde);
			document.letter.pepo.value = "Has acertado una letra, sigue así!"
        }
        else
        {
            var i;
            for (i=0, yes=false;i<8 && yes == false;i++)
            {
                if ( formu[p] == p1.charAt(i) )
                {
                    yes=true;
                    bordes(p, amarillo);
					document.letter.pepo.value = "Una de las letras está contenida en la palabra"
                }
                else 
                {
                    bordes(p, rojo);
                }
            }
        }
    }
	if ( document.papo.intentos.value <= 8 && document.papo.intentos.value > 1 )
	{
	document.papo.intentos.value--;
	} else
	{
		alert("Has agotado tus intentos...nPrueba de nuevo!");
		location.reload(true);
	}
	if ( formu[0] == p1.charAt(0) && formu[1] == p1.charAt(1) && formu[2] == p1.charAt(2)  )
	{
		alert("El juego ha terminado porque has GANADO!!!")
	}
}
zoeshadow

¿Y si haces un while con un contador que vaya comparando?
(Puede que tenga algún error de sintaxis )

cont = 0;
parar = false;
while ( !parar ){
    if ( array[cont] === LOQUESEA ){

}else{
       parar = true;
}
cont++;

// si termina es que todos son iguales a eso
2 respuestas
JuShTo

#2 Gracias por la idea y el código al final me quedo así.

		var cont, parar;
		cont=0;
		parar=false;
		while ( !parar ) 
		{
			if ( formu[cont] == p1.charAt(cont) )
			{
				cont++;
			}
			else
			{
				parar=true;
			}
			
	} 
	 			if ( cont == 8)
		{
			alert("Has ganado");
			location.reload(true);
		}
tada

#1 Yo hace poco hice un ahorcado.. tenia un array lleno de 'nulls' del tamaño de la palabra a buscar. Cuando acertabas ponias la letra en la posición. Para saber si se gana busco los nulls en el array con la siguiente función:

function buscar(arr,value){
	var c = 0;
	for(i=0;i<arr.length;i++){
		if(arr[i]==value) c++;
	}
	return c;
}

Si devuelve 0 es que has acertado la palabra, ya que no quedan 'nulls' en el arrray.

2 respuestas
JuShTo

#4 Ya entiendo la forma que lo has hecho lo que pasa que claro, mi ahorcado es completamente diferente y tendría que reconstruirlo entero creo xD.

Ya encontre la solución, gracias a ambos.

JuShTo

#2 y #4

¿Sabeis como hacer en javascript para que ignore si son mayusculas o minusculas?

En batch poniendo /I valía, aqui supongo que será bastante mas complicado xD.

1 respuesta
LzO

#6 Solo se me ocurre pasandolo todo a mayusculas (toUpperCase) o todo a minusculas (toLowerCase)...

Suponiendo que los datos del array esten en minusculas:

var cont, parar;
                cont=0;
                parar=false;
                while ( !parar ) 
                {
                        if ( formu[cont] == p1.charAt(cont).toLowerCase )
                        {
                                cont++;
                        }
                        else
                        {
                                parar=true;
                        }
                        
} if ( cont == 8) { alert("Has ganado"); location.reload(true); }
1 respuesta
JuShTo

#7
La verdad es que no me funciona, además creo que el toLowerCase debería ir en el array, pues el array son las letras que introduce el usuario.

Aún asi no me funciona.

            if ( formu[p].toLowerCase == p1.charAt(p) )
            {
                bordes(p, verde);
				document.letter.pepo.value = "Has acertado " + cont + " letra, sigue así!"
            }
            else
            {
                var i;
                for (i=0, yes=false;i<8 && yes == false;i++)
                {
                    if ( formu[p] == p1.charAt(i) )
                    {
                        yes=true;
                        bordes(p, amarillo);
						document.letter.pepo.value = "Una de las letras está contenida en la palabra"
                    }
                    else 
                    {
                        bordes(p, rojo);
                    }
                }
            }

EDIT:

Si que me funciona si, que es una función y hay que ponerle los parentesis. El tema es eso, que hay que ponerselo al array.

JuShTo

Bueno para los que me han echado un cable...

Al final recorrer todas las casillas y sumar el contador estaba tirado... de hecho lo había hecho mil veces dentro del script, simplemente era meterle un for porque con la manera de #2 sólo me contaba las letras, si los aciertos en el ahorcado iban por orden pero si acertabas las cuarta letra y no la primera no te contabilizaba nada.

Al final lo hice asi.

			for ( r=0; r<9;r++ )
			{
				if (formu[r] == p1.charAt(r) )
				{ 
				cont++;
				}
			}

Y mi código final, con html incluido(aunque muy gitano) es:

<html>
<head>
<style type="text/css">
body { padding:0px; margin:0px auto; }
#titulo {  display:block; margin:0px auto; text-align:center; background-color:lightblue; margin-top:100px; -moz-border-radius: 100px; -webkit-border-radius: 100px; padding-top:20px; padding-bottom:20px; font-size:20px; font-family:calibri; width:250px; border:1px solid pink }
#general {  width:1024; margin:0px auto; text-align:center; background-color:lightblue; border: 1px solid pink; margin-top:50px; -moz-border-radius: 100px; -webkit-border-radius: 100px; }
#ahorcado { width:1024; margin:0px auto; text-align:center; background-color:pink;  }
#top { height:26px; margin:0px auto; padding-top:10px; padding-bottom:10px;margin-bottom:30px; background-color:white; -moz-border-radius: 100px; -webkit-border-radius: 100px; width:200px;   box-shadow: 5px 5px 0 #999;-webkit-box-shadow: 5px 5px 0 #999; -moz-box-shadow: 5px 5px 0 #999; }
#top input { display:inline-block; padding:0px; maragin:0px }
#top input span { display:inline-block; padding:0px; maragin:0px }
.boton { border:1px solid pink; background-color:white }
textarea {resize: none }
#letras { padding-top:20px; }
#letras span { width: 200px; padding-top:10px;padding-bottom:10px;margin-bottom:20px; display:inline-block; font-family: calibri; background-color:white; -moz-border-radius:100px; -webkit-border-radius:100px; box-shadow: 5px 5px 0 #999;-moz-box-shadow: 5px 5px 0 #999;-webkit-box-shadow: 5px 5px 0 #999; }

</style>
<script type="text/javascript">

var w;
w= new Array(10);
w[0]="marroqui";
w[1]="morlacos";
w[2]="guisante";
w[3]="pensando";
w[4]="marcando";
w[5]="auriculo";
w[6]="camiseta";
w[7]="precioso";
w[8]="escarcha";
w[9]="monitora";
aleat=Math.random()*9;
aleat=Math.round(aleat);

function bordes(x, color)
{
    var bloquea=false;
    if(color=='2px solid green')
        {
            bloquea=true;
        }
    switch (x)
    {
        case 0:
        document.letter.l0.style.border = color;
        if(bloquea)
        document.letter.l0.disabled=true;
        break;
        case 1:
        document.letter.l1.style.border = color;
        if(bloquea)
        document.letter.l1.disabled=true;
        break;
        case 2:
        document.letter.l2.style.border = color;
        if(bloquea)
        document.letter.l2.disabled=true;
        break;
        case 3:
        document.letter.l3.style.border = color;
        if(bloquea)
        document.letter.l3.disabled=true;
        break;
        case 4:
        document.letter.l4.style.border = color;
        if(bloquea)
        document.letter.l4.disabled=true;
        break;
        case 5:
        document.letter.l5.style.border = color;
        if(bloquea)
        document.letter.l5.disabled=true;
        break;
        case 6:
        document.letter.l6.style.border = color;
        if(bloquea)
        document.letter.l6.disabled=true;
        break;
        case 7:
        document.letter.l7.style.border = color;
        if(bloquea)
        document.letter.l7.disabled=true;
        break;
    }
}

function comprobar()
{
	var formu;
    formu = new Array(8);
    formu[0]=document.letter.l0.value;
    formu[1]=document.letter.l1.value;
    formu[2]=document.letter.l2.value;
    formu[3]=document.letter.l3.value;
    formu[4]=document.letter.l4.value;
    formu[5]=document.letter.l5.value;
    formu[6]=document.letter.l6.value;
    formu[7]=document.letter.l7.value;
    var p1, p, yes;
    p1=w[aleat];
    p=0;
    var verde, rojo, amarillo,r;
    verde='2px solid green';
	r=0;
    rojo='2px solid red';
    amarillo='2px solid yellow';
	var cont, parar;
	parar=false;
	cont=0;

		for ( r=0; r<9;r++ )
		{
			if (formu[r] == p1.charAt(r) )
			{ 
			cont++;
			}
		}

	
    for (p=0;p<8;p++)
    {
		
        if ( formu[p] == p1.charAt(p) )
        {
            bordes(p, verde);
			document.letter.pepo.value = "Has acertado " + cont + " letras, sigue así!"
        }
        else
        {
            var i;
            for (i=0, yes=false;i<8 && yes == false;i++)
            {
                if ( formu[p] == p1.charAt(i) )
                {
                    yes=true;
                    bordes(p, amarillo);
					document.letter.pepo.value = "Has acertado " + cont + " letras, sigue así! \ny \nUna de las letras está contenida en la palabra"
                }
                else 
                {
                    bordes(p, rojo);
                }
            }
        }
    }
	if ( cont == 8)
		{
			if ( confirm("Has ganado!") )
			{
				location.reload(true);
			}

		}
	if ( document.papo.intentos.value <= 8 && document.papo.intentos.value > 1)
		{
			document.papo.intentos.value--;
		}
		 else
		{
				if ( cont < 8 )
			{
				alert("Has agotado tus intentos...\nPrueba de nuevo!");
				location.reload(true);
			}
		}
}
</script>
</head>
<body>
<div id="titulo">EL JUEGO DEL AHORCADO
</div>
<div id="general">

<div id="letras">
<span>LETRAS</span>
<form name="letter">
<input type="text" name="l0" value="" size="2"  maxlength="1">
<input type="text" name="l1" value="" size="2"  maxlength="1">
<input type="text" name="l2" value="" size="2"  maxlength="1">
<input type="text" name="l3" value="" size="2"  maxlength="1">
<input type="text" name="l4" value="" size="2"  maxlength="1">
<input type="text" name="l5" value="" size="2"  maxlength="1">
<input type="text" name="l6" value="" size="2"  maxlength="1">
<input type="text" name="l7" value="" size="2"  maxlength="1"><br /><br />
<input type="button" class="boton" value="Comprobar" onClick="comprobar()"><br /><br />
<textarea name="pepo" cols="50" rows="6" readonly >
Instrucciones:
Tienes 8 intentos, al octavo intento se reiniciará el juego.
Si aciertas una letra el recuadro pasará a verde.
Si colocas una letra de la palabra en otro recuadro, el recuadro aparecerá amarillo.
Si la letra es incorrecta se pondrá rojo.
</textarea>
</form>
</div>
<div id="top">

<form name="papo">
<span>Te quedan </span><input type="text" name="intentos" value="8" size="1"><span> intentos</span>
</form>
</div>

</div>
</div>
</body>
</html>
1 respuesta
tada

#9 Creo que quedaría mejor si en vez de poner un switch en la función bordes utilizas un getElementByName(x) para modificar el elemento que pasas por parametro (es decir la X).

1 1 respuesta
JuShTo

#10

No pillo tu idea...

Con el getelement saco un elemento pero es que me tiene que pasar todos los elementos por esa funcion :S.

De la manera que tu me dices(estoy aprendiendo) sólo paso un elemento por parametro, no todos.

1 respuesta
tada

#11

en vez de hacer el switch(x) haces algo así:

document.getElementByName(x).style.border = color;
document.getElementByName(x).style.border = color;
if(bloquea)
     document.getElementByName(x).disabled=true;

De esta forma no tienes que hacer un switch ya que cambiaras el elemento X. Si le pasas el elemento 4 pues cambiaras el 4..

Usuarios habituales

  • tada
  • JuShTo
  • LzO
  • zoeshadow