¿Qué es JavaScript y cómo funciona?

Anuncio

JavaScript se ha convertido en un elemento básico en el desarrollo web moderno. Este poderoso lenguaje se ha convertido en una herramienta esencial para que cualquier desarrollador web lo entienda.

JavaScript tiene características especiales que lo hacen diferente de los lenguajes de programación tradicionales. Vamos a investigar qué es, cómo funciona y qué puede hacer con él. Vamos a desglosarlo.

¿Qué es JavaScript?

JavaScript es un lenguaje de script para la web. Es un lenguaje interpretado, lo que significa que no necesita un compilador para traducir su código como C o C ++. El código JavaScript se ejecuta directamente en un navegador web.

La última versión del lenguaje es ECMAScript 2018, que se lanzó en junio de 2018.

JavaScript funciona con HTML y CSS para crear aplicaciones web o páginas web. JavaScript es compatible con la mayoría de los navegadores web modernos como Google Chrome, Firefox, Safari, Microsoft Edge, Opera, etc. La mayoría de los navegadores móviles para Android y iPhone ahora también admiten JavaScript.

JavaScript controla los elementos dinámicos de las páginas web. Funciona en navegadores web y, más recientemente, también en servidores web. Las interfaces de programación de aplicaciones (API) también son compatibles con JavaScript, lo que le brinda más funcionalidad.

Comprender todas las formas en que funciona JavaScript es un poco más fácil cuando comprende cómo funciona la programación web, así que aprendamos más.

Bloques de creación de aplicaciones web

Hay tres componentes que crean sitios web y aplicaciones: lenguaje de marcado de hipertexto (HTML), hojas de estilo en cascada (CSS) y JavaScript. Cada uno tiene un papel en la creación de una aplicación web.

• HTML es un lenguaje de marcado que crea el esqueleto de la página web. Todos los párrafos, secciones, imágenes, encabezados y texto están escritos en HTML. El contenido aparece en el sitio web en el orden en que está escrito en HTML.
• CSS controla el estilo y los aspectos adicionales del diseño. CSS se utiliza para crear el diseño del sitio web creando los colores, fuentes, columnas, bordes, etc. Lleva el sitio web de elementos de texto sin formato a diseños coloridos.
• El tercer elemento es JavaScript HTML y CSS crean la estructura, pero no hacen nada desde allí. JavaScript crea actividad dinámica en su aplicación. La secuencia de comandos en JavaScript es lo que controla las funciones cuando se hace clic en los botones, cómo se autentican los formularios de contraseña, cómo se controlan los medios.

Las tres partes funcionan en armonía entre sí para crear aplicaciones a gran escala. Seria una buena idea Aprenda más sobre HTML y CSS Aprenda HTML y CSS con estos tutoriales paso a paso¿Tienes curiosidad por HTML, CSS y JavaScript? Si cree que tiene una habilidad especial para aprender a crear sitios web desde cero, aquí hay algunos tutoriales paso a paso que vale la pena probar. Lee mas si no te sientes completamente cómodo con ellos.

¿Cómo funciona JavaScript?

Antes de escribir JavaScript, es importante saber cómo funciona bajo el capó. Hay dos piezas importantes para aprender: cómo funciona el navegador web y el Modelo de objetos de documento (DOM).

El navegador web carga una página web, analiza el HTML y crea lo que se conoce como Modelo de objeto de documento (DOM) a partir de los contenidos. El DOM presenta una vista en vivo de la página web a su código JavaScript.

El navegador tomará todo lo relacionado con el HTML, como imágenes y archivos CSS. La información CSS proviene del analizador CSS.

El DOM agrupa el HTML y el CSS para crear primero la página web. Luego, el motor JavaScript de los navegadores carga los archivos JavaScript y el código en línea, pero no ejecuta el código de inmediato. Espera a que HTML y CSS terminen de cargarse.

Una vez hecho esto, el JavaScript se ejecuta en el orden en que se escribe el código. Esto hace que el DOM sea actualizado por el código JavaScript y procesado por el navegador.

El orden aquí es importante. Si JavaScript no esperaba a que finalizaran el HTML y CSS, no podría cambiar los elementos DOM.

¿Qué puedo hacer con JavaScript?

JavaScript es un lenguaje de programación completo que puede hacer la mayoría de las cosas que puede hacer un lenguaje normal como Python. Éstos incluyen:

• Declarando variables Cómo declarar variables en JavaScriptPara comenzar con JavaScript, debe comprender las variables. Aquí hay tres formas de declarar variables en JavaScript. Lee mas .
• Almacenar y recuperar valores.
• Definir e invocar funciones, incluidas funciones de flecha.
• Definición de objetos y clases de JavaScript.
• Carga y uso de módulos externos.
• Escribir controladores de eventos que responden a eventos de clic.
• Escribiendo el código del servidor.
• Y mucho más.

Advertencia: Ya que JavaScript es un lenguaje tan poderoso JavaScript y desarrollo web: uso del modelo de objetos de documentoEste artículo le presentará el esqueleto del documento con el que funciona JavaScript. Con un conocimiento práctico de este modelo de objeto de documento abstracto, puede escribir JavaScript que funcione en cualquier página web. Lee mas , también es posible escribir malware, virus y ataques de navegador para infligirlos a los usuarios. Estos van desde el robo de cookies del navegador, contraseñas, tarjetas de crédito hasta la descarga de virus en su computadora.

Usando JavaScript

Veamos algunos conceptos básicos de JavaScript con ejemplos de código.

Declarando variables

JavaScript se escribe dinámicamente, lo que significa que no tiene que declarar el tipo de sus variables en su código.

dejar num = 5; let myString = "Hola"; tasa de interés var = 0.25; 

Operadores

Adición

12 + 5. >> 17. 

Sustracción

20 - 8. >> 12. 

Multiplicación

5 * 2. >> 10. 

División

50 / 2. >> 25. 

Módulo

45 % 4. >> 1. 

Matrices

let myArray = [1,2,4,5]; let stringArray = ["hola", "mundo"]; 

Las funciones

JavaScript puede escribir funciones, aquí hay una función simple que agrega números.

función addNumbers (num1, num2) { devuelve num1 + num2; } >> addNumbers (10,5); >> 15.

Bucles

JavaScript puede realizar bucles para iteración, bucles como para bucles y mientras bucles.

para (sea i = 0; i <3; i ++) {console.log ("echo!"); } >> echo! >> echo! >> echo! 

dejar i = 0; while (i <3) {console.log ("echo!"); i ++; } >> echo! >> echo! >> echo! 

Comentarios

// Escribir un comentario. 

/ * Escribir un comentario de varias líneas. Puedes usar tantas líneas como quieras. para dividir el texto y hacer que los comentarios sean más legibles. */

En una página web

La forma más común de cargar JavaScript en una página web es usar el guión Etiqueta HTML Dependiendo de sus requisitos, puede usar uno de los siguientes métodos.

• Cargue un archivo JavaScript externo en una página web de la siguiente manera:
• Puede especificar la URL completa si el javascript es de un dominio diferente de la página web de la siguiente manera:
• JavaScript se puede incrustar directamente en el HTML. Aquí hay un.

Aparte de estos métodos, hay formas de cargar el código JavaScript bajo demanda. De hecho, existen marcos dedicados a cargar y ejecutar módulos JavaScript con dependencias adecuadas resueltas en tiempo de ejecución.

Esos son temas más avanzados, en este momento estás aprendiendo lo básico.

Fragmentos de código JavaScript de muestra

Aquí hay algunos ejemplos simples de código JavaScript para ilustrar cómo se usa en las páginas web. Estos son ejemplos de código que funcionan con el DOM.

• Lo siguiente selecciona todo negrita elementos en el documento y establece el color del primero en rojo.

  var elems = document.getElementsByTagName ('b'); elems [0] .style.color = 'rojo'; 

• Quiere cambiar la imagen en un img ¿etiqueta? A continuación se asocia un controlador de eventos para hacer clic evento de un botón

  Cambiar imagen

• Actualice el contenido de texto de un párrafo (pag) elemento? Selecciona el innerHTML propiedad del elemento como se muestra:

  Hola Mundo
  Haz click en mi

Estos ejemplos de código ofrecen solo una idea de lo que puede hacer con JavaScript en su página web. Existen muchos tutoriales que pueden enseñarle cómo codificar Freebie: Aprende a codificar con 27 horas de video tutorialesEl paquete Ultimate Coding Bundle, que incluye cinco cursos de video y 27 horas de instrucción premium, es GRATIS en este momento. Lee mas para que comiences ¡Puedes probarlo en cualquier página web, incluso en esta! Abre tu consola y prueba un código JavaScript.

Ahora ya sabes lo que hace JavaScript

Con suerte, esta introducción ha aportado algunas ideas sobre JavaScript y lo entusiasma con la programación web. Puedes resumirlo todo en nuestra práctica hoja de trucos de JavaScript La última hoja de trucos de JavaScriptObtenga una actualización rápida de los elementos de JavaScript con esta hoja de trucos. Lee mas . Hay mucho más que aprender sobre JavaScript. Una vez que te sientas más cómodo, ¿por qué no intentas aprender a usar el modelo de objetos de documento? También podrías ser interesado en aprender sobre TypeScript ¿Qué es TypeScript y por qué los desarrolladores deberían probarlo?¿Le resulta difícil adaptar JavaScript después de aprender otro lenguaje de programación? Así es como TypeScript podría ayudarlo a cambiar. Lee mas .