Sección 1: JavaScript

Lección 20: Ejemplo: Construyendo Facebook Ver. 2.0

En esta lección vamos a utilizar nuestros conocimientos acerca de ciclos de iteración para mejor nuestra aplicación de Facebook. Facebook tiene más de un usuario, ¿no? En realidad se trata de millones de usuarios que ingresan a esta red social.

¿Cómo podemos verificar cada vez que alguien intenta ingresar que su nombre de usuario es correcto o no de una lista de muchos usuarios registrados? Suena como un problema que se podría resolver perfectamente usando iteraciones.

Así que sigamos trabajando con el código de nuestro programa de Facebook anterior. Comencemos añadiendo algunos usuarios más a nuestro array de usuarios.

Guardemos los cambios en nuestro archivo de JavaScript, carguemos nuevamente la página en nuestro navegador web, e ingresemos el nombre de usuario y contraseña correspondientes al tercer usuario de nuestro array de usuarios.

Como vemos el nombre de usuario y la contraseña son incorrectos a pesar de que coinciden con los definidos en el segundo objeto del array usuarios. Esto ocurre debido a que nuestra validación de nombre de usuario y contraseña se realiza únicamente con el primer objeto del array de usuarios.

Por lo que ahora usaremos un ciclo de iteración para realizar la verificación con todos los objetos del array de usuarios. Así que modifiquemos nuestro código para añadir este ciclo iterativo.

Guardemos los cambios en nuestro archivo de JavaScript, carguemos nuestra página nuevamente, e ingresemos el nombre de usuario y contraseña correspondientes al tercer usuario de nuestro array de usuarios.

Como vemos obtenemos dos veces seguidas el mensaje de error en el nombre de usuario y/o contraseña y luego la consola nos devuelve el suministro de noticias.

¿Qué está sucediendo? Nuestro ciclo for se ejecuta tres veces, en las primeras dos muestra el mensaje de error y en la tercera imprime en consola el suministro de noticias. La lógica en esta solución no es la correcta.

¿Cómo podemos resolverla? Creemos otra función llamada esUsuarioValido la cual recibirá como parámetros el nombre de usuario y la contraseña y retornará true (verdadero) o false (falso) de acuerdo a si los datos ingresados son correctos o no.

Ahora modifiquemos nuestra función iniciarSesion para que use la función esUsuarioValido.

Guardemos los cambios en nuestro archivo de JavaScript, carguemos nuestra página nuevamente, e ingresemos el nombre de usuario y contraseña correspondientes al tercer usuario de nuestro array de usuarios.

Ahora probemos ingresar un nombre de usuario y/o contraseña incorrectos.

Vemos que nuestro programa funciona correctamente.

Bueno, eso fue todo por esta lección.

Nos vemos en la siguiente.

¡Adios!

Made with Slides.com