The Big Web Developer

▷ Cómo CREAR BOTONES WEB con ANIMACIONES ✴️

2020-02-14T07:53:00.002-08:00

¡Suscríbete HOY!

🔻

Este Vídeo es 100% Recomendado para resolver las siguientes dudas:

Botones Web.
Efectos CSS para Botones.
Botones Para Página WEB.
Botones HTML Personalizados.
Animación CSS.
HTML CSS JAVASCRIPT.
Desarrollo Web desde cero.

⭐️ Cómo CREAR BOTONES WEB con EFECTOS│ANIMACIONES ⭐️ ✅ LINKS RECOMENDADOS: 💥GEEDHOSTING💥➠ https://geedhosting.com/ ✔️ Cómo CREAR BOTONES HTML y CSS【Vídeo】 ➠ https://youtu.be/k3GYvlpFriw ✔️ CREAR Cuenta de HOSTING GRATIS【Vídeo】 ➠ https://youtu.be/KHNsJjEnE4E ✔️ GANA DINERO Con GEEDHOSTING【Vídeo】 ➠ https://youtu.be/X9jNWCE1OMo ✔️ Tabla de Caracteres Especiales ➠ http://bit.ly/caracteres-especiales-html ✔️ Genera INGRESOS PASIVOS Online【Vídeo】 ➠ https://youtu.be/XCH2Dx0Ug6c 📥 PÁGINA DE DESCARGAS DEL CÓDIGO
▶ http://bit.ly/2XlMUUg ¡NOTA! Debes buscar los archivos: 🔹 "botonesHtmlCssAnimados.html" 🔹 "estilos_boton_animado.css" Ubicados en el área de "Curso HTML | CSS | JAVASCRIPT". ------------------------------------------------------------------------------------------ También queremos recomendarte temas MUY INTERESANTES como: ✅ Cómo SELECCIONAR VARIAS OPCIONES de un COMBOBOX HTML ▶ http://bit.ly/2Xzgequ ✅ ÍTEM SELECCIONADO por defecto en COMBOBOX HTML ▶ http://bit.ly/2XIrWPS ¿Deseas aprender más sobre el DESARROLLO DE APLICACIONES WEB? Hemos preparado para ti una serie de vídeos que darán solución a esa incansable búsqueda: ☢️ ¡DESCUBRE MÁS SOBRE DESARROLLO WEB!✔️: ▶ http://bit.ly/2smebnR 🔴¡SUSCRÍBETE a nuestro Canal!
➤ http://bit.ly/2ERgjNk Para Contacto / Negocios / Business 📧 Email: desarrollouh@hotmail.com ------------------------------------------------------------------------------------------ ¡ESCRÍBENOS! 📧 Formulario de Contacto: https://uh-tis.blogspot.com/p/formulario-de-contacto.html ------------------------------------------------------------------------------------------ 🔻 ▼ Contáctanos ▼ 🔻 🌎 Software Galaxia TV: 🔵 Email Para Contacto / Negocios / Business 📧 desarrollouh@hotmail.com 🔵Instagram: ➡ https://www.instagram.com/softwaregalaxiatv/ 🔵Blog Oficial Software Galaxia: ➡ https://uh-tis.blogspot.com/ 🔵Facebook: ➡ https://www.facebook.com/softwaregalaxia/ 🔴¡SUSCRÍBETE a Nuestro Canal de YouTube!
➤ http://bit.ly/2ERgjNk 👨🏽‍💻 Eduardo Bastidas UH: 🔵Instagram: ➡ https://www.instagram.com/eduardo_bastidas_uh/ 🔵Facebook Fan Page: ➡ https://www.facebook.com/eduardobastidasuh/ 🔵Twitter: ➡ https://twitter.com/ebastidasuh 👨🏻‍💻 Jorge Potes: 🔵Instagram: ➡ https://www.instagram.com/jorgeluispots/ 🔵Facebook Fan Page: ➡ https://www.facebook.com/jorgelpots/ ------------------------------------------------------------------------------------------ 🔴 En este vídeo encontrarás solución a TEMAS como: Cómo CREAR BOTONES WEB con ANIMACIONES Cómo CREAR BOTONES WEB con EFECTOS como hacer botón con efecto Desarrollo web Diseño Web botones personalizados botones para web botones para pagina web descargar botones para pagina web botones web botones web gratis efectos css para botones animacion css efecto hover botones css animation css effects css animation effects css hover effects css animation tutorial html html5 html y css html curso html pagina web html tutorial tutorial html html basico como hacer una pagina web en html curso html html tutorial for beginners learn html how to create a website using html html css html css javascript css css tutorial css3 html5 y css3 website html website html5 website html code website css simple website html javascript javascript tutorial javascript curso javascript descargar javascript tutorial for beginners learn javascript advanced javascript desarrollo web desarrollo web desde cero desarrollo web curso web page design web page maker css tutorial for beginners

Si te fue de gran ayuda esta información, no olvides compartirla con tus amigos y en tus redes sociales.

Si tienes dudas o sugerencias al respecto; abajo puedes dejarnos tus comentarios.

Bendiciones...

▶ Cómo SUBIR un Sitio Web en un HOSTING GRATIS ✔️

2020-01-23T10:44:00.000-08:00

¡Suscríbete HOY!

🔻

Este Vídeo es 100% Recomendado para resolver las siguientes dudas:

Cómo Subir un Sitio Web en un Hosting Gratis.
El Mejor Hosting.
Cómo subir página web a Hosting.
Subir Sitio Web con Filezilla.
Subir Página Rápido.
GEEDHosting.
Hosting Gratis con PHP y MySQL.

💥CUPÓN HOSTING COMPARTIDO💥➠ https://geedhosting.com/ ▶ 50% DCTO. = GEEDPP50 ⭐️ Cómo SUBIR una PÁGINA WEB a Internet GRATIS ⭐️ ------------------------------------------------------------------------------------------ ✅ LINKS RECOMENDADOS: ✔️ Crear Cuenta GRATIS en GEEDHOSTING ➠ https://youtu.be/KHNsJjEnE4E ✔️ Alojar Dominio en GEEDHOSTING ➠ https://youtu.be/rHy9T8pZz7I ✔️ Curso de BASES DE DATOS (MySQL) ➠ http://bit.ly/Curso_MySQL_BD ✔️ Conectar Proyecto PHP con MySQL ➠ https://youtu.be/KNfyL_VppkE ✔️ Descargar FILEZILLA ➠ http://greponozy.com/2WnW

¡¡¡🎁BONUS🎁!!!

💰 GENERA INGRESOS PASIVOS con HoneyGain ➠ https://youtu.be/XCH2Dx0Ug6c ------------------------------------------------------------------------------------------ También queremos recomendarte temas MUY INTERESANTES como: ✅ Cómo SELECCIONAR VARIAS OPCIONES de un COMBOBOX HTML ▶ http://bit.ly/2Xzgequ ✅ ÍTEM SELECCIONADO por defecto en COMBOBOX HTML ▶ http://bit.ly/2XIrWPS ¿Deseas aprender más sobre el DESARROLLO DE APLICACIONES WEB? Hemos preparado para ti una serie de vídeos que darán solución a esa incansable búsqueda: ☢️ ¡DESCUBRE MÁS SOBRE DESARROLLO WEB!✔️: ▶ http://bit.ly/2smebnR 🔴¡SUSCRÍBETE a nuestro Canal! ➤ http://bit.ly/2ERgjNk

Para Contacto / Negocios / Business 📧 Email: desarrollouh@hotmail.com ------------------------------------------------------------------------------------------ ¡ESCRÍBENOS! 📧 Formulario de Contacto: https://uh-tis.blogspot.com/p/formulario-de-contacto.html ------------------------------------------------------------------------------------------ 🔻 ▼ Contáctanos ▼ 🔻 🌎 Software Galaxia TV: 🔵 Email Para Contacto / Negocios / Business 📧 desarrollouh@hotmail.com 🔵Instagram: ➡ https://www.instagram.com/softwaregalaxiatv/ 🔵Blog Oficial Software Galaxia: ➡ https://uh-tis.blogspot.com/ 🔵Facebook: ➡ https://www.facebook.com/softwaregalaxia/ 🔴¡SUSCRÍBETE a Software Galaxia TVl! ➤ http://bit.ly/2ERgjNk 👨🏽‍💻 Eduardo Bastidas UH: 🔵Instagram: ➡ https://www.instagram.com/eduardo_bastidas_uh/ 🔵Facebook Fan Page: ➡ https://www.facebook.com/eduardobastidasuh/ 🔵Twitter: ➡ https://twitter.com/ebastidasuh 👨🏻‍💻 Jorge Potes: 🔵Instagram: ➡ https://www.instagram.com/jorgeluispots/ 🔵Facebook Fan Page: ➡ https://www.facebook.com/jorgelpots/ ------------------------------------------------------------------------------------------ 🔴 En este vídeo encontrarás solución a TEMAS como: como subir tu pagina web a internet como subir mi pagina a internet subir pagina web a internet subir pagina web a 000webhost subir sitio web con filezilla subir pagina web a 000webhost con base de datos como subir un sitio web como subir un sitio web en un hosting gratis como subir pagina web a internet como subir pagina web a hosting hosting de calidad hosting hosting gratis alojamiento web web hosting gratis sered hostgator pagina web subir una pagina web gratis subir pagina rapido subir pagina web a hosting gratuito hosting gratuito 000webhost geedhosting hosting gratis y de calidad el mejor hosting #HostingFree #ElMejorHosting #HostingGratis

Si te fue de gran ayuda esta información, no olvides compartirla con tus amigos y en tus redes sociales.

Si tienes dudas o sugerencias al respecto; abajo puedes dejarnos tus comentarios.

Bendiciones...

▷ Crear Botones HTML Personalizados 🔴

2020-01-06T19:41:00.000-08:00

¡Suscríbete HOY!

🔻

Este Vídeo es 100% Recomendado para resolver las siguientes dudas:

Botones Web.
Crear Botón HTML.
Botones Para Página WEB.
Botones HTML Personalizados.
Enlace Botón.
HTML CSS JAVASCRIPT.
Desarrollo Web desde cero.

⭐️ Cómo HACER BOTONES para PÁGINA WEB ⭐️ ------------------------------------------------------------------------------------------ ✅ LINKS RECOMENDADOS: 💥CUPÓN HOSTING COMPARTIDO💥➠ https://geedhosting.com/ ▶ 50% DCTO. = GEEDPP50 ✔️ Paleta de Colores ➠ http://bit.ly/PaletaColoresHTML ✔️ Font Awesome (Página de Iconos) ➠ http://pladollmo.com/V5O ✔️ Genera INGRESOS PASIVOS Online ➠ https://youtu.be/XCH2Dx0Ug6c 📥 PÁGINA DE DESCARGAS DEL CÓDIGO ▶ http://bit.ly/2XlMUUg

¡NOTA! Debes buscar los archivos: 🔹 "botonesHtmlCss.html" 🔹 "estilos_boton.css" Ubicados en el área de "Curso HTML | CSS | JAVASCRIPT". ------------------------------------------------------------------------------------------ También queremos recomendarte temas MUY INTERESANTES como: ✅ Cómo SELECCIONAR VARIAS OPCIONES de un COMBOBOX HTML ▶ http://bit.ly/2Xzgequ ✅ ÍTEM SELECCIONADO por defecto en COMBOBOX HTML ▶ http://bit.ly/2XIrWPS ¿Deseas aprender más sobre el DESARROLLO DE APLICACIONES WEB? Hemos preparado para ti una serie de vídeos que darán solución a esa incansable búsqueda: ☢️ ¡DESCUBRE MÁS SOBRE DESARROLLO WEB!✔️: ▶ http://bit.ly/2smebnR 🔴¡SUSCRÍBETE a nuestro Canal! ➤ http://bit.ly/2ERgjNk Para Contacto / Negocios / Business 📧 Email: desarrollouh@hotmail.com ------------------------------------------------------------------------------------------ ¡ESCRÍBENOS! 📧 Formulario de Contacto: https://uh-tis.blogspot.com/p/formulario-de-contacto.html ------------------------------------------------------------------------------------------ 🔻 ▼ Contáctanos ▼ 🔻 🌎 Software Galaxia TV: 🔵 Email Para Contacto / Negocios / Business 📧 desarrollouh@hotmail.com 🔵Instagram: ➡ https://www.instagram.com/softwaregalaxiatv/ 🔵Blog Oficial Software Galaxia: ➡ https://uh-tis.blogspot.com/ 🔵Facebook: ➡ https://www.facebook.com/softwaregalaxia/ 🔴¡SUSCRÍBETE a Software Galaxia TVl! ➤ http://bit.ly/2ERgjNk 👨🏽‍💻 Eduardo Bastidas UH: 🔵Instagram: ➡ https://www.instagram.com/eduardo_bastidas_uh/ 🔵Facebook Fan Page: ➡ https://www.facebook.com/eduardobastidasuh/ 🔵Twitter: ➡ https://twitter.com/ebastidasuh 👨🏻‍💻 Jorge Potes: 🔵Instagram: ➡ https://www.instagram.com/jorgeluispots/ 🔵Facebook Fan Page: ➡ https://www.facebook.com/jorgelpots/

Si te fue de gran ayuda esta información, no olvides compartirla con tus amigos y en tus redes sociales.

Si tienes dudas o sugerencias al respecto; abajo puedes dejarnos tus comentarios.

Bendiciones...

▶ Curso Básico de Javascript desde cero – Estructuras de Datos 【Arreglos Unidimensionales - Arrays (Lectura y Recorrido de Elementos)】.

2019-11-22T11:53:00.000-08:00

Curso JavaScript: Listado de Lecciones

Hola amigos lectores y seguidores de The Big Web Developer, seguimos explicando las temáticas de nuestro curso de JavaScript, en la entrada anterior estuvimos trabajando con los arrays o arreglos unidimensionales, estuvimos tratando lo básico como lo es el concepto y la sintaxis de este; si aún no has leído esta entrada te dejaré el vinculo por aqui para que te adentres en este tema, ▶ Curso Básico de Javascript desde cero – Estructuras de Datos 【Arreglos Unidimensionales - Arrays (Concepto y Sintaxis)】.

El dia de hoy profundizaremos más en el tema de los arrays el dia de hoy aprenderemos a leer y hacer un recorrido de los elementos almacenados en el array por lo tanto pondremos en práctica conceptos que ya conocemos cómo es el uso de bucles, al final de este tutorial habrás aprendido a pedir datos por teclado, almacenarlos en un arreglo unidimensional y listar estos datos accediendo a las posiciones de memoria que correspondan o que tenga el arreglo.
No siendo mas ¡comencemos!

Explicación por Videotutorial.

Si deseas puedes ver el Videotutorial que hicimos especialmente para ti, el cual tiene toda la información relevante del tema a tratar el dia de hoy.

Explicación por Fototutorial.

Iniciamos explicando cómo recorrer y agregar datos a un arreglo unidimensional de manera dinámica, estudiaremos varios casos de uso y estaremos detallando los procesos que realicemos, notaremos que los arrays en Javascript son una herramienta muy versátil y potente a la hora de trabajar en nuestros proyectos de programación .

1. Agregar Datos a un Array DINÁMICAMENTE.

Tenemos tres formas para declarar arreglos las cuales explicamos de manera detallada en la entrada anterior( ▶ Curso Básico de Javascript desde cero – Estructuras de Datos 【Arreglos Unidimensionales - Arrays (Concepto y Sintaxis)】.) la diferencia es que no hemos asignado ningún elemento a los respectivos arrays, en si estamos creando arrays de longitud cero(arrayInicial, arraySecundario) a diferencia del arrayTerciario al cual le hemos asignado una longitud de cuatro; para asignar datos de manera dinámica a los respectivos arrays vamos a trabajar con bucles para realizar el recorrido de las respectivas posiciones que tenga dicho array.

Creamos tres arreglos unidimensionales

Recordemos que al trabajar con arrays en Javascript la longitud de este no es estática por el contrario puede variar por lo tanto no es necesario reservar espacio en memoria con anterioridad, dicho esto hemos creado un bucle el cual se repetirá 100 veces, tenemos la variable contadora (i) la cual servirá como índice para acceder a las posiciones del array por lo tanto es obligatorio iniciar esta desde cero(0), una vez entrado al bucle asignamos un elemento al array para esto debemos acceder a la posición donde queremos almacenar dicho elemento (arrayInicial[i]) simplemente vamos asignarle un valor numérico el cual será i+1 esto para asegurarnos que el primer elemento a agregar sea el número 1 hasta llegar a 100.
Para finalizar simplemente imprimimos los elementos del array uno a uno, lo haremos en formato HTML, por lo tanto utilizamos la función document.write(), llamamos al array y accedemos a la posición (arrayInicial[i]) por último concatenamos con un salto de línea "<br>", esto para organizar los elementos a mostrar.

Asignar y Listar elementos de un Array

Al ejecutar nuestro script obtendremos el siguiente resultado en el cual mostramos el listado de números desde 1 hasta 100, los cuales hacen referencias a todos los elementos agregados en el array con esto concluimos que nuestro arreglo pasó de ser de longitud 0 a longitud 100.

Salida recorrido Array

Nota: Si tienes alguna duda con el manejo de bucles en específico el bucle FOR te recomiendo revises la siguiente entrada relacionada a esta temática ▶ Curso Básico de Javascript desde cero – Estructuras de control repetitivas 【BUCLE FOR】. .

2. Recorrido indefinido de un Array en Javascript.
Podemos llevar esto a otro nivel y agregar elementos a nuestro array de forma indefinida, con esto quiero decir que realizaremos iteraciones sin conocer de antemano el número de iteraciones a realizar, para esto vamos a trabajar con el bucle Do While; si no conoces este bucle te recomiendo la siguiente entrada: ▶ Curso Básico de Javascript desde cero – Estructuras de control repetitivas 【BUCLE DO WHILE】.

Iniciamos creando una variable la cual hemos llamado condicion la inicializamos en false esta variable será la que servirá como condición a evaluar cada vez que vayamos a iterar.
Seguido a esto creamos nuestra variable contadora (i) la cual servirá para acceder a las posiciones de memoria del array.
Creamos el bucle Do While el cual realizará iteraciones de manera indefinida mientras la variable condicion sea diferente de true.
Dentro del bucle procedemos a pedir datos por teclado haciendo uso de la función prompt(), Igualmente el valor pedido por teclado lo agregamos a nuestro array accediendo a la posición donde queremos asignar dicho elemento (arraySecundario[i]).
Seguido a esto nuestra variable contadora(i) se le sumará +1 en cada iteración, es importante resaltar que el primer valor que tendrá esta variable será 0.
Para finalizar hacemos uso de la función confirm() en la cual verificamos si el usuario desea terminar el proceso, dicha función devuelve true o false.

Recorrido indefinido de un array

Una vez terminadas las iteraciones procedemos a listar los elementos del array.

Iniciamos haciendo uso de la función document.write() en la cual imprimimos un mensaje en formato HTML, encerramos nuestro texto("Listado de datos") con etiquetas <h1> las cuales las utilizamos con el fin de mostrar nuestro texto en forma de título.
Creamos un Bucle For el cual tendrá los siguientes límites: la variable i inicia desde 0 hasta que i se menor(<) a la longitud del array, para conocer dicha longitud escribimos el nombre del arreglo que estamos trabajando (arraySecundario) seguido de la variable length la cual devolverá la longitud de este.
Una vez dentro del bucle recorremos cada elemento del array accediendo a sus posiciones e imprimimos los respectivos datos en pantalla.

Listar elementos de un array en Javascript

Al finalizar el proceso tendríamos un resultado similar al que apreciamos en la imagen, al final nuestro array es de longitud 4.

Listado de elementos del Arreglo

Con esto hemos concluido la lección del dia de hoy, en próximas entradas estaremos entrando a una sección mucho más interesante en la cual iniciamos a resolver ejercicios implementando Arrays, te recomiendo que mires el video tutorial donde ampliamos mucho más la lección del dia de hoy.

Puedes visualizar todo el código que estuvimos desarrollando a lo largo de este tutorial en la página jsfiddle, igualmente te lo dejamos por aquí.

Igualmente si estas interesado en desarrollar una página web, y aun no te decides en que hosting alojar dicha página te dejare una recomendación en la cual recibirás asombrosos descuentos siguiendo el siguiente Link.

🔴 CUPONES DE DESCUENTO PARA HOSTING COMPARTIDO EN
https://geedhosting.com/ 🔴
►50% DCTO. = GEEDPP50

Estos CUPONES DE DESCUENTO, sólo son válidos para el SERVICIO DE HOSTING, mas no para el Dominio.

▶ Curso Básico de Javascript desde cero – Estructuras de Datos 【Arreglos Unidimensionales - Arrays (Concepto y Sintaxis)】.

2019-11-19T08:40:00.000-08:00

Curso JavaScript: Listado de Lecciones

Hola amigos lectores y seguidores de The Big Web Developer, seguimos explicando las temáticas de nuestro curso de JavaScript, en la entrada anterior estuvimos tratando todo lo relacionado al bucle do while, si aún no has leído esta entrada te dejaré el vinculo por aqui para que te adentres en este tema, Curso Básico de Javascript desde cero – Estructuras de control repetitivas 【BUCLE DO WHILE】.

El dia de hoy iniciamos un nuevo tema; estaremos estudiando todo lo relacionado a las estructuras de datos especificamos hablaremos sobre los arreglos o arrays los cuales son de suma importancia para el tratamiento de datos en nuestras aplicaciones; el dia de hoy iniciaremos con lo básico como lo son los arreglos unidimensionales.
No siendo mas ¡comencemos!

Explicación por Videotutorial.

Si deseas puedes ver el Videotutorial que hicimos especialmente para ti, el cual tiene toda la información relevante acerca de las temáticas que estaremos tratando, la cual es todo lo relacionado a las estructuras de datos o arrays.

Explicación por Fototutorial.

La dinámica de la explicación será un poco distinta a las anteriores ya que no realizaremos ejercicios prácticos nos centraremos en el concepto, estructura y sintaxis de los arrays para poder entender de manera precisa cómo funcionan estos.

Concepto Array.
Un arreglo puede definirse como un grupo o una colección finita, homogénea y ordenada de elementos. fuente
La definición anteriormente expuesta es bastante general en si los arreglos independientemente del lenguaje de programación son estructuras finitas las cuales tienen un punto inicial y un punto de finalización, en este caso esto lo manejamos a través de dimensiones, igualmente los datos almacenados en dicha estructura van a compartir cierta similitud como por ejemplo el tipo de dato los cuales pueden ser de tipo numérico, cadena, o booleanos esto va depender mucho de la información o datos que deseamos tratar; para acceder a dichas posiciones en memoria necesitamos hacerlo a través de direcciones o índices, todo esto lo vamos a estudiar de forma más detallada a continuación.

Arrays en JAVASCRIPT
Los arrays (Array o matrices) son objetos de tipo lista cuyo prototipo tiene métodos para realizar operaciones de recorrido y mutación. Ni la longitud o los tipos de los elementos del array son fijos. Dado que la longitud de un array puede cambiar en cualquier momento. Fuente

Arrays En JAVASCRIPT

La definición anteriormente expuesta, tomada de la documentación oficial de JAVASCRIPT tiene varios puntos de suma importancia; los arrays en Javascript funcionan de manera distinta a otros lenguajes de programación podemos ver que los arreglos son totalmente dinámicos ya que estos pueden cambiar su longitud de manera constante por ej: podemos declarar un arreglo de longitud 4 y este puede cambiar a longitud 12 (Esto lo veremos más adelante), igualmente al trabajar con un lenguaje de tipado débil como lo es Javascript podemos trabajar en un mismo arreglo con múltiples tipos de datos (tipo numérico, cadena de texto, boleano, etc... ).
En conclusión podemos decir que los arrays de Javascript son multipropósito, pueden servir como listas(manejo dinámico) o como arreglos(manejo estático).

SINTAXIS.

Para declarar arreglos en Javascript tenemos tres métodos; podemos asignar los datos del array directamente, podemos hacerlo a través del constructor del objeto Array, por último podemos crear un array vacío declarando la longitud que llevará dicho array.

Sintaxis Arrays Javascript

A continuación mostramos las tres formas para declarar un arreglo con Javascript, utilizamos la palabra clave var seguido del nombre que llevará el array e inicializamos el array asignando los datos directamente, observamos que podemos utilizar en un mismo array datos de tipo cadena y numérico, todo esto será agregado dentro de corchetes( [] ).

Tenemos la segunda forma para declarar arrays la cual es haciendo uso de la palabra clave new seguido del objeto Array y asignamos los respectivos datos en este caso datos de tipo cadena(String) los dos primeros arrays son de longitud 3.

Por último tenemos la tercera forma para declarar un array en este caso cuando pasamos un solo argumento de tipo numérico al objeto Array, se asume que inicializamos un array vacío de 4 posiciones.

Declaramos un array en Javascript

IMPRIMIR UN ARREGLO O ARRAY.

Para poder acceder a las respectivas posiciones de un array lo hacemos a través de índices los cuales son identificadores numéricos, inicia desde la posición 0 hasta N-1(donde N-1 es igual a la longitud del array - 1), en este caso imprimimos todos los datos que tenemos en dicho arreglo el cual tiene tres posiciones de memoria reservados.

La salida de nuestro arreglo quedaría de la siguiente manera, para imprimir un mensaje utilizamos la función document.write().

Salida Array Javascript

Podemos imprimir todos los datos almacenados en el array simplemente escribiendo el nombre de dicho array como en este caso(Imagen), hacemos uso de la función document.write() y escribimos el nombre de nuestro objeto tipo array (arrayInicial).

Imprimir todos los datos

Tendremos una salida similar a esta(Imagen), en nuestro navegador.

Salida array

Incrementar La longitud de un Array Unidimensional Indirectamente.

Recordemos que hace un momento dijimos que los arreglos o arrays en Javascript son completamente dinámicos esto quiere decir que la longitud de este puede variar al momento de la ejecución de nuestros scripts, esto dependerá completamente de lo que estemos desarrollando o lo que requiera el problema que estemos resolviendo.

En la imagen podemos ver que nuestro array es de longitud 3 hemos asignado un nuevo dato en la posición 5(arrayInicial[5] = "Maria") la cual no existía pero al realizar este proceso estamos redimensionando nuestro array y ahora sería un array de longitud 6, en otros lenguajes de programación como por ejemplo JAVA esto generaría un error de desbordamiento pero en el caso de Javascript es totalmente válido.

Redimensionar arreglo en javascript

La salida de mi arreglo redimensionado sería similar a lo que podemos apreciar en la imagen, en la cual tenemos los datos que ya teníamos almacenados("Juan", "Luis", 2) y tenemos el nuevo dato agregado en la posición 5, las posiciones 3 y 4 se imprimen como vacío ya que no tenemos agregando ningún dato allí.

Salida array redimensionado

Con esto habríamos terminado la explicación relacionada a los arrays específicamente a los arreglos unidimensionales les recomiendo mirar el video en el cual explicamos de una manera mucho más precisa el funcionamiento de los arrays, igualmente esto no termina aquí en próximas entradas estaremos profundizando más acerca de los arreglos unidimensionales.

Igualmente si estas interesado en desarrollar una pagina web, y aun no te decides en que hosting alojar dicha pagina te dejare una recomendación en la cual recibirás asombrosos descuentos siguiendo el siguiente Link.

▷ Cómo CREAR un DOMINIO GRATIS en Internet ✔️

2019-10-23T06:51:00.001-07:00

¡Suscríbete HOY!

🔻

Este Vídeo es 100% Recomendado para resolver las siguientes dudas:

Dominio Gratis para siempre.
Cómo registrar un Dominio en Internet.
Dominio Gratis para página web.
Hosting y Dominio Gratis.
Dominio tk.
GEEDHosting.
Freenom.

💥CUPÓN HOSTING COMPARTIDO💥➠ https://geedhosting.com/
▶ 50% DCTO. = GEEDPP50

------------------------------------------------------------------------------------------

⭐️ En este vídeo aprenderás el Paso a Paso para obtener un Dominio Gratis en Internet, podrás ver de una forma detallada el proceso de enlazar este nuevo Dominio con tu servicio de Hosting Gratuito y/o Pago.

Para este tutorial usamos los siguientes recursos:

*PÁGINA WEB DE "FREENOM":

➤ https://www.freenom.com/

*Servicio de Hosting Gratis de "GEEDHOSTING":

➤ https://geedhosting.com/

------------------------------------------------------------------------------------------

☢️ ¡DESCUBRE SOBRE WEB HOSTING GRATUITO!
En nuestra lista de videos de 🖥 HOSTING 100% GRATIS ✔️:
➡ http://bit.ly/2CBH9pH

🔴¡SUSCRÍBETE a nuestro Canal de YouTube! ➤ http://bit.ly/2ERgjNk

Para Contacto / Negocios / Business
📧 Email: desarrollouh@hotmail.com

Si te fue de gran ayuda esta información, no olvides compartirla con tus amigos y en tus redes sociales.

Si tienes dudas o sugerencias al respecto; abajo puedes dejarnos tus comentarios.

Bendiciones...

▶ Curso Básico de Javascript desde cero – Estructuras de control repetitivas 【BUCLE DO WHILE】.

2019-10-17T11:00:00.000-07:00

🔴¿Quieres Obtener el MEJOR HOSTING GRATIS? HAZ CLIC AQUÍ

Curso JavaScript: Listado de Lecciones

Hola amigos lectores y seguidores de The Big Web Developer, seguimos explicando las temáticas de nuestro curso de JavaScript, en la entrada anterior estuvimos tratando todo lo relacionado al bucle while, si aún no has leído esta entrada te dejaré el vinculo por aqui para que te adentres en este tema, Curso Básico de Javascript desde cero – Estructuras de control repetitivas 【BUCLE WHILE】.

El dia de hoy seguiremos con las estructuras de control repetitivas pero en esta ocasión nos centraremos en el bucle do while, explicaremos los aspectos más relevantes de este; concepto, estructura y realizaremos un par de ejercicios prácticos para comprender la lógica del mismo, es importante resaltar que el concepto es relativamente el mismo a los bucles(for, while) estudiados con anterioridad, igualmente cada uno de estos bucles o estructuras repetitivas se pueden usar en diversos casos los cuales estaremos abordando a lo largo de esta explicación. No siendo mas ¡comencemos!

Explicación por Videotutorial.

Explicación por Fototutorial.

La dinámica de la explicación será la siguiente; iniciamos con los conceptos claves sobre el bucle do while, estudiaremos la estructura del mismo, haremos una comparación en relación a los otros bucles y para finalizar realizaremos unos ejercicios para reforzar conocimientos.

BUCLE DO WHILE.
La sentencia do while crea un bucle que ejecuta una sentencia especificada, hasta que la condición de comprobación se evalúa como falsa. La condición se evalúa después de ejecutar la sentencia, dando como resultado que la sentencia especificada se ejecute al menos una vez. fuente

¿Cuando utilizamos el bucle do while?
Al igual que el bucle FOR este lo utilizamos cuando deseamos iterar o repetir una o más instrucciones un número determinado de veces, el bucle DO WHILE al igual que el bucle WHILE puede iterar un número indeterminado de veces siempre y cuando la condición a evaluar sea verdadera.

ESTRUCTURA BUCLE DO WHILE.
La sintaxis del bucle do while en Javascript se divide de la siguiente forma: Iniciamos con la palabra clave do, seguido de la sentencia o instrucciones a ejecutar y terminamos con la condición a evaluar con la cual determinamos si el bucle sigue iterando o no, la documentación oficial lo define de la siguiente manera.

Estructura Bucle Do While

sentencia:
Una sentencia que se ejecuta al menos una vez y es re-ejecutada cada vez que la condición se evalúa a verdadera. Para ejecutar múltiples sentencias dentro de un bucle, utilice la sentencia block({}) para agrupar aquellas sentencias.sentencia que se ejecuta mientras la condición se evalúa como verdadera. Fuente

condición:
Una expresión se evalúa después de cada pase del bucle. Si condición se evalúa como verdadera, la sentencia se re-ejecuta. Cuando condición se evalúa como falsa, el control pasa a la siguiente sentencia de do..while. Fuente

Aspectos relevantes Bucle FOR, WHILE y DO WHILE:
Según mi experiencia personal generalmente trabajo con el Bucle FOR Y WHILE, el Bucle DO WHILE no es tan utilizado como los anteriormente mencionados, de igual forma es un bucle de suma importancia.
El Bucle FOR lo utilizamos cuando de entrada conocemos el número de iteraciones que deseamos realizar, como por ejemplo recorrer un Arreglo Unidimensional, Por el contrario el Bucle WHILE y DO WHILE, lo utilizamos para realizar iteraciones indeterminadas donde requerimos de una condición que se evalúa en cada iteración, la diferencia más significativa entre estos dos bucles(while y do while) es que en uno(while) evaluamos la condición al inicio y el otro(do while) evaluamos la condición al final y esto permite que dicho bucle se ejecute por lo menos una vez, independientemente si la condición se cumple o no.

Ejercicios Prácticos.

1- Escriba un programa donde se puedan leer tantos números como se quiera hasta que llegue a un cero el resultado es la suma de todos los números leídos.

Para resolver este ejercicio debemos identificar lo que necesitamos, iniciamos declarando dos variables las cuales son num, la utilizaremos para almacenar los valores que pediremos por teclado y la variable suma, la utilizaremos para obtener la sumatoria de todos los valores ingresados por teclado.

Declaramos Variables

Creamos un Bucle DO WHILE, el cual tendrá como condición a evaluar num!=0, esto quiere decir que; mientras el numero ingresado por teclado sea diferente de 0 se continúa iterando.
Asignamos a la variable num el valor obtenido por teclado a través de la función prompt(), seguido a esto convertimos el valor ingresado a enteró a través del método parseInt().
Asignamos a la variable suma, los valores almacenados en la variable num, esta variable(suma) trabajará como acumulador.
Al finalizar el bucle mostramos el resultado obtenido alojado en la variable suma haciendo uso del método alert().

Creamos Bucle Do While

2- Escriba un programa que permita emular un login o inicio de sesión.

El siguiente ejercicio tiene un nivel de dificultad un poco más alto, estuvimos realizando este mismo ejercicio en la entrada pasada utilizando el bucle while, el dia de hoy lo haremos utilizando el bucle do while.

Lo primero que debemos hacer es identificar y declarar las variables que utilizaremos la cuales serán las siguientes: usuario y pass; utilizaremos estas variables para almacenar el usuario y contraseña correctos, por otra parte declaramos las variables username y password; las cuales utilizaremos para obtener los valores que serán ingresados por teclado, por último declaramos la variable condicion; la cual la utilizaremos para controlar el bucle esta tendrá dos estados true o false.

Declaramos Variables

Creamos un bucle do while, el cual tendrá como condición a evaluar mientras la variable condicion sea igual a true.
Pedimos por teclado el usuario y contraseña de inicio de sesión haciendo uso de la función prompt().
Creamos un condicional donde comparamos si el usuario ingresado es diferente al usuario real igualmente con la contraseña, si al menos uno de estos dos valores no coinciden se imprime un mensaje donde mostramos que el usuario o contraseña no son válidos; seguido a esto asignamos a la variable condicion true, esto garantiza que el bucle continue iterando.
Por otro lado si los datos son correctos, el inicio de sesión será exitoso y asignamos a la variable condicion false de esta manera se detendra el bucle.

Creamos bucle do while y sentencias

3- Los padres de una niña le prometieron darle 10 dólares cuando cumpliera 12 años de edad y duplicar el regalo en cada cumpleaños subsiguiente hasta que el regalo excediera 1000 dólares. Escriba un programa para determinar qué edad tendrá la niña cuando se le dé la última cantidad y la cantidad total recibida.

Declaramos las respectivas variables, el enunciado dice que la niña cuando cumpla 12 años le darán 10 dólares, por lo tanto creamos la variable edad y la inicializamos en 12, igualmente creamos la variable dólares y la inicializamos en 10, cada vez que la niña cumpla años se le duplicará la cifra del dinero por lo tanto necesitamos una variable que vaya acumulando el dinero obtenido, necesitamos determinar que edad tendra la niña cuando el regalo exceda los 1000 dólares.

Creamos el bucle do while, el cual tendrá como condición a evaluar total<1000, esto quiere decir mientras el regalo no exceda los 1000 dólares se continuara iterando.
Por cada iteración se multiplicará por dos la variable dólares, esto hace referencia a cada cumpleaños que tenga la niña.
Vamos acumulando el dinero total de los regalos que ha tenido la niña haciendo uso de la variable total, la cual es variable acumuladora.
Aumentamos de 1 en 1 la variable edad.
Al finalizar el bucle imprimimos un mensaje; con la edad, el total en dólares y el total de dinero que recibió la niña.

Creamos el Bucle DO WHILE

Con esto habríamos terminado la explicación de las estructuras repetitivas, específicamente el bucle do while recuerda que para dominar este tipo de estructuras aparte de conocer, la sintaxis y su funcionamiento es importante la lógica que se aplique a este teniendo en cuenta el problema que deseamos resolver.

Puedes visualizar todo el código que estuvimos desarrollando a lo largo de este tutorial en la página jsfiddle, igualmente te lo dejamos por aquí.

▷ EL MEJOR HOSTING GRATUITO ✅ para subir Páginas Web.

2019-10-16T12:48:00.001-07:00

¡Suscríbete HOY!

🔻

Este Vídeo es 100% Recomendado para resolver las siguientes dudas:

Hosting Gratis y de Calidad.
El Mejor Hosting.
Cómo subir página web a Hosting.
Hosting Gratis para WordPress.
Cómo elegir un buen Hosting.
GEEDHosting.
Hosting Gratis con PHP y MySQL.

💥CUPÓN HOSTING COMPARTIDO💥➠ https://geedhosting.com/
▶ 50% DCTO. = GEEDPP50

------------------------------------------------------------------------------------------
⭐️ En esta oportunidad veremos el PASO A PASO, para poder acceder a El Mejor Hosting Gratis de Por Vida.

¿Por qué es tan importante un HOSTING?

Hay muchísimas razones, y entre ellas encontramos:

*Hoy en día tener una página web es muy necesario, y aún más viendo que todos los negocios están girando entorno a Internet. Y para poder tener nuestro sitio web accesible a todas las personas en todo el mundo, lógicamente debemos contar con un servicio de Alojamiento Web.

* Un Desarrollador Web (WebMaster), necesita hacer pruebas de sus proyectos, y dichas pruebas las puede hacer con un servidor local.
Pero sería muchísimo mejor tener la posibilidad de que el proyecto a realizar pase todos lo test en un entorno de ejecución real; es decir, que se pueda probar en un HOSTING PROFESIONAL, que permitirá una mayor seguridad a la hora de ya entrar en funcionamiento en la etapa de Producción.

Ahora, teniendo en cuenta todo lo anterior, por eso hemos traído este vídeo donde te mostramos una forma fácil de obtener una cuenta de HOSTING GRATIS, y no cualquier servicio de Alojamiento Web, sino uno que de verdad va a ayudarte a dar el primer paso para que tus sitios web y/o proyectos puedan tener presencia en Internet.

Se trata de la empresa GEEDHOSTING, la cual ofrece varios servicios como: Hosting Compartido (Personal y Business), Hosting Semi Dedicado (Principiante, Pro, y Avanzado), Hosting VPS (Principiante, Pro, y Avanzado), Dominios, y Certificados SSL.

Pero también nos ofrece la posibilidad de usar su Servicio de Hosting Gratis, que de verdad está Genial, y cuenta con muchas características que no encontraremos en otros servicios de este tipo, entre ellas:

• 1 GB de Espacio en Disco
• 5 GB Tráfico Mensual
• 1 Hosting de Dominio
• 3 Subdominios
• Servidor DNS Gratis
• PHP, Perl/CGI-BIN
• 1 base de datos MySQL
• Acceso FTP
• 1 E-mail POP3/IMAP
• Configuración de Cuenta al Instante
• Administrador de Archivos con base en la Web
• Panel de Control Fácil de Usar
• RAID Backups Confiables
• Plataforma de Hosting GRID
• Servidores Super Rápidos
• Centro de Datos Confiable
• Red Ultra Rápida
• Garantía de 99.8% de Tiempo de Funcionamiento
• Monitoreo de Red 24/7
• Soporte de Ticket 24x7
• Completamente Actualizable
• Y mucho más...

------------------------------------------------------------------------------------------

Para este tutorial usamos los siguientes recursos:

*Servicio de Hosting Gratis de "GEEDHOSTING":
➤ https://geedhosting.com/

------------------------------------------------------------------------------------------

☢️ ¡DESCUBRE SOBRE WEB HOSTING GRATUITO!
En nuestra lista de videos de 🖥 HOSTING 100% GRATIS ✔️:
➡ http://bit.ly/2CBH9pH

🔴¡SUSCRÍBETE a nuestro Canal de YouTube! ➤ http://bit.ly/2ERgjNk

Para Contacto / Negocios / Business
📧 Email: desarrollouh@hotmail.com

Si te fue de gran ayuda esta información, no olvides compartirla con tus amigos y en tus redes sociales.

Si tienes dudas o sugerencias al respecto; abajo puedes dejarnos tus comentarios.

Bendiciones...

▶ Curso Básico de Javascript desde cero – Estructuras de control repetitivas 【BUCLE WHILE】.

2019-10-07T22:34:00.002-07:00

Curso JavaScript: Listado de Lecciones

Hola amigos lectores y seguidores de The Big Web Developer, seguimos explicando las temáticas de nuestro curso de JavaScript, en la entrada anterior estuvimos tratando todo lo relacionado al bucle for, si aún no has leído esta entrada te dejaré el vinculo por aqui para que te adentres en este tema, Curso Básico de Javascript desde cero – Estructuras de control repetitivas 【BUCLE FOR】.

El dia de hoy seguiremos con las estructuras de control repetitivas pero en esta ocasión nos centraremos en el bucle while, explicaremos los aspectos más relevantes de este; concepto, estructura y realizaremos un par de ejercicios prácticos para comprender la lógica del mismo. No siendo mas ¡comencemos!

Explicación por Videotutorial.

Explicación por Fototutorial.

La dinámica de la explicación será la siguiente; iniciamos con los conceptos claves sobre el bucle while, estudiaremos la estructura del mismo, casos de uso, comparación entre el bucle while y el bucle for y realizaremos ejercicios prácticos para comprender la lógica de programación de este.

BUCLE WHILE.
El bucle WHILE al igual que el bucle FOR, es una estructura de control repetitiva la cual crea un bucle que ejecuta una sentencia especificada mientras cierta condición se evalúe como verdadera. Dicha condición es evaluada antes de ejecutar la sentencia. Fuente

¿Cuando utilizamos el bucle while?
Al igual que el bucle FOR este lo utilizamos cuando deseamos iterar o repetir una o más instrucciones un número determinado de veces, el bucle WHILE incluso puede ejecutarse un número indeterminado de veces, esto quiere decir que el bucle WHILE puede ejecutarse sin saber cuántas iteraciones se van a realizar.

ESTRUCTURA BUCLE WHILE.
La sintaxis del bucle while en Javascript se divide de la siguiente forma: Iniciamos con la palabra clave while, seguido de la condición a evaluar la cual se repetirá hasta que dicha condición sea igual a falso, la sentencia hace referencia a las instrucciones que se van a repetir.

condición:
Una expresión que se evalúa antes de cada paso del bucle. Si esta condición se evalúa como verdadera, se ejecuta sentencia. Cuando la condición se evalúa como false, la ejecución continúa con la sentencia posterior al bucle while. Fuente

sentencia:
Una sentencia que se ejecuta mientras la condición se evalúa como verdadera. Para ejecutar múltiples sentencias dentro de un bucle, utiliza una sentencia block({}) para agrupar esas sentencias. Fuente

Estructura Bucle While

Comparación Bucle FOR y Bucle WHILE:
Ambos bucles son de gran utilidad a la hora de programar e implementar códigos repetitivos, el bucle FOR lo utilizamos cuando conocemos inicialmente el número de iteraciones o repeticiones que se van a realizar, por el contrario el Bucle WHILE puede cumplir esa función igualmente pero dicho Bucle también podemos utilizarlo cuando no conocemos el número de iteraciones que se van a realizar esto lo vamos a ver a continuación en un ejemplo práctico que estaremos realizando.

Desarrollo del Script.

1- Bucle while Javascript - Imprimir los números de 0 hasta 10.
Para este ejercicio necesitamos imprimir los números comprendidos entre 0 y 10, por lo tanto necesitamos iterar utilizando el bucle while. Lo primero que necesitamos, es identificar la condición a evaluar la cual será mientras la variable i sea menor o igual(<=) a 10, para esto necesitamos crear dicha variable haciendo uso de la palabra clave var y la inicializamos en 0.
Dentro del ciclo simplemente haremos que la variable i vaya aumentando de 1 en 1(i++), mostraremos dicho resultado en pantalla haciendo uso de la función document.write().
Cuando se detenga la iteración mostraremos en que terminó la variable i, por logica deberia ser igual a 11.

Nota: Debemos ser muy cuidadosos al momento de realizar la condición a evaluar ya que podríamos caer en un bucle infinito que no es más que un error lógico.

Ejercicio # 1 Bucle while javascript

2- Bucle while Javascript - Ingreso de números menores que 100.

El siguiente ejercicio es una manera muy práctica de ilustrar el caso de iteraciones indeterminadas con el bucle while esto se debe a que no conocemos inicialmente el número de iteraciones a realizar.

El enunciado principal dice que debemos ingresar valores numéricos por teclado hasta que uno de los números ingresados sea mayor que 100.

Iniciamos creando la variable controladora la cual le hemos llamado num, la inicializamos en cero(0), igualmente creamos una variable contadora(i) para calcular el número de iteraciones que se realizarán.

Creamos el bucle while y pasamos como condición mientras num(variable controladora) sea menor o igual(<=) que 100.

Dentro del ciclo o bucle pedimos números por teclado a través de la función prompt() igualmente la variable i aumentará de 1 en 1(i++).

El bucle se detendrá cuando el número ingresado por teclado sea mayor que 100 igualmente se mostrará un mensaje en pantalla en el cual imprimimos el número de iteraciones que se realizaron.

Ejercicio # 2 Bucle while javascript

3- Bucle while Javascript - Login o Inicio de sesión.

El siguiente ejercicio es un poco más complejo en el cual realizaremos un login o inicio de sesión en el cual se ingresa un usuario y una contraseña, se validará si es el usuario y contraseña son correctos de lo contrario se itera hasta que dicho usuario y contraseña sean el correcto.

Iniciamos creando dos variables(usuario y pass) las cuales le asignamos dos cadenas de texto que hacen referencia al usuario y contraseña con las cuales se inicia la sesión.

Creamos dos variables(username y password), los cuales le asignaremos datos que pediremos por teclado a través de la función prompt(), estos datos harán referencia al usuario y contraseña que utilizamos para iniciar la sesión.

Creamos el bucle while el cual tendrá una condición anidada vamos a comparar valores los cuales se dividen en dos bloques: username!=usuario donde comparamos el usuario ingresado por teclado con el usuario por default, para que dicha condición se cumpla deben ser distintos, el segundo bloque sería pass!=password; al menos unas de estas condiciones se deben cumplir para que el bucle se repita, por esta razón utilizamos el operador lógico O(||).

Una vez se evalúe que el usuario o contraseña son incorrectos, se ejecutarán las líneas de código del bucle el cual inicia imprimiendo un mensaje por pantalla haciéndole saber que el usuario o contraseña no son correctos, seguido a esto se vuelve a pedir datos por teclado haciendo referencia al usuario y contraseña, el bucle se detendrá cuando los datos ingresados sean los correctos.

Por último creamos un condicional donde validamos si el usuario y contraseña son correctos, si lo son; imprimimos un mensaje de "inicio de sesión exitoso" de lo contrario mostramos un mensaje de "no se pudo iniciar sesión".

Bucle while - Javascript

Con esto habríamos terminado la explicación de las estructuras repetitivas, específicamente el bucle while recuerda que para dominar este tipo de estructuras aparte de conocer, la sintaxis y su funcionamiento es importante la lógica que se aplique a este teniendo en cuenta el problema que deseamos resolver.

Puedes visualizar todo el código que estuvimos desarrollando a lo largo de este tutorial en la página jsfiddle, igualmente te lo dejamos por aquí.

▶ Curso Básico de Javascript desde cero – Estructuras de control repetitivas 【BUCLE FOR】.

2019-08-08T13:55:00.001-07:00

Curso JavaScript: Listado de Lecciones

Hola amigos lectores y seguidores de The Big Web Developer, seguimos explicando las temáticas de nuestro curso de JavaScript, en la entrada anterior estuvimos tratando la temática de estructuras de control, específicamente estructuras condicionales tales como: If, Else, Switch-Case, si aún no has leeido esta entrada te dejaré el vinculo por aqui para que te adentres en la temática, Curso básico de Javascript desde cero - Estructuras de control(Condicionales if, else, else if, switch case).

El dia de hoy seguiremos con las estructuras de control pero en esta ocasión nos centraremos en las estructuras repetitivas o bucles, quizás muchos sabrán que este tipo de estructuras nos permiten repetir una o más operaciones un número determinado de veces, los bucles más utilizados son el bucle for, while y do while; el dia de hoy trataremos todo lo relacionado al Bucle for estaremos realizando un par de ejemplos prácticos para entender un poco la lógica de funcionamiento del mismo. No siendo mas ¡comencemos!

Explicación por Videotutorial.

Explicación por Fototutorial.

La dinámica de la explicación será la siguiente; iniciamos con los conceptos claves sobre el bucle for, conoceremos la estructura básica del mismo y para finalizar realizaremos una serie de ejercicios prácticos que nos ayudarán a desarrollar la lógica de programación a la hora de trabajar con este bucle.

BUCLE FOR.
El concepto general sería el siguiente: "El bucle for es una estructura de control en programación en la que se puede indicar de antemano el número de iteraciones". Fuente

¿Cuando utilizamos el bucle for? Este se utiliza cuando deseamos repetir una o más instrucciones un número determinado de veces, por lo tanto el Bucle For generalmente lo utilizamos cuando sabemos el número de veces que queremos que se ejecute, como regla general al utilizar este bucle debemos conocer el punto de entrada y el punto final de dicha iteración.

ESTRUCTURA BUCLE FOR.
La sintaxis del bucle for en Javascript se divide en tres partes las cuales son: Expresión inicial, Condición, Expresión final.

Estructura bucle for

Expresión inicial: Una expresión (incluyendo las expresiones de asignación) o la declaración de variable. Típicamente se utiliza para usarse como variable contador. Esta expresión puede opcionalmente declarar nuevas variables con la palabra clase var. Estas variables no son locales del bucle, es decir, están en el mismo alcance en el que está el bucle for. fuente

Para concluir cuando nos referimos a la expresión inicial del bucle for hacemos referencia a una operación de asignación o declaración de variable la cual se convierte en nuestra variable contadora, este sería el punto de partida del bucle.

Condición: Una expresión para ser evaluada antes de cada iteración del bucle. Si esta expresión se evalúa como verdadera, se ejecuta la sentencia. Esta comprobación condicional es opcional. Si se omite, la condición siempre se evalúa como verdadera. Si la expresión se evalúa como falsa, la ejecución salta a la primera expresión que sigue al constructor de for. fuente

Esta condición se evalúa para determinar cuándo debe terminar el bucle, cada vez que esta expresión devuelve true el bucle itera de lo contrario se detendrá.

Expresión final: Una expresión para ser evaluada al final de cada iteración del bucle. Esto ocurre antes de la siguiente evaluación de la condición, generalmente se usa para actualizar o incrementar la variable contadora. fuente

ESTRUCTURA BUCLE FOR JAVASCRIPT.

A Continuación ilustramos un ejemplo donde podemos apreciar la estructura general del bucle for.

tenemos como punto de partida que declaramos una variable a la cual llamamos i y está la inicializamos en 1.
Tenemos la condición en la cual evaluamos que la variable i sea menor o igual a 10 cuando dicha variable sobrepase ese límite el bucle se detendrá.
La expresión final hacemos una operación de incremento en la cual la variable i aumentará de 1 en 1, igualmente puede aumentar de 2 en 2, 3 en 3, incluso realizar una operación de decremento, esto dependerá del problema que vayamos a resolver.
Para finalizar se ejecutan las sentencias, para este caso solo vamos a imprimir los números del 1 al 10, para esto hacemos uso de la función document.write y de esta manera escribir código html, igualmente imprimimos un salto de línea para mostrar los números de manera ordenada.

estructura bucle for javascript

Operación de decremento bucle for

Desarrollo del Script.

1- Ejercicios prácticos bucle for Javascript - Tablas de multiplicar.

Necesitamos imprimir los resultado de la tabla del 8 iniciando desde 8 * 1 hasta 8 * 12, para realizar este proceso haremos uso de un bucle for el cual iniciara en 1 y terminará cuando la variable i sea mayor que 12, se realizará un incremento de la variable contadora de 1 en 1.
Las sentencias a trabajar serían las siguientes, iniciamos declarando una variable(resultado) la cual le asignaremos el resultado de multiplicar 8 * i donde i contendrá el valor que deseamos multiplicar, recordemos que i es la variable contadora.
Para finalizar imprimimos el resultado haciendo uso de la función document.write.

Tabla de multiplicar Javascript

2- Ejercicios prácticos bucle for Javascript - Nota mayor y menor.

Este ejercicio tiene un nivel de dificultad un poco más alto por lo tanto lo vamos a explicar paso a paso, este consiste en ingresar 4 notas referentes a un alumno y dependiendo de esto imprimir la nota más alta y la nota más baja.

Iniciamos creando dos variables(mayor y menor), las cuales serán las encargadas de almacenar las respectivas notas que deseamos mostrar.
Creamos el bucle for el cual realizará 4 iteración como lo pide el enunciado del ejercicio.
Creamos una variable a la cual llamamos nota, esta recibirá el valor que se ingrese por teclado el cual será convertido a valor real(float) para poder hacer una comparación mucho más precisa de las cifras ingresadas, igualmente hacemos uso de la función prompt() y de esta manera obtener dicho valor ingresado.

Nota mayor y nota menor Javascript

Lo siguiente que haremos será crear un condicional en el cual evaluamos si la variable i es igual a 1, esto lo hacemos con el fin de inicializar las variables mayor y menor en la primera iteración a la cual le asignaremos la primera nota ingresada.

Estructura condicional

En la sección del sino creamos dos condicionales en los cuales evaluaremos lo siguiente; el primer condicional evaluamos si el valor de la variable mayor es menor(<) a la nota ingresada si es asi actualizamos el valor de dicha variable asignándole la nueva nota, en el segundo condicional hacemos la operación inversa con la variable menor si dicha variable es mayor(>) a la nota ingresada se actualiza el valor de la variable asignándole la nota ingresada.

Nota mayor y menor Javascript

Para finalizar imprimimos el respectivo resultado igualmente hacemos uso de la función document.write() para imprimir los respectivos resultado los cuales serán los contenidos en la variable mayor y menor

Nota mayor y nota menor Javascript

Con esto habríamos terminado la explicación de las estructuras repetitivas, específicamente el bucle for recuerda que para dominar este tipo de estructuras aparte de conocer, la sintaxis y su funcionamiento es importante la lógica que se aplique a este teniendo en cuenta el problema que deseamos resolver.

Puedes visualizar todo el código que estuvimos desarrollando a lo largo de este tutorial en la página jsfiddle, igualmente te lo dejamos por aquí.

▶ Curso Básico de Javascript desde cero – Estructuras de control (Condicionales if, else, else if, switch case).

2019-07-25T13:52:00.000-07:00

Curso JavaScript: Listado de Lecciones

Hola amigos lectores y seguidores de The Big Web Developer, seguimos explicando las temáticas de nuestro curso de JavaScript, en la entrada anterior estuvimos tratando el tema de variables, tipos de variables y operadores aritméticos, si aún no has leeido esta entrada te dejaré el vinculo por aqui para que te adentres en la temática, Curso básico de JavaScript desde cero - Variables, Tipos de Variables y Operadores aritméticos.

El dia de hoy estaremos estudiando otro tema el cual es, las estructuras de control específicamente las estructuras de tipo condicional(if-else, switch-case), estaremos evaluando la sintaxis del mismo y haremos un par de ejemplos prácticos que nos serán de gran ayuda para comprender el funcionamiento de estas, igualmente al finalizar este POST comprenderás cómo están divididas dichas estructuras de control. No siendo mas ¡comencemos!

Explicación por Videotutorial.

Explicación por Fototutorial.

Seguiremos la dinámica de entradas anteriores, por lo tanto iniciaremos explicando un poco los conceptos a tratar el dia de hoy, estaremos dividiendo la temática por secciones, iniciemos con lo más importante y esto es comprender lo que son las estructuras de control.

ESTRUCTURAS DE CONTROL.

En el mundo de la programación a la hora de resolver un problema por más sencillo que parezca, la solución siempre nos brindara múltiples caminos y esto es lo hermoso de la programación y el desarrollo de software en general.

En la entrada anterior estuvimos realizando un ejemplo sencillo donde teníamos una simple operación aritmética, esa solución solo nos brinda un camino o una secuencia de instrucciones a ejecutarse por lo tanto es un programa bastante básico.

Secuencia de instrucciones JavaScript

La realidad es que todos los programas o paginas web que tenemos hoy en dia nos brindan múltiples funcionalidades, por ejemplo: si se realiza una acción hacer esto de lo contrario realiza otro proceso, para hacer este tipo de programas o páginas web se necesitan de las estructuras de control, las cuales son instrucciones de tipo "si se cumple dicha condición, haz esto; sino se cumple, haz esto otro". igualmente existen instrucciones del tipo "repite esto mientras se cumpla esta condición".
Cuando aplicamos o utilizamos estas estructuras de control, los programas dejan de ser una simple sucesión lineal de instrucciones para convertirse en programas inteligentes, los cuales tomarán decisiones en función de las variables que se evalúen.

Estructuras de control JavaScript

CARACTERÍSTICAS DE LAS ESTRUCTURAS DE CONTROL.

Una estructura de control solo tiene un único punto de entrada y salida.
Una estructura de control está compuesta de sentencias o incluso de otras estructuras de control.
Una estructura de control nos brinda múltiples caminos en una única solución(software).
Las estructuras de control nos brinda un programa mucho más dinámico.

TIPOS DE ESTRUCTURAS DE CONTROL.

Existen tres tipos fundamentales de estructuras de control en JavaScript y en general cualquier lenguaje de programación, ya que manejan casi la misma lógica o estándar en relación a las estructuras de control.

1- Estructuras de control secuencial.

Esta estructura es demasiado simple, y en el ejemplo de la entrada anterior lo aplicamos linea por linea, esta indica una secuencia de instrucciones o acciones a ser ejecutadas de forma consecutiva o secuencial, en este tipo de estructura no hay condicionales o estructuras repetitivas, por lo tanto es utilizada para trabajar resolución de algoritmos bastante sencillos, como por ejemplo:

Estructura secuencial JavaScript

2- Estructuras de control alternativa.

Este tipo de estructuras serán el tema a tratar en la entrada de hoy aquí entran en juego los condicionales, si, sino, sino si, dependiendo de(casos), son estructuras mucho más complejas pero muy útiles a la hora del desarrollo de software, igualmente estas se subdividen en estructuras simples, dobles y múltiples; las cuales estudiaremos con un ejercicio práctico.

3- Estructuras de control repetitivas.

Este tipo de estructuras las estudiaremos en próximas entradas, pero aquí operan los llamados ciclos o bucles, los cuales se utilizan mucho en programación son los encargados de realizar tareas tales como: "mientras se cumpla esta condición, repite esto".

OPERADORES LÓGICOS.

En JavaScript disponemos de los operadores lógicos habituales en lenguajes de programación como son "es igual", "es distinto", menor, menor o igual, mayor o igual, and(y), or(o) y not(no). La sintaxis se basa en símbolos como veremos a continuación y cabe destacar que hay que prestar atención a no confundir == con = porque implican distintas cosa. fuente

operadores lógicos javascript

Lo operadores lógicos son de suma importancia a la hora de trabajar con estructuras de control, ya que nos ayudan a comparar o a evaluar las condiciones que deseamos evaluar por ejemplo si deseamos evaluar si una variable de tipo numérico es mayor o igual a 10, para esto debemos hacer uso de un operador lógico(>=).
En JavaScript contamos con dos operadores que posiblemente no hayas trabajado en otros lenguajes los cuales son el ===(es estrictramente igual) Y !== (no es estrictamente igual), con estos operadores evaluaremos una sentencia de manera mucho más estricta por ejemplo al comparar 1 == "1" esto devolverá true, caso distinto sería 1==="1" esto devolverá false, la razón es muy simple, aunque los valores son iguales los tipos de datos son distintos.

Desarrollo del Script.

A continuación iniciaremos con el desarrollo de las líneas de código que nos permitirán trabajar con las estructuras de control alternativas simples, dobles y múltiples, al final del POST encontrarás el código fuente del ejercicio.

ENUNCIADO:

Realiza un Script que, ingresada una calificación del 1 al 10, muestre por pantalla el siguiente mensaje. Cuando la calificación sea de 7 o superior mostrar "APROBADO".

1- Estructura de control alternativa simple: Iniciaremos estudiando los condicionales simples, los cuales solo evalúan una condición, la estructura para crear condicionales con JavaScript es similar a la de otros lenguajes de programación, if(condición){sentencias}.

Partiendo del enunciado de nuestro ejercicio, debemos evaluar si la calificación supera la puntuación de 7 e imprimir un mensaje de APROBADO, igualmente realizamos un filtro en el cual debemos verificar que dicho valor ingresado sea entre 1 y 10.

Lo primero que hacemos es crear una variable a la cual llamamos "calificacion", hacemos uso de la función prompt() la cual sirve para obtener valores por teclado, y lo que devuelve esta función lo asignamos a la variable creada.

Comparamos con un condicional si la calificación ingresada está entre el rango de 7 - 10, para esto hacemos uso del operador de comparación y(&&), el cual lo usamos cuando necesitamos evaluar que todas las expresiones sean ciertas, luego imprimimos el mensaje "APROBADO" haciendo uso de la función alert().

Nota: Si deseas ver el funcionamiento de este código te invito a que vayas al final del POST y ejecutes el código fuente.

Estructura Condicional Simple

2- Estructura de control alternativa doble: En este tipo de estructura, agregamos la contraparte del if y este es el else, de esta manera realizaremos un condicional mucho más completo con dos caminos posibles.
Siguiendo con el ejemplo anterior una vez validado si la calificación no está entre el rango de 7 - 10, imprimimos un mensaje de "REPROBADO".

Estructura condicional doble JavaScript

3- Estructura de control alternativa multiple: Este tipo de estructura es mucho más compleja, pero igualmente la más completa de todas, también conocido como condicionales anidados, si ya comprendes los condicionales anteriormente expuesto te será mucho más sencillo comprender este, vamos a ver como actúa este condicional para efectos de nuestro ejercicio.

Condicional multiple JavaScript

La estructura condicional de nuestro ejercicio cambió drásticamente y esto se debe a que hicimos varias validaciones para tener un resultado mucho más óptimo, explicaremos esto punto a punto.

A- Iniciamos evaluando si la calificación es válida, para determinar esto verificamos si la calificación está en el rango de 1 - 10, de lo contrario imprimimos un mensaje informado que la calificación no es válida.

B- Realizamos un condicional de tipo if, else if, else; en la cual verificamos múltiples condiciones como por ejemplo: verificamos si la calificación está entre el rango de 7 - 9 y luego verificamos si la calificación es igual a 10 de lo contrario imprimimos un mensaje de "REPROBADO".

Otra estructura condicional multiple es Switch case es una estructura de control empleada en programación. Se utiliza para agilizar la toma de decisiones múltiples; trabaja de la misma manera que lo harían sucesivos if, if else anidados, El switch no es tan popular como el if, pero se utiliza con regularidad en la programación. En principio la funcionalidad de un switch también se puede implementar con múltiples if anidados. En el caso de que haya muchas acciones dependientes de muchos valores iniciales, es recomendable su uso. El switch favorece la facilidad y rapidez en la programación. fuente

Estructura condicional switch-case

Para efectos de nuestro ejercicio agregamos varias cosas; iniciamos declarando una variable a la cual hemos llamado menu, esta obtendrá un valor de tipo entero por lo tanto se hace necesario convertir dicho resultado que devuelva la función prompt() a entero haciendo uso de la función parseInt().

Creamos la sentencia switch-case, la cual le pasamos como condición la variable menu, vamos a evaluar dos caso; cuando menu sea igual a 1 o 2, de lo contrario creamos la sentencia default e imprimimos un mensaje de opción inválida.

En el caso 1, realizamos la operación o el ejercicio de las calificaciones y en el caso 2, realizaremos la suma de dos números recordemos que este ejercicio lo estuvimos realizando en el POST anterior.

Debemos tener en cuenta que cuando usamos la función prompt() esta siempre devolverá una cadena de texto, por lo tanto si vamos a tratar con valores numérico o a hacer una operación aritmética debemos realizar una conversión a datos de tipo numérico, ya sea a entero o real.

Con esto habríamos terminado la explicación de las estructuras de control, recuerda que para dominar este tipo de estructuras aparte de conocer, la sintaxis y su funcionamiento es importante la lógica que se aplique a este teniendo en cuenta el problema que deseamos resolver.

Puedes visualizar todo el código que estuvimos desarrollando a lo largo de este tutorial en la página jsfiddle, igualmente te lo dejamos por aquí.

▶ Curso Básico de Javascript desde cero – Variables, tipos de variables y operaciones aritméticas

2019-07-23T09:33:00.002-07:00

Curso JavaScript: Listado de Lecciones

Hola amigos lectores y seguidores de The Big Web Developer, continuamos con la serie de tutoriales que dimos inicio en una entrada anterior, Curso Básico de javascript desde cero - Introducción(Mis primeras lineas de código).
Donde estuvimos viendo varios puntos importantes a considerar a la hora de trabajar con JavaScript e igualmente estuvimos desarrollando el famoso hola mundo.
Hoy vamos a entrar un poco más en contexto de lo que es este lenguaje y vamos a estar estudiando la temática relacionada a las variables, estaremos estudiando la sintaxis para crear variables con JavaScript e igualmente estudiaremos los tipos de variables con los que podemos trabajar en este lenguaje, sin más preámbulos demos inicio a la clase de hoy, espero sea de gran utilidad para ti.

Explicación por Videotutorial.

Si deseas puedes ver el Videotutorial que hicimos especialmente para ti, el cual tiene toda la información relevante acerca de las temáticas que estaremos tratando, recuerda todo girara en torno a las variables y los distintos usos que podemos darle a la hora de desarrollar nuestros scripts.

Explicación por Fototutorial.

Lo primero que debemos tener en cuenta antes de iniciar a estudiar la sintaxis que maneja JavaScript relacionado a las variables, es el concepto de las mismas el cual es un concepto muy importante para poder saber en base a que vamos a trabajar.

¿QUE ES UNA VARIABLE?

"En programación, las variables son espacios reservados en la memoria que, como su nombre indica pueden cambiar de contenido a lo largo de la ejecución de un programa. Una variable corresponde a un área reservada en la memoria principal del ordenador." fuente

El concepto anteriormente expuesto lo podemos interpretar como un elemento el cual es utilizado para almacenar y hacer referencia a otro valor, un caso similar sucede con las variables en álgebra, por Ej.:

Ejemplo ejercicio álgebra

En la imagen tenemos tres variables (x, y, z), se realiza una suma donde z es igual a x más y, teniendo en cuenta que x=1 y y=2, al realizar la respectiva suma obtenemos que el resultado final es z=3, de esta misma manera se aplica el concepto en la programación.

OPERADORES ARITMÉTICOS.

Los operadores aritméticos como su nombre lo indica son aquellos encargados de manipular los datos numéricos, ya sean enteros o valores reales, existen dos tipos de operadores aritméticos: unarios y binarios, los operadores unarios son aquellos que se anteponen a la expresión aritmética (-1), y los operadores binarios son aquellos que se sitúan entre dos expresiones aritméticas (2+1).

En la mayoría de lenguajes de programación se manejan normalmente los operadores básicos que son: adición (+), sustracción (-), multiplicación (*) y división (/).
JavaScript no es la excepción y manejaremos estos operadores aritméticos a lo largo del desarrollo de esta entrada.

Operadores aritméticos principales javascript

Desarrollo del Script.

A continuación iniciaremos con el desarrollo de las líneas de código que nos permitirán crear las variables y realizar las respectivas operaciones tales como: Suma, Resta, Multiplicación y división.

1- Estructura de variables: para declarar una variable en JavaScript, siempre se sigue la misma estructura, utilizamos la palabra clave var, seguido del nombre de la variable en este caso la variable la hemos llamado x.

para declarar variables y evitar errores es importante saber que dicho nombre de variable no debe iniciar con un número o carácter especial como por ejemplo: 1mivariable(esto no es permitido), *mivariable(esto no es permitido).

los únicos caracteres especiales permitidos son: _(guion bajo), $(signo de dolar).

Estructura de variable javascript

2- Asignación de datos: Para realizar el proceso de asignación a una variable declarada, simplemente bastaría con utilizar el operador de asignación (=), seguido del tipo de dato.
En JavaScript y en cualquier lenguaje de programación se manejan los tipos de datos más comunes los cuales son:

Entero, Real, Cadena de texto y boleano. Lo que podemos destacar de la imagen es la declaración de variables de tipo cadena de texto la cual siempre se escribirá entre comillas ("mi cadena"), y el tipo de dato boleano el cual solo permite dos estados los cuales son true o false.

Asignación de datos a variables

TIPADO FUERTE VS TIPADO DÉBIL.
Antes de continuar se hace necesario explicar un concepto que debemos tener en cuenta a la hora de trabajar con JavaScript y en general con cualquier lenguaje de programación y este es el concepto de tipado.

El tipado no es más que la manera o la forma en la cual nosotros declaramos las variables, existen dos tipos de tipado los cuales son: tipado fuerte y tipado débil.

Tipado Fuerte:

Un lenguaje de programación es fuertemente tipado si no se permiten violaciones de los tipos de datos, es decir, dado el valor de una variable de un tipo concreto, no se puede usar como si fuera de otro tipo distinto a menos que se haga una conversión. fuente

Tipado Débil:

El tipado débil se podría definir como la contraparte de los lenguajes fuertemente tipados ya que en estos no es necesario especificar el tipo de dato con el cual se trabajará una variable, por el contrario en este tipo de lenguajes de programación una variable podría tomar distintos tipos de datos a lo largo de la ejecución de un programa.

Quizás ya lo notaste, pero JavaScript es un lenguaje de programación de tipado débil, por lo tanto no es necesario especificar si una variable será de tipo entero, real o una cadena de texto. Esto trae consigo sus ventajas ya que podemos reutilizar las variables que declaremos para distintos casos y no para una tarea en específico, pero claro también trae consigo sus desventajas ya que debemos ser cuidadosos, porque estaremos más propensos a sufrir de errores lógicos.

3- Distintos casos de uso: Para redeclarar variables se sigue el mismo patrón, solo bastaría con llamar nuestra variable y asignar el nuevo valor que esta tendrá, en la imagen se ilustra un par de casos en los cuales se reasignan valores a las variables tomamos como ejemplo la variable x.

Caso 1: La manera correcta de declarar variables es, llamando a dicha variable (x), utilizando el operador de asignación (=), seguido del valor a asignar (13), cabe destacar que ese nuevo valor a asignar podría ser cualquier tipo de dato y no generaría ningún tipo de error.

Caso 2: Aquí pareciera que todo está correcto y no hay errores, pero JavaScript es sensible a mayúsculas por lo tanto X, no se reconoce como una variable y esto devolverá un error, ya que debemos especificar o escribir la variable exactamente igual como la declaramos al principio.

Caso 3: Para reasignar datos a una variable NO es necesario volver a escribir la palabra reservada var, porque de esta manera no estaríamos reasignando sino redeclarando una variable ya existente y por lo tanto esto generará un error.

Re-declarar variables con JavaScript

4- Ejercicio Práctico: Vamos a emular el ejemplo anteriormente expuesto de la operación algebraica en el cual decíamos que z iba a ser igual (=) a x más (+) y.

A- El primer paso es declarar las respectivas variables, las cuales son 3(x, y, z), tanto la variable x como y la inicializamos con valores de 1 y 2 respectivamente, por último declaramos la variable z, la cual no está inicializada aun.

B- Inicializamos la variable z a la cual le vamos a asignar la variable x + y, esto nos da a entender que vamos a obtener la suma de los datos contenidos en esta variable (1 y 2), igualmente se realizan las distintas operaciones aritméticas(suma, resta, multiplicación y división). Mostramos dichos resultas por consola, con la función console.log().

Operaciones Aritméticas con JavaScript

5- Resultado Final: Al ejecutar nuestro Script obtenemos la siguiente salida, con las operaciones aritméticas, cabe destacar que lo que devolvemos es el valor que tiene la variable z.

Resultado final ejercicio JavaScript

Puedes visualizar todo el código que estuvimos desarrollando a lo largo de este tutorial en la pagina jsfiddle, igualmente te lo dejamos por aquí.

▶ Curso Básico de Javascript desde cero – Introducción(Mis primeras lineas de código)

2019-07-19T11:30:00.000-07:00

Curso JavaScript: Listado de Lecciones

Hola amigos lectores y seguidores de The Big Web Developer, el día de hoy le damos inicio a un curso que en lo personal es una pieza fundamental cuando hablamos de desarrollo web, estaremos trabajando con un lenguaje de programación muy popular en este entorno, este es nada mas y nada menos que Javascript, un titan en el mundo del desarrollo web es uno de los lenguajes de programación con mayor demanda laboral y con proyección al futuro, la idea de compartir lo aprendido a lo largo de mi experiencia con este lenguaje es poder ayudar a las personas que se inician recientemente en el campo del desarrollo web, y porque no seguir fortaleciendo conocimientos de manera personal.

Un poco de historia.

Javascript nace de la necesidad de crear paginas web a un mas complejas, a principios de los años 90 la velocidad de conexión de Internet era demasiado lenta, la velocidad máxima era de 28.8 kbps, para esa época ya se empezaban a desarrollar paginas web las cuales poseían formularios bastante complejos, donde el usuario ingresaba los datos estos eran enviados al servidor y en caso de que surgiera algún error este devolvía un mensaje con dichos errores, esto hacia que la velocidad de navegación y experiencia de los usuario fuese aun mas lenta.

Por esta razón se pensó en una forma de poder validar dicha información antes de ser enviada al servidor y de esta manera el usuario pudiese corregir dichos errores y que la espera fuese menor.

¿Que es Javascript?

JavaScript fue desarrollado originalmente por Brendan Eich de Netscape con el nombre de Mocha, el cual fue renombrado posteriormente a LiveScript, para finalmente quedar como JavaScript. El cambio de nombre coincidió aproximadamente con el momento en que Netscape agregó compatibilidad con la tecnología Java en su navegador web Netscape Navigator en la versión 2.002 en diciembre de 1995. La denominación produjo confusión, dando la impresión de que el lenguaje es una prolongación de Java, y se ha caracterizado por muchos como una estrategia de mercadotecnia de Netscape para obtener prestigio e innovar en el ámbito de los nuevos lenguajes de programación web.

Nota: si quieres conocer un poco mas de esta historia te dejo el link para que consultes dicha información e igualmente hay mucha información de esto en la web, Javascript.

Experiencia Personal.

Al ser un lenguaje tan potente y con múltiples funcionalidades es difícil encasillarlo en una sola categoría, personalmente conocí este lenguaje cuando surgió la necesidad de realizar tareas dinámicas en las paginas web que desarrollaba como por ejemplo, realizar validaciones a un formulario sin necesidad de recargar la pagina o enviar algún tipo de información al servidor.

Lenguaje Javascript

Javascript puede ser utilizado del lado del cliente o servidor, cuando iniciamos con este lenguaje es normal creer que solo es un lenguaje que nos ayuda a controlar los componentes gráficos de nuestra pagina web o nos ayuda a realizar operaciones lógicas de lado del cliente, pero la verdad es que este lenguaje igualmente puede ser ejecutado del lado del servidor; esto va a depender de las funcionalidades que requieran los desarrollos que realicemos, si quieres saber un poco mas acerca de como implementar este lenguaje del lado del servidor puedes leer el siguiente articulo node.js, la finalidad de este curso es mirar la estructura básica de este lenguaje para que podamos tener las bases del mismo y de esta manera en un futuro poder mirar temas aun mas complejos.

Primeros Pasos.

En este curso básico vamos a tratar de abarcar de lo mas mínimo hasta llegar un punto de dificultad considerable, por lo tanto si una persona no ha tenido experiencia programando en otros lenguajes esto le puede interesar ya que vamos a trabajar la estructura básica que se maneja en cualquier lenguaje de programación como por ejemplo: Estructuras de control, variables, ciclos, clases, objetos etc.
Vamos a trabajar inicialmente con Javascript del lado del cliente por lo tanto estaremos utilizando lenguajes de etiquetas o marcado como es HTML , si no tienes idea de como utilizar esto, no te preocupes ya que vamos a verlo de una manera muy básica ya que la finalidad de esto es trabajar a fondo con el lenguaje Javascript.

Herramientas de Desarrollo:
Para esta serie de tutoriales necesitaremos un programa donde escribir nuestro código, los hay de diversos tipos mencionaré algunos y al final daré mi recomendación de cual utilizar para esta serie de tutoriales.

Los IDE o entorno de desarrollo integrado, en estos se pueden realizar muchas tareas complejas ahorrándonos mucho trabajo, por ejemplo NetBeans el cual he utilizado en muchas ocasiones.

Netebeans IDE

Los Editores de texto, son herramientas bastante livianas pero muy potentes personalmente prefiero estos cuando estoy desarrollando paginas web, es cuestión de gustos pero también de estabilidad ya que por otra parte los IDE pueden ser mas pesados y van a correr un poco mas lento en PC´s de bajo rendimiento, pero bueno los editores que he utilizado son los siguientes:

Sublime Text: es un editor bastante sencillo de utilizar muy eficiente y con una gran cantidad de plugins con los cuales se puede cambiar la apariencia entre otras cosas, el manejo de carpetas es muy bueno, posee una versión potable y una versión full Pagina oficial.

Sublime text

Visual Studio Code: es un editor que he estado utilizado recientemente y la verdad no me ha decepcionado tiene todo lo antes mencionado en sublime text y posee un plus que es el manejo de versiones con el cual me resulta mas fácil actualizar los repositorios en Git, y bueno actualmente es donde desarrollo todo lo relacionado a la web, por lo tanto recomiendo este editor para esta serie de tutoriales ya que es bastante completo Pagina Oficial.

Visual Studio Code

Igualmente cada ejemplo que estemos desarrollando estará disponible siempre de manera online en una web que nos permite probar todo el código que desarrollemos y esta es JSFIDDLE, será como nuestro editor de texto online, igualmente si ustedes desean probar código Javascript, HTML, CSS e incluso diversos frameworks que existen en el mercado tales como: vue.js, react, Bootstrap, entre otros.

JSFIDDLE Editor de código

Bueno amigos esto ha sido todo por el momento, la finalidad de esta entrada era abarcar de una manera general como estaremos trabajando esta serie de tutoriales, las herramientas que utilizaremos entre otras cosas... la finalidad de esta serie de tutoriales es que sea de una manera practica y así aprender las bases de este gran lenguaje de programación.

Mi Primer Script.

A continuación detallamos una serie de pasos para iniciar a codificar con este lenguaje, vamos a imprimir un mensaje por consola y otro de forma gráfica que es lo mas habitual, recordemos que este lenguaje es el que utilizamos para controlar los componentes de nuestra interfaz Gráfica o Front-End y obviamente podemos realizar operaciones lógicas con el mismo.

1- Creamos un archivo de extensión .js: Trabajando en visual studio code y en cualquier editor de código, lo primero que hacemos es crear un nuevo archivo, seleccionamos la opcion: File/New File

Creamos un nuevo archivo

2- Agregamos un nombre a nuestro archivo: Lo mas recomendable es dividir nuestros proyectos por carpetas aunque este sea demasiado corto esto con el fin de tener nuestros archivos organizados, igualmente en próximas entradas explicaremos mas a detalle la estructura de las carpetas. El nombre de nuestro archivo será mi-primer-script.js, es de suma importancia la extensión .js la cual es utilizada cuando programamos en javascript.

3- Agregamos lineas de código: Creamos el famoso hola mundo el cual lo hemos hecho de dos formas, por consola e igualmente imprimimos un mensaje que se visualizara en un cuadro de dialogo.

el código alert(), es una función nativa del lenguaje javascript el cual le pasamos como parámetro una cadena de texto el cual es el código que queremos imprimir, es una función muy utilizada a la hora de imprimir un mensaje generalmente después de realizar cierta operación.

Hola mundo javascript

4- Creamos un archivo HTML: Para poder poner a prueba nuestro pequeño ejemplo debemos crear un archivo con extensión .html al cual llamaremos principal, ya que no podemos probar nuestro código javascript directamente en los navegadores, por lo tanto en la sección de las etiquetas <head> vamos a llamar nuestro código de javascript, para esto hacemos uso de la etiqueta <script> y haciendo uso de la propiedad src le pasaremos la ubicación de nuestro archivo .js, como ambos archivos se encuentran alojados en la misma carpeta solo bastaría con escribir el nombre de nuestro archivo(mi-primer-script.js).

Código html

5- Resultado Final: Al abrir nuestro archivo HTML en el navegador obtenemos el siguiente mensaje, este hace referencia a la función alert a la cual le pasamos como parámetro el mensaje hola mundo, igualmente visualizamos el mensaje por consola el cual podemos verlo en las herramientas para desarrolladores en la sección console.

Resultado Final

Herramientas para desarrolladores consola

Puedes visualizar todo el código que estuvimos desarrollando a lo largo de este tutorial en la pagina jsfiddle, allí podrás probar dichas lineas de código en tiempo real.

▷ Select Box HTML Personalizado 💚

2019-07-10T15:58:00.000-07:00

¡Suscríbete HOY!

🔻

Este Vídeo es 100% Recomendado para resolver las siguientes dudas:

Select Option HTML.
ComboBox HTML.
Lista Desplegable HTML.
Combobox Personalizado.
Scroll Vertical Combobox HTML.
HTML CSS JAVASCRIPT.
Desarrollo Web desde cero.

⭐️ SCROLL VERTICAL CSS COMBOBOX HTML ⭐️

💚 CUPONES DE DESCUENTO PARA HOSTING EN SERED 💚
➠ https://clientes.sered.net/aff.php?aff=3030
► SGTV2M (Hosting GRATIS x 2 MESES)
► SGTV10ANUAL (Descuento 10% - Hosting Anual)

Estos CUPONES DE DESCUENTO, sólo son válidos para el SERVICIO DE HOSTING, mas NO para el Dominio.

------------------------------------------------------------------------------------------

📥 PÁGINA DE DESCARGAS ▶ http://bit.ly/2XlMUUg

¡NOTA!
Debes buscar los archivos:
✔️ "combobox_personalizado.html"
✔️ "plugin jQuery ms-Dropdown.rar"
Ubicados en el área de "Curso HTML | CSS | JAVASCRIPT".

------------------------------------------------------------------------------------------

¿Deseas saber cómo poner Imágenes/Iconos a un COMBOBOX CSS?

Entre los mayores objetivos de los diseñadores y desarrolladores de Páginas Web, es el brindar una excelente y agradable experiencia a los usuarios de las mismas.

Uno de los componentes que hemos estado usando y configurando últimamente en este Curso de HTML | CSS | JAVASCRIPT, es el SELECT BOX y/o COMBOBOX.
Y en esta oportunidad te enseñaremos a cómo darle un aspecto mucho más llamativo, a través de una librería llamada "ms-Dropdown", la cual podemos encontrar en Internet y usar de forma libre y gratuita.

Básicamente, nos permitirá asignarle iconos a las opciones (ítems) de nuestro elemento ComboBox, ademas se mostrará un Scroll Vertical de forma automática cuando hayan muchos ítems en dicho componente, también se aplicarán muchos más efectos, como bordes redondeados, icono personalizado de la flecha (Arrow 🔻), entre otros...

También queremos recomendarte temas MUY INTERESANTES como:

✅ Cómo SELECCIONAR VARIAS OPCIONES de un COMBOBOX HTML ▶ http://bit.ly/2Xzgequ
✅ ÍTEM SELECCIONADO por defecto en COMBOBOX HTML ▶ http://bit.ly/2XIrWPS
¿Deseas aprender más sobre el DESARROLLO DE APLICACIONES WEB?

Hemos preparado para ti una serie de vídeos que darán solución a esa incansable búsqueda:
☢️ ¡DESCUBRE MÁS SOBRE DESARROLLO WEB!✔️:
▶ http://bit.ly/2smebnR

🔴¡SUSCRÍBETE a nuestro Canal de YouTube! ➤ http://bit.ly/2ERgjNk

Para Contacto / Negocios / Business
📧 Email: desarrollouh@hotmail.com

Si te fue de gran ayuda esta información, no olvides compartirla con tus amigos y en tus redes sociales.

Si tienes dudas o sugerencias al respecto; abajo puedes dejarnos tus comentarios.

Bendiciones...

▷ SELECT MULTIPLE HTML ✅

2019-07-01T09:03:00.000-07:00

¡Suscríbete HOY!

🔻

Este Vídeo es 100% Recomendado para resolver las siguientes dudas:

Select Option HTML.
ComboBox HTML.
Lista Desplegable HTML.
Select Multiple ComboBox.
Multiple Selection List.
HTML CSS JAVASCRIPT.
Desarrollo Web desde cero.

Cómo subir página web a Hosting.
Cómo subir página web a Internet.
Cómo subir un sitio web en un Hosting Gratis.
Cómo subir un sitio web a Internet.
Cómo subir mi página web a 000Webhost con Filezilla.
How to upload website for Free.
How to upload web page.

Si te fue de gran ayuda esta información, no olvides compartirla con tus amigos y en tus redes sociales.

Si tienes dudas o sugerencias al respecto; abajo puedes dejarnos tus comentarios.

Bendiciones...