Conectarse
Pagerank
Últimos temas
Las imagenes e historias que se posteen en este foro son de sus respectivos dueños, cada uno tendra el link correspondiente a la pagina donde lo ubico su creador originalmente.Todo el materia ya se encuentra bajo licencia por favor si quieres tomar algo comunicarse con la administración del foro, o el dueño del post.
Codigos CSS-HTML-JS
APRENDO EN...
TOMO RECURSOS DE...
RESEÑAS...
Propiedades Basicas Javascript: Funciones Booleanas
AnshiG :: OurHobbies :: Diseño Web :: Tutoriales :: Javascript
Página 1 de 1.
Propiedades Basicas Javascript: Funciones Booleanas
TUTORIAL REALIZADO POR PYRITE WOLF DE SOURCECODE
#006 - Funciones Booleanas
Recuerda que este tuto es parte de una serie de tutos, en la que se asume que has leído el anterior. También recuerda que se asume que manejas más o menos bien el HTML y CSS.
Este tuto te instruirá sobre el uso de las funciones booleanas (que reciben su nombre por este buen tipo, agradézcanle), que son aquellas que evalúan un condicionante. Si la condición se cumple, te dan un resultado, y si no... pues ya veremos qué sucede si no se cumple.
1. If
Las if (traducido del inglés como si condicional) son las bases del condicionamiento: son funciones que sólo se ejecutan si algo se cumple. Su sintáxis es la siguiente:
Pero ahora, ¿cómoif (aquí tu condición) {
aquí las funciones que se ejecutarán al cumplirse tu condición
}
Otra cosa que podemos hacer es aprovechar algunas de las herramientas aprendidas en el tuto anterior: variables y operadores. Por ejemplo, si la variable a tiene un valor numérico de 100, #wrap recibirá una clase particular:if ($('#wrap').css('background', '#000000')) {
$(this).addClass('es-negro');
}
if (a===100) {
$('#wrap').addClass('a-es-cien');
}
2. Else y Else if
Vale, ya puedes hacer que X suceda si Z se cumple, y si no se cumple no pasará nada. Pero... ¿Y si quieres añadir que suceda algo en el caso de que Z no se cumpla? Tranquilo, solo será cuestión de añadir un else (traducible burdamente como "caso contrario") a tu if. Su sintáxis es tan simple como la de un if a secas:
Entonces, si retomamos los ejemplos previos. Supongamos que si a vale 100 (numérico) queremos que #wrap tenga la clase a-es-cien, PEEERO si esto no se cumple queremos que #wrap tenga la clase a-no-es-cien. El código sería:if (aquí tu condición) {
aquí las funciones que se ejecutarán al cumplirse tu condición
}
else {
aquí las funciones que se ejecutarán si tu condición no se cumple
}
¿Ya veis? Sencillito. El tema es que a veces queremos probar varias condiciones, por ejemplo si a===100 que pase Z código, pero si a===50 que pase Y código, y si no es ninguna de las dos que pase Ñ código. Aquí es donde entra el else if ("...caso contrario, si..."). Se emplea de la misma forma que un if:if (a===100) {
$('#wrap').addClass('a-es-cien');
}
else {
$('#wrap').addClass('a-no-es-cien');
}
Entonces, de acuerdo a esto, si seguimos el ejemplo dado para el tema (si a===100 que pase Z código, pero si a===50 que pase Y código, si no es ninguna de las dos que pase Ñ código), el código sería:if (aquí tu condición) {
código a ejecutarse si tu condición se cumple
}
else if (aquí tu segunda condición) {
código a ejecutarse si tu segunda condición se cumple
}
Uno puede repetir else ifs hasta la eternidad, pero hay formas más prácticas de cumplir esto...if (a===100) {
código Z
}
else if (a===50) {
código Y
}
else {
código Ñ
}
3. Switch
Ya veis, cuando uno habla de practicidad siempre aparece el switch (cambio, cambiar, tecla, etc; tiene muchas traducciones). El switch usualmente se emplea para evaluar variables, ya que lo que hace es coger algo y compararlo con valores determinados, que sólo pueden ser texto o números. Si no se cumple un "caso" (una comparación), se pasa automáticamente a la siguiente. Veamos la sintáxis básica y un ejemplo:
Entonces. Donde dice cosa a comparar colocaremos la variable o el elemento a comparar con los diferentes valores. Donde dice valor 1, valor 2, valor 3 se colocan los valores con los que se comparará el elemento o variable señalado al comienzo. Se pueden añadir tantos casos como se deseen, no hay un límite. Finalmente, al final de los casos aparece default: un código que correrá si no se cumple ningún caso. Si no lo necesitas, puedes prescindir de él.switch (cosa a comparar) {
case valor 1:
código a ejecutar si se cumple el valor 1
break;
case valor 2:
código a ejecutar si se cumple el valor 2
break;
case valor 3:
código a ejecutar si se cumple el valor 3
break;
default:
valor si no se cumple ningún caso
}
Tomemos el último ejemplo dado: si a===100 que pase Z código, pero si a===50 que pase Y código, si no es ninguna de las dos que pase Ñ código. Os lo memorizareis (?).
¿Ya veis? Más que simple, y os ahorra la chance de meter la pata con un if o tal.switch (a) {
case 100:
código Z
break;
case 50:
código Y
break;
default:
Código Ñ
}
Este tuto os abrirá muchas puertas. Combinado con el anterior, permite hacer todo tipo de locuras: slideshows, arrays locos de cosas felices, skins que varían según el grupo de la persona... de todo.
Nos vemos en el próximo tuto cualquier duda, recuerden dejar mensaje aquí mismo.
Sakura92- Webmaster
- Mensajes : 175
Puntos : 411742
Reputación : 2
Edad : 31
Temas similares
» Propiedades Basicas Javascript: Herramientas
» Propiedades Basicas Javascript: Modificaciones Via DOM
» Propiedades Basicas Javascript: Efectos
» Propiedades Basicas Javascript: Eventos
» Propiedades Basicas Javascript: Introduccion
» Propiedades Basicas Javascript: Modificaciones Via DOM
» Propiedades Basicas Javascript: Efectos
» Propiedades Basicas Javascript: Eventos
» Propiedades Basicas Javascript: Introduccion
AnshiG :: OurHobbies :: Diseño Web :: Tutoriales :: Javascript
Página 1 de 1.
Permisos de este foro:
No puedes responder a temas en este foro.
|
|
Dom Ene 03, 2016 2:36 pm por Sakura92
» Hemos vuelto!!
Dom Ene 03, 2016 2:31 pm por Sakura92
» Actualización FEBRERO 2015
Vie Feb 27, 2015 10:22 am por Sakura92
» Cosplay (Varios)
Lun Feb 23, 2015 10:42 am por Sakura92
» Cosplay (Varios)
Lun Feb 23, 2015 10:41 am por Sakura92
» Materias favoritas... y no tanto!
Jue Feb 12, 2015 10:47 am por Sakura92
» Que mascotas tienen, tuvieron y les gustaria tener?
Jue Feb 12, 2015 10:38 am por Sakura92
» Redes sociales
Jue Feb 12, 2015 10:09 am por Sakura92
» PS3: Juegos!
Jue Feb 12, 2015 10:03 am por Sakura92
» Consolas o PC?
Jue Feb 12, 2015 9:55 am por Sakura92
» BUSQUEDA DE STAFF
Mar Feb 10, 2015 7:18 pm por Sakura92
» Requisitos y Datos
Mar Feb 10, 2015 12:03 pm por Sakura92
» Limpieza de afiliados
Mar Feb 10, 2015 9:36 am por Sakura92
» Ola ke Ase?
Lun Dic 09, 2013 8:07 pm por Tetsumi
» Guia 7: Reglamento Administracion
Vie Nov 22, 2013 1:05 pm por Sakura92
» Ideas
Vie Nov 22, 2013 1:02 pm por Sakura92
» Puntos
Vie Nov 22, 2013 12:59 pm por Sakura92
» Reglamento Soporte
Vie Nov 22, 2013 12:58 pm por Sakura92
» Reglamento Tutoriales
Vie Nov 22, 2013 12:57 pm por Sakura92
» Reglamento Galerias
Vie Nov 22, 2013 12:57 pm por Sakura92
» Reglamento Recursos
Vie Nov 22, 2013 12:56 pm por Sakura92
» Reglamento Talleres y Pedidos
Vie Nov 22, 2013 12:56 pm por Sakura92
» Incumplimientos
Vie Nov 22, 2013 12:52 pm por Sakura92
» Wings of Freedom [Elite]
Lun Sep 30, 2013 2:28 pm por Invitado
» Yugi Oh! RPG [Élite]
Miér Ago 07, 2013 2:36 am por Invitado
» OMEGA NEW WORLD [Afiliación Élite ]
Miér Jul 31, 2013 6:08 pm por Invitado
» Creando Mundos [Élite]
Vie Jul 26, 2013 12:22 am por Invitado
» World´s Inuyasha RPG [Normal]
Miér Jul 24, 2013 11:46 pm por Invitado
» Fatal Liberty Rol [Élite]
Mar Jul 16, 2013 10:30 am por Invitado
» Fairy Tail Sekai || Re-Apertura! || Afiliación Elite
Miér Jul 03, 2013 1:50 am por Invitado
» Hi(: !
Lun Jul 01, 2013 3:47 am por #Re Sound
» Hola, Hola, ¿hay alguien ahi?
Lun Jul 01, 2013 3:37 am por #Re Sound
» Bleach: Shadow Of Seireitei [Cambio de dirección]
Sáb Jun 29, 2013 11:52 am por Invitado
» Volvi... nose si para siempre pero volvi xD
Vie Jun 28, 2013 9:08 am por Sakura92
» Me extravié en el cielo, ¿qué puedo hacer?
Vie Jun 28, 2013 8:55 am por Sakura92
» Roma Antiqua {Afiliación Normal}
Dom Jun 23, 2013 3:07 pm por Invitado
» Saint Seiya Cosmos Rebellion Rol [Afiliación Élite]
Dom Jun 16, 2013 12:13 am por Invitado
» Buck Tick Fans [Élite]
Jue Jun 13, 2013 1:49 am por Invitado
» End of Silence [Cambio de dirección y botones]
Vie Mayo 31, 2013 5:54 am por Invitado
» Campamento mestizo [Afiliación Elite]
Miér Mayo 29, 2013 6:11 pm por Invitado
» Render Universe - Elite
Dom Mayo 19, 2013 3:58 pm por Invitado
» Love orange and cyan (tutorial9
Jue Mayo 16, 2013 3:51 pm por Loki
» AVISO
Jue Mayo 16, 2013 8:49 am por Sakura92
» Code Geass: Endless Dark [Élite]
Miér Mayo 01, 2013 2:22 am por Invitado
» Creative Designs (normal)
Mar Abr 30, 2013 12:48 am por Invitado
» Ultimate Inazuma Rol -Cambio de banner-
Jue Abr 25, 2013 1:26 pm por Invitado
» Buenas...
Mar Abr 16, 2013 3:58 pm por Naggar
» Actualizacion de Abril
Mar Abr 16, 2013 2:00 pm por Sakura92
» Texuras y Png hechas por mi (Sueltas) - Actu 13/04
Lun Abr 15, 2013 8:16 am por Jotaro Kujo
» AVISO DE AUSENCIA TEMPORAL
Vie Abr 12, 2013 2:46 pm por Zec