AnshiG
Bienvenidos a AnshiG.!!

Conectarse

Recuperar mi contraseña


Afiliados Elite


Normales
Kimi wa Petto TOP
Pagerank

Últimos temas
» Blog de Renders!
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



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.
Creative Commons License
Crear
foro
Codigos CSS-HTML-JS

APRENDO EN...
Estudio en Eternal Designs Melody Graphics School ise-graficos

TOMO RECURSOS DE...

RESEÑAS...


Propiedades Basicas Javascript: Funciones Booleanas

Ver el tema anterior Ver el tema siguiente Ir abajo

Propiedades Basicas Javascript: Funciones Booleanas

Mensaje por Sakura92 el Sáb Abr 06, 2013 7:15 pm

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:
if (aquí tu condición) {
aquí las funciones que se ejecutarán al cumplirse tu condición
}
Pero ahora, ¿cómo demonios establecemos una condición? Pues hay varias formas. Puedes pedir que se cumplan ciertas condiciones en el CSS de un elemento con la función .css (ver Tuto #003). Por ejemplo, la siguiente función detectaría si el fondo del #wrap es #000000, y si se cumple, le añadirá una class particular:
if ($('#wrap').css('background', '#000000')) {
$(this).addClass('es-negro');
}
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 (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:
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
}
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 (a===100) {
$('#wrap').addClass('a-es-cien');
}
else {

$('#wrap').addClass('a-no-es-cien');
}
¿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 (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
}
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 (a===100) {
código Z
}
else if (
a===50) {
código Y
}
else {

código Ñ
}
Uno puede repetir else ifs hasta la eternidad, pero hay formas más prácticas de cumplir esto...

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:
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
}
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.

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 (?).
switch (a) {
case
100:
código Z
break;
case
50:
código Y
break;
default:

Código Ñ
}
¿Ya veis? Más que simple, y os ahorra la chance de meter la pata con un if o tal.

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 Wink cualquier duda, recuerden dejar mensaje aquí mismo.

​​​​​​​​​​​​​​​​​​​​​​​​​​
avatar
Sakura92
Webmaster
Webmaster

Mensajes : 175
Puntos : 178942
Reputación : 2
Edad : 25

Volver arriba Ir abajo

Ver el tema anterior Ver el tema siguiente Volver arriba

- Temas similares

 
Permisos de este foro:
No puedes responder a temas en este foro.