馃捇 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:
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 una fecha menor
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.
- 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:
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>
<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
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.
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/
Comentarios
Publicar un comentario