💻 Cómo Programar en JavaScript: Guía Completa para Principiantes

Hola bienvenidos a otra semana en nuestro blog, esta semana quiero platicarles acerca de un lenguaje llamado Javascript de Netscape Communications Corp, Mozilla Fundation es orientado a objetos es decir que el lenguaje busca una definición general de un ente en base a una clase, propiedades y métodos. Para mi es mas claro con un ejemplo para entenderlo, imaginen una casa para la programación orientada a objetos, la casa es el objeto y la casa tiene características como de que color es, cuanto mide, cuantas ventanas tiene, eso son propiedades. Bueno y la casa tiene actividades o tareas, por ejemplo construir la casa, limpiarla, repararla, venderla esos serian sus métodos. Les comparto una imagen para ejemplificarlo.

Agregar leyenda

Para un poco más de teoría o detalle de Javascript pueden ver la liga https://developer.mozilla.org/es/docs/Web/JavaScript

Con Javascript podemos hacer programas que nos permitan regresar información en páginas WEB y tener procesos cliente/servidor, es decir convierte a una página en algo interactivo donde podemos ingresar datos por ejemplo en un formulario y obtener información de regreso, o ejemplo podemos utilizar códigos predefinidos de páginas como Paypal, Google, Twiter que tienen su propio desarrollo de código, les comparto las ligas:

• https://developer.twitter.com/en/docs
• https://cloud.google.com/maps-platform/
• https://developer.paypal.com/docs/api/overview/

Javascript es un lenguaje que tiene una simbiosis con HTML , es decir se necesitan mutuamente, Javascript necesita estar en el código de una página WEB para funcionar y HTML para no ser tan plano o solo presentador de datos necesita lenguajes que lo complemente y Javascript es uno de varios ya platicaremos después de CSS, PHP entre otros.

Vamos hacer un ejemplo de un programa que nos realice la validación si somos mayores de edad en javascript para permitirnos ingresar a una pagina ingresando nuestra fecha de nacimiento:

Código:

<html>
 <head>
   <title>ejemplo Javascript</title>
 </head>
 <body>

</head>
<body>
<H1>Ejemplo</H1>
   Fecha Nacimiento 
   <input type="date" name="user_date" id="user_date"/>
   <button type="button" onclick="calculateAge()">Validar</button>
   <p id="result">Resultado</p>
<script>
function calculateAge() {
var d = document.getElementById("user_date").value;
    var inDate = new Date(d);
    var anio = inDate.getFullYear();
    var fec_actual = new Date() ; 
var fec_anio = fec_actual.getFullYear() ;
    var edad   =  fec_anio -anio ;
    if (edad >= 18) {
       document.getElementById("result").innerHTML = edad + " Bienvenido al blog www.programacionparatodos.com";
    } else
    {
    document.getElementById("result").innerHTML = "ACCESO NO VALIDO";
    }
}
</script>
</body>
</html>

También pueden ver la página en:
https://www.programacionparatodos.com/p/eje.html

Pueden practicar su código en https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_getfullyear

Ejecución del programa

Ingrese mi fecha de nacimiento

Ingrese una fecha menor

Pareciera un programa simple, pero la verdad con falta de practica en este lenguaje si me tomo un rato preparar el ejemplo, esto porque hay muchas cosas que considerar cuando escribimos un programa en Javascript:

• Los formatos que manejan las variables
• Las clases que tiene un lenguaje orientado a objetos
• Los arreglos o matrices en que indice inician, hay lenguajes como Javascript, Visual Basic, Python que inician en el cero y hay otros como Progress 4gl que inician en "1".
• En mi caso quería hacer la resta entre fechas pero la verdad se me complico y al final decidí solo obtener la resta entre la fecha actual y el año de nacimiento ingresado porque lo que me interesaba eran los años.
• No me acordaba que no tiene un validador de sintaxis (de instrucciones) hasta que probaba la página si no escribía nada era la forma en que me daba cuenta que algo estaba mal.
• El terminador de cada linea es punto y coma ";" cada lenguaje tiene su terminador de línea para indicar que terminamos una instrucción.
• Javascript es case sensitive, es decir es sensible a mayúsculas y minúsculas, por lo que las palabras propias del lenguaje deben escribirse tal cual y si creamos variables las debemos de llamar siempre igual.
• Cada navegador WEB tiene su traductor, así que hay funciones que en Chrome  funcionan bien, pero en FireFox no.

Este caso es muy utilizado en las páginas de bebidas alcohólicas por ejemplo en viñedos, casas tequileras, etc.

Platiqué este ejemplo con una amiga y ella pensó en solucionarlo restando a la fecha actual 18 y si el año ingresado es menor al resultado entonces no dar acceso, pueden intentarlo programar así para practicar o desarrollar una solución diferente.

Si quieren aprender mas pueden inscribirse a cursos en 
https://www.w3schools.com

https://www.udemy.com/

https://www.uv.es/jac/guia/jscript/javascr.htm

Si te interesa puedes ver más ejemplos de Javascript en la siguiente liga Ejemplos de llamado de Apis desde javascript

Nos leemos la próxima semana programadores, dejen sus comentarios de que quieren aprender y compartan este post saludos.

Pueden suscribirse al blog o pueden seguirnos en Facebook https://www.facebook.com/Programacionparatodoscom/