‘Unidad 3:’

{ Desarrollo Web con

Javascript
}
1
2
CONTENIDOS DE LA CLASE {
3
4
5
6
7
8
9 Introducción a JavaScript
10
11
12
13
14 }
Argentina Programa 4.0
1
2
OBJETIVOS {
3
Conocer de dónde proviene JavaScript y por qué es tan importante.
4
5
6 Tener una noción de todo lo que se puede hacer con JavaScript.
7
8 Entender la integración única que posee JavaScript con la
9 programación web.
10
11
Conocer los recursos más utilizados para documentarse
12
sobre JavaScript.
13
14 }
Argentina Programa 4.0
 UNIDAD 3 - Desarrollo Web con Javascript

1
{
2
3
4
5
6 [ Introducción a JavaScript ]
7
8
9
10
11
12
13
14 }
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Cúal es la historia de JavaScript?{

2
< JavaScript fue creado por Brendan Eich en 1995 mientras trabajaba en Netscape
3 Communications Corporation. La idea original era crear un lenguaje de programación
4 que pudiera ejecutarse en el navegador del usuario, lo que permitiría a los
desarrolladores crear páginas web interactivas y dinámicas. El primer nombre del
5 lenguaje fue Mocha, En Septiembre de ese año lo renombra a LiveScript hasta que le
6 cambiaron el nombre a JavaScript debido a una estrategia de marketing, ya que
Netscape fue adquirida por Sun Microsystems, propietaria del lenguaje Java, muy
7 popular por aquel entonces. >
8
9
10
11
12
13
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Cúal es la historia de JavaScript?{

2
< En febrero de 1996, JavaScript fue adoptado por Microsoft en Internet Explorer, lo que llevó a
3 una rápida expansión de su uso. La especificación de JavaScript fue estandarizada en 1997 por
la Ecma International, una organización dedicada a la estandarización de tecnologías de la
4 información y la comunicación. En 1999 aparece la 3a versión del estándar ECMAScript. Hubo
5 pequeños intentos de escribir la versión 4, pero hasta 2011 no se aprobó y se estandarizó la
versíon 5 (ES5). En junio de 2013 quedó parado el borrador de la versión 6, pero en Diciembre
6 de 2014 se aprobó al fin y a partir de Junio de 2015 fue la sexta versión importante del estándar
7 ECMAScript y trajo consigo una serie de nuevas características y mejoras significativas para el
lenguaje de programación JavaScript. .>
8
9
10
11
12
13
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Con qué objetivo fue creado? {

2
3
4 < JavaScript fue creado con el objetivo de agregar interactividad y dinamismo a las
páginas web. Cuando se desarrolló y se llamó "LiveScript", se diseñó para ser una
5
extensión de Java para agregar interactividad a las páginas web. Más tarde cuando se
6 renombró a JavaScript, se desarrolló para ser un lenguaje de programación
7 independiente para la web.

8 Antes de JavaScript, las páginas web eran principalmente estáticas y no tenían la

9 capacidad de responder a la entrada del usuario o de actualizar dinámicamente la página
sin tener que cargarla completamente de nuevo. Con JavaScript, los desarrolladores
10 pueden crear aplicaciones web interactivas que responden a la entrada del usuario en
11 tiempo real y actualizan dinámicamente el contenido de la página sin tener que volver a
cargar la página completa. >
12
13
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1
¿Cómo y cuándo se agregan nuevas funcionalidades
2 en javascript? {
3
4 < Las nuevas funcionalidades de JavaScript se agregan a través de actualizaciones de
5 las especificaciones llamadas ECMAScript. ECMAScript es un estándar que define la
sintaxis y el comportamiento del lenguaje de programación JavaScript. Cada nueva
6
versión de ECMAScript incluye nuevas funcionalidades y mejoras en el lenguaje.
7
8 Antes de JavaScript, las páginas web eran principalmente estáticas y no tenían la
capacidad de responder a la entrada del usuario o de actualizar dinámicamente la página
9 sin tener que cargarla completamente de nuevo. Con JavaScript, los desarrolladores
10 pueden crear aplicaciones web interactivas que responden a la entrada del usuario en
tiempo real y actualizan dinámicamente el contenido de la página sin tener que volver a
11 cargar la página completa. >
12
13
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Qué es y en qué consiste la especificación ECMAScript? {

2
3 < La especificación ECMAScript es un estándar que define el lenguaje de programación
JavaScript. ECMAScript establece la sintaxis, la semántica y las reglas para la
4 implementación del lenguaje de programación JavaScript. Es desarrollado y mantenido
5 por el comité técnico TC39 de la organización internacional de normalización ECMA, de
ahí su nombre. La especificación ECMAScript define la estructura básica del lenguaje,
6
incluyendo la sintaxis y las características clave como las variables, los operadores, las
7 estructuras de control de flujo y las funciones. También define las nuevas
8 funcionalidades y mejoras que se agregan a JavaScript en cada versión.

9 La especificación ECMAScript es importante para los desarrolladores porque les permite

10 escribir código JavaScript que funcionará de manera consistente en diferentes
plataformas y navegadores, y les permite utilizar las últimas características y
11 funcionalidades del lenguaje. Además, la especificación ECMAScript proporciona un
12 marco de referencia común para los desarrolladores, lo que les permite colaborar y
compartir código de manera más efectiva.>
13
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Cuál es el alcance y las ramas en las que JavaScript está involucrado? {

2 <JavaScript se utiliza en una amplia variedad de aplicaciones y ramas de la tecnología.>
3
Desarrollo web: {
4
< JavaScript se utiliza ampliamente en el desarrollo web para crear páginas web
5 interactivas y dinámicas. Con la ayuda de bibliotecas y frameworks como React, Vue.js,
6 Angular, entre otros, JavaScript permite crear aplicaciones web complejas y escalables. >

7 }
8
Desarrollo móvil: {
9
10 <JavaScript se utiliza en el desarrollo móvil para crear aplicaciones móviles híbridas y
nativas. Frameworks como React Native y Ionic permiten a los desarrolladores utilizar
11 JavaScript para crear aplicaciones móviles que funcionan en múltiples plataformas. >

12
}
13
}
14

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Cuál es el alcance y las ramas en las que JavaScript está involucrado? {

2 <JavaScript se utiliza en una amplia variedad de aplicaciones y ramas de la tecnología.>
3
Desarrollo de juegos: {
4
< JavaScript se utiliza en el desarrollo de juegos en línea y móviles. Con la ayuda de
5 bibliotecas y frameworks como Phaser, Three.js y Babylon.js, los desarrolladores pueden
6 crear juegos 2D y 3D interactivos y de alta calidad. >

7 }
8
Desarrollo de aplicaciones de escritorio {
9
<JavaScript se utiliza en el desarrollo de aplicaciones de escritorio, especialmente en el
10 ámbito de la automatización de tareas. Frameworks como Electron y NW.js permiten a
los desarrolladores utilizar JavaScript para crear aplicaciones de escritorio
11 multiplataforma. >
12
}
13
}
14

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1
¿Cuáles son las capacidades de uso en multiplataforma que
2 ofrece el lenguaje javascript? {
3 < Para comprender: >
4
< JavaScript es un lenguaje de programación interpretado: Esto significa que el código
5
1) JavaScript se ejecuta en tiempo de ejecución, lo que permite que se adapte a diferentes
6 plataformas. El intérprete de JavaScript está presente en muchos navegadores web y en
7 entornos de servidor como Node.js. >

8
9 < JavaScript es un lenguaje de programación con tipado dinámico: Esto significa que las
2) variables no tienen un tipo de datos fijo y pueden cambiar de tipo durante la ejecución de la
10
aplicación. Esto permite una mayor flexibilidad en el uso de las variables y una adaptabilidad a
11 diferentes plataformas. >
12
13
14 }

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1
¿Cuáles son las capacidades de uso en multiplataforma que
2 ofrece el lenguaje javascript? {
3 < Para comprender: >
4 < JavaScript tiene una amplia variedad de bibliotecas y frameworks: Hay una gran cantidad de
5 bibliotecas y frameworks de JavaScript disponibles que facilitan el desarrollo de aplicaciones
3) multiplataforma. Estos frameworks y bibliotecas permiten a los desarrolladores crear
6
aplicaciones que funcionan en diferentes plataformas, desde navegadores web hasta
7 dispositivos móviles. >
8
9 < JavaScript se puede utilizar tanto en el lado del cliente como en el lado del servidor: Esto
4) significa que JavaScript se puede utilizar para crear tanto aplicaciones web como aplicaciones
10
de escritorio. Node.js es un entorno de servidor de JavaScript que permite la creación de
11 aplicaciones web y de escritorio utilizando JavaScript. >
12
13
14 }

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 Ejemplos de aplicaciones creadas con una base en JavaScript {

2
3
<Gmail> { es uno de los servicios de correo electrónico más
4 populares del mundo y utiliza una gran cantidad de JavaScript para
5 proporcionar una experiencia de usuario dinámica e interactiva.
6 Gmail utiliza AJAX (Asynchronous JavaScript and XML) para
7 actualizar el contenido de la página sin necesidad de recargarla. }
8
9 <Facebook-Meta> { es una de las redes sociales más populares del
10 mundo y utiliza una gran cantidad de JavaScript para proporcionar
una experiencia de usuario fluida e interactiva. Facebook utiliza una
11 gran cantidad de bibliotecas y frameworks de JavaScript, como
12 React y GraphQL, para crear una aplicación web escalable y
13 robusta. }
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1
Ejemplos de aplicaciones muy utilizadas creadas con una base en
2 JavaScript {
3 <Google Maps> { es un servicio de mapas en línea muy popular que
4 utiliza una gran cantidad de JavaScript para proporcionar una
5 experiencia de usuario fluida e interactiva. Google Maps utiliza una
6 técnica llamada "carga perezosa" para cargar los mapas y los
marcadores solo cuando son necesarios, lo que mejora la velocidad
7
de carga de la aplicación. }
8
9 <Spotify> { es un servicio de música en línea muy popular que
10 utiliza una gran cantidad de JavaScript para proporcionar una
experiencia de usuario dinámica e interactiva. Spotify utiliza una
11 técnica llamada "carga perezosa" para cargar las canciones y las
12 listas de reproducción solo cuando son necesarias, lo que mejora la
13 velocidad de carga de la aplicación. }
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Qué hace especial a JavaScript? {

2
< es el único lenguaje de programación que funciona directamente en el navegador web, lo que permite a los
3 1) desarrolladores crear aplicaciones web interactivas y dinámicas que responden a la interacción del usuario. Esto
ha hecho que JavaScript sea muy popular entre los desarrolladores de aplicaciones web y ha llevado a la creación
4 de muchas bibliotecas y frameworks de JavaScript para facilitar el desarrollo web. >
5
< es relativamente fácil de aprender, en comparación con otros lenguajes de programación, debido a su sintaxis
6 2) simple y a que no requiere una configuración complicada para comenzar a trabajar con él. Además, hay una gran
cantidad de recursos en línea disponibles para aprender JavaScript, incluidos tutoriales, videos y documentación
7 oficial. >
8 < es un lenguaje de programación dinámico, lo que significa que puede ejecutarse en tiempo real y reaccionar a
3)
9 eventos del usuario. Esto lo convierte en un lenguaje ideal para aplicaciones web interactivas y dinámicas, como
juegos en línea, aplicaciones de chat en vivo y otras aplicaciones que requieren una respuesta en tiempo real. >
10
11 < tiene una gran y activa comunidad de desarrolladores que contribuyen a bibliotecas, frameworks y herramientas
4)
12 para el lenguaje. Esto hace que sea fácil encontrar soluciones a problemas específicos y mejorar la calidad de la
programación en general. >
13
14 }

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 Ventajas y desventajas de JavaScript {

2 <VENTAJAS>
3 < Lenguaje de programación de alto nivel: es un lenguaje de programación de alto nivel que permite a
los desarrolladores escribir código más rápido y de manera más eficiente. >
4
5 < Fácil de aprender: es relativamente fácil de aprender y tiene una curva de aprendizaje suave para
6 aquellos que ya tienen experiencia en programación.>
7
< Interactivo y dinámico: permite crear aplicaciones web interactivas y dinámicas que responden a la
8 entrada del usuario en tiempo real y actualizan dinámicamente el contenido de la página sin tener que
9 volver a cargar la página completa.>
10
< Amplia comunidad de desarrolladores: cuenta con una gran comunidad de desarrolladores que
11 comparten su conocimiento y recursos en línea.>
12
13 <Utilizado en una amplia variedad de aplicaciones: se utiliza en una amplia variedad de aplicaciones
web, móviles y de escritorio, lo que lo convierte en un lenguaje de programación muy versátil.>
14 }

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 Ventajas y desventajas de JavaScript {

2 <DESVENTAJAS>
3 < Falta de seguridad: JavaScript puede ser vulnerable a ataques de seguridad, como inyección de
código malicioso y cross-site scripting (XSS). >
4
5 < Dificultades en la depuración de errores: A menudo, puede ser difícil depurar los errores en
6 JavaScript, especialmente en aplicaciones web complejas.>
7
< Dependencia de los navegadores: JavaScript está estrechamente relacionado con los navegadores
8 web, y algunas funcionalidades pueden no ser compatibles con ciertos navegadores, lo que puede
9 requerir el uso de bibliotecas o herramientas adicionales para garantizar la compatibilidad.>

10 < Rendimiento: Aunque el rendimiento de JavaScript ha mejorado con el tiempo, todavía puede ser un
11 poco más lento que otros lenguajes de programación en algunas aplicaciones.>
12
< Limitaciones en la programación de aplicaciones de escritorio: Aunque JavaScript se utiliza para
13 desarrollar aplicaciones de escritorio, todavía tiene algunas limitaciones en términos de acceso a
14 } recursos del sistema y funcionalidad avanzada.>

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Cuáles son los usos principales de JavaScript? {

2
3
Interactividad {
4
<Una de las razones principales por las que se utiliza JavaScript en el desarrollo web es
5 para crear interactividad en una página. Con JavaScript, se puede crear botones,
animaciones y otros elementos interactivos que hacen que el usuario se involucre más
6 en la experiencia del sitio web. >
7 }
8
Validación de formularios {
9
< JavaScript se utiliza comúnmente para validar la información que un usuario introduce
10 en un formulario, como asegurarse de que se introduzca un correo electrónico válido o
un número de teléfono. Esto ayuda a mejorar la experiencia del usuario y garantiza que
11 los datos se recopilen correctamente. >
12
}
13
}
14

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Cuáles son los usos principales de JavaScript? {

2
3
Manipulación del DOM {
4
<El Document Object Model (DOM) es la estructura que se utiliza para representar un
5 documento HTML en un navegador web. JavaScript se puede utilizar para manipular el
6 DOM y actualizar dinámicamente la página web sin tener que recargarla. >

7 }
8
Aplicaciones web {
9
< Con el auge de las aplicaciones web, JavaScript se ha convertido en una parte
10 integral del desarrollo de aplicaciones. Los frameworks de JavaScript como Angular,
React y Vue.js se utilizan comúnmente para construir aplicaciones web que ofrecen una
11 experiencia de usuario similar a la de una aplicación nativa. >
12
}
13
}
14

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Qué es una documentación en javascript? {

2 < Es un conjunto de información escrita que describe el código y la funcionalidad de un programa,
3 biblioteca o framework de JavaScript. La documentación es esencial para cualquier proyecto de
programación, ya que proporciona información sobre cómo utilizar el código, cómo se relacionan las
4 diferentes partes del código, las entradas y salidas esperadas, y cualquier otra información relevante para
los usuarios.
5
6 Los comentarios en el código son la forma más básica de documentación. Se utilizan para describir lo que
hace una sección específica del código o para explicar por qué se escribió una línea de código de cierta
7 manera. Los comentarios pueden ayudar a otros desarrolladores a entender el código y hacer
modificaciones con mayor facilidad. >
8
9
10
11
12
13
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Qué es una documentación en javascript? {

2
3 < La documentación en JavaScript es una colección de información y recursos que
explican cómo usar y trabajar con el lenguaje de programación JavaScript. Esta
4 documentación incluye descripciones detalladas de las características y funcionalidades
5 del lenguaje, así como ejemplos y tutoriales para ayudar a los desarrolladores a entender
y aplicar el código.
6
7 La documentación puede tomar muchas formas diferentes, desde comentarios en el
propio código, hasta guías y tutoriales en línea, documentación de referencia en formato
8
de libro, y otros recursos en línea, como sitios web de programación y foros de
9 discusión.
10
La documentación en JavaScript es útil para los desarrolladores que están aprendiendo
11 a utilizar el lenguaje, o para aquellos que necesitan ayuda para implementar una
12 funcionalidad específica en su proyecto. La documentación puede ayudar a los
desarrolladores a entender cómo funciona el lenguaje, a utilizarlo de manera efectiva y a
13 resolver problemas que puedan surgir durante el desarrollo de un proyecto. >
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

¿Cúales son las cuestiones a tener en cuenta a la hora de leer una documentación
1 en javascript? {
2
3 < Versión del lenguaje: Asegúrarse que la documentación que se está leyendo se corresponde con la
versión de JavaScript que se está utilizando. Cada versión puede tener diferencias significativas en
4 cuanto a la sintaxis y funcionalidades. >
5
< Objetivo y contexto: Entender el objetivo de la documentación y el contexto en el que se utiliza el
6 código. Esto ayudará a entender cómo se pueden aplicar las funcionalidades y a qué tipo de proyectos
7 están destinados. >
8
< Formato: Asegurarse de entender el formato de la documentación. Algunas documentaciones pueden
9 estar en formato de guía, tutorial, referencia o ejemplos, y cada uno tiene su propio enfoque y nivel de
10 detalle. >

11 < Vocabulario técnico: Aprender el vocabulario técnico específico del lenguaje. Esto permitirá entender
12 los términos técnicos utilizados en la documentación, lo que a su vez facilitará la comprensión de las
funcionalidades y su implementación. >
13
14 }

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

¿Cúales son las cuestiones a tener en cuenta a la hora de leer una documentación
1 en javascript? {
2
3 < Ejemplos: Prestar atención a los ejemplos proporcionados en la documentación. Estos pueden
ayudar a entender cómo se utiliza una funcionalidad en particular y a visualizar su implementación en
4 código. >
5
< Actualización: Tener en cuenta que la documentación puede actualizarse con el tiempo, y que puede
6
haber cambios en las funcionalidades o nuevas adiciones. Asegurarse de estar consultando la
7 documentación más actualizada para evitar posibles errores o confusiones. >
8
9 < Fuentes confiables: Asegurarse de que la documentación que se está leyendo proviene de una
fuente confiable, como la documentación oficial del lenguaje o sitios web reconocidos en la comunidad
10 de desarrollo de JavaScript. >
11
12
13
14 }

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 Ejemplos de aplicaciones creadas con una base en JavaScript {

2
3
4 <Documentación oficial de JavaScript> { proporciona información
5 completa y detallada sobre el lenguaje. Puedes encontrar
información sobre la sintaxis, las funciones, las estructuras de control
6 de flujo, los objetos y mucho más. }
7
8
9
10 <MDN Web Docs> { Mozilla Developer Network (MDN) Web Docs
es una excelente fuente de información sobre JavaScript. Ofrece
11 documentación detallada sobre el lenguaje, junto con tutoriales,
12 guías, demos y ejemplos de código. }
13
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 Ejemplos de aplicaciones creadas con una base en JavaScript {

2
3
<Stack Overflow> { es una comunidad en línea muy activa de
4 desarrolladores que pueden ayudarte a resolver problemas y
5 responder preguntas sobre JavaScript. Puedes buscar preguntas y
6 respuestas sobre temas específicos en JavaScript, o publicar una
7 pregunta tú mismo. }
8
9
10 <W3Schools> { es un sitio web popular que ofrece tutoriales y recursos
para desarrolladores web, incluyendo tutoriales sobre JavaScript. Los
11 tutoriales son concisos y fáciles de seguir, y también hay ejemplos de
12 código para ayudarte a entender los conceptos. }
13
14
}
Argentina Programa 4.0
 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1 ¿Cómo integrar JavaScript en un documento html? {

2
3
4 < Usando la etiqueta script, se tiene que agregar la etiqueta script dentro de la
<script> sección head o body del documento HTML y dentro de ella escribir el código
5 JavaScript.>
6
7
8
9
10 < Usando un archivo externo con extensión .js , también es posible incluir JavaScript
.js en un archivo externo y vincularlo al documento HTML. Esto se hace mediante la
11
etiqueta <script> con el atributo "src" que apunta al archivo JavaScript externo. >
12
13
}
14

Argentina Programa 4.0

 Introducción a JavaScript UNIDAD 3 - Desarrollo Web con Javascript

1
¿Cómo los navegadores interpretan javascript dentro de un
2 documento html? {
3 1) <Descarga el documento HTML: El navegador descarga el documento HTML desde el servidor web y
lo analiza para construir el árbol de nodos del documento. >
4
5 2) <Encuentra las etiquetas <script>: El navegador busca las etiquetas <script> en el documento HTML y
6 extrae el código JavaScript que se encuentra dentro de ellas.>

7 <Analiza el código JavaScript: El motor de JavaScript analiza el código JavaScript para detectar
3) cualquier error de sintaxis y compila el código en un formato que pueda ser ejecutado por el
8 navegador.>
9
10 4) <Ejecuta el código JavaScript: El motor de JavaScript ejecuta el código JavaScript en el orden en que
se encuentra en el documento HTML. Si se encuentra algún código que hace referencia a elementos
11 HTML en el documento, el motor de JavaScript espera a que esos elementos sean construidos antes
12 de ejecutar ese código.>

13 5) <Modifica el contenido de la página: Si el código JavaScript modifica el contenido de la página, el motor

de JavaScript actualiza el DOM (Document Object Model) del documento HTML para reflejar los
14 } cambios.>

Argentina Programa 4.0