¿Qué es JavaScript?
JavaScript (JS) es un lenguaje de programación interpretado, dialecto del estándar ECMAScript. Se define como:- Orientado a objetos
- Basado en prototipos => No se instancian Clases, clona objetos existentes (prototipos) o código
- Imperativo
- Débilmente tipado y dinámico (tipo asociado al valor, no a la variables)
También se utiliza en aplicaciones externas a la web, por ejemplo en documentos PDF, y aplicaciones de escritorio (mayoritariamente widgets).
Actualmente también se usa del lado del servidor (Server-side JavaScript o SSJS) como en Node.js o Apache Couch DB.
JS NO es Java (las dos marcas pertenecen a Oracle), aunque adopta nombres y convenciones de este lenguaje, tienen semánticas y propósitos diferentes.
JS implementa Document Object Model (DOM) para interactuar con una página web.
Actualmente es ampliamente utilizado para enviar y recibir información del servidor junto con ayuda de otras tecnologías como AJAX.
JS es conocido como el lenguaje de script para la Web, ofreciendo funcionalidades completas al usuario con el resto de componentes habituales que podemos encontrar en cualquier página web:
- HTML define el contenido de las páginas
- CSS especifica el diseño (layout)
- JavaScript programa el comportamiento
¿Cómo se relacionan HTML, CSS y JS?
El código JS se descargará junto con el resto de código de una página web. Hay varias opciones para añadir JS a una página web:- puede incrustarse en un elemento,
- definirse en un elemento
styleen la cabecera o - enlazarse con un archivo JS externo
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
//Definido en cabecera (Caso 2, Funcionalidad 2a)
function getTexto() {
return 'Texto incrustado';
}
</script>
<script type="text/javascript">
//Llamada al leer la invocacion (Caso 2, Funcionalidad 2b)
document.write(getTexto() + ' (Caso 2, Funcionalidad 2b)');
</script>
<script type="text/javascript"
src="https://sites.google.com/site/awes0mem4nfiles/codigoJS.js">
//Referencia a Codigo JS (Caso 3, Funcionalidad 3)
</script>
</head>
<body>
<noscript> No tengo activado JS (Funcionalidad 1) </noscript>
<script type="text/javascript">
//Llamada al leer la invocacion (Caso 1 y 3, Funcionalidad 4)
document.write('<br>' + getTexto() + ' (Caso 1 y 3, Funcionalidad 4)');
</script>
<p onclick="alert('JS dentro atributo de elemento')">
Pincha para ver un mensaje incrustado en un elemento (Caso 1, Funcionalidad 5)
</p>
<button type="button" onclick="escribirTextoArchivo()">
Llama a función en archivo .js (Caso 3, Funcionalidad 6)
</button>
</body>
</html>
Este ejemplo implementa las siguientes funcionalidades:
- Muestra un mensaje si no se tiene activada la ejecución de JS en el navegador.
- Si está activado se añade al documento el texto de la función "getTexto()"
- Enlaza un archivo .js externo
- Se añade el texto de la función "getTexto()". Ha cambiado porque se ha sobreescrito (override)al enlazarse código JS donde hay una función con el mismo nombre
- Añade un párrafo que al recibir el evento "onclick" ejecuta código incrustado en él
- Añade un botón que llama a una función con el evento "onclick"
Además podemos utilizar una gran cantidad de librería de terceros que nos proporcionarán muchas funcionalidades enlazándolas de esta forma.
Dejaremos el código declarado en la página para hacer modificaciones que sólo afecten a la página que lo contiene (por ejemplo para crear una nueva función/variable que no se reutilizará, o para modificar una existente pero que debe variar su comportamiento) .
Incrustar código en un elemento nos servirá normalmente para personalizar una llamada (por ejemplo para pasarle un argumento a una función)
Ninguno de los casos tiene una mejora respecto a la conexión de red ya que podemos alojar los scripts externos en nuestro propio servidor (los mismos que sirven el HTML) para no depender de terceros.
En el siguiente artículo veremos la sintaxis básica.
Realiza estos ejercicios para practicar:
Profundiza más en las referencias:
Práctica fundamentos 1
Práctica fundamentos 2
- Página "oficial": EMACScript describe el standard. No hay una página oficial de JavaScript.
- Página alternativa: Mozilla Development Network (MDN)
- Wikipedia: JavaScript
- Recomendado: w3school.com
No hay comentarios:
Publicar un comentario