Curso Pr谩ctico de JavaScript

Curso Pr谩ctico de JavaScript

Juan David Castro Gallego

Juan David Castro Gallego

隆Es tu turno: crea un tutorial!

9/29

Lectura

馃憠 隆Nada demuestra mejor que sabes algo cuando logras explic谩rselo a otra persona! As铆 que es hora de ponerte a prueba 馃挴

...

Reg铆strate o inicia sesi贸n para leer el resto del contenido.

Aportes 84

Preguntas 2

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

No puedo creer que sea el primer comentario en esto

Aqu铆 les dejo mi tutorial 隆Media Queries con JS (B谩sico)! 馃槢

Quinto comentario, espero les sirva para entender mejor la recursividad! 馃馃徎

馃寑 C贸mo usar Recursividad para calcular la serie Fibonacci 馃寑

馃鉁

En las preguntas relacionadas con objetos se me cruzaron algunos conceptos, y realic茅 este tutorial para que en un futuro ustedes no tengan dificultad en entenderlos c:
.
Objeto Literal y Objeto de Clase en Javascript
馃挌

ac谩 dejo mi aporte de como convertir varios objetos a array a la vez https://platzi.com/tutoriales/3271-javascript-practico/24744-como-pasar-varios-objetos-a-arrays-y-despues-guardarlos-en-una-variable-e-imprimirlos/

muestra como simplificarias este codigo en los comentarios

Este es mi tutorial, trate de hacer uso de lo que se ha visto hasta ahora, pero enfoc谩ndome en lo que yo considero es una de las partes m谩s importantes que debemos aprender a usar.

https://platzi.com/tutoriales/3271-javascript-practico/30805-objetos-de-manera-sencilla/

Aqui les dejo mi tutorial sobre Arrays :D [JavaScript: Domina los Arrays (platzi.com)](https://platzi.com/tutoriales/3271-javascript-practico/31006-javascript-domina-los-arrays/)

Hola platzinauta 馃憢

Por aqui dejo mi tutorial sobre la diferencia entre objetos y arrays y cuando deber铆amos usar uno u otro.

Espero te sea 煤til 馃殌

Aqui les dejo mi tutorial!
Hola Mundo!

Si quieres como usar los objetos b谩sicamente esta:
隆C贸mo trabajar con los objetos f谩cilmente!

Hello world! les comparto mi tutorial: C贸mo transformar un objeto a un arregllo

Hello guys! This is my brief tutorial and introduction on how to create objects. I hope y鈥檃ll like it

https://platzi.com/tutoriales/3271-javascript-practico/24181-creating-objects-with-javascript/

cordial saludo. comparto tutorial.

enlace tutorial

muchas gracias

Les dejo un tutorial de como yo hice el ejercicio 2 de las funciones en el test de js, es un poco avanzado pero creo que si se explica bastante bien
Entra aqu铆

\*\**\*FOR mas de una forma de recorrer un array\**\*\* \_Si eres de los que piensa que solo hay una forma de usar \*\*FOR\*\* 聽para recorrer un arreglo...Aqu铆 te muestro otras formas de como hacerlo \_ Generalmente para recorrer un \*\*array\*\* utilizamos una estructura llamada bucle y generalmente tambi茅n 聽nos inclinamos a hacerlo usando el bucle \*\*FOR\*\* de la forma tradicional, en la cual , definimos e inicializamos un contador,y vamos incrementando el contador, para ir recorriendo el array y verificando si es el elemento que necesitamos... bueno manos a la obra... pero no podemos recorrer un array si no hay array ... entonces vamos a hacer uno ```jsconst heroes =\['Batman', 聽'Ironman', 聽'Superman', 'Thor', 'Mujer Maravilla', 'Hombre ara帽a', 'Aquaman', 'Pantera negra'];```antes de continuar vamos a recordar como se usa el bucle FOR de la manera tradicional ```jsconsole.warn(' FOR tradicional ');//Esto solo es un t铆tulo para que lo veas en la consolafor(let i = 0; i < heroes.length; i++ 聽){聽 聽 console.log( heroes\[i]);}```y este es el resultado !\[tuto for tradicional.png]\(<u>https://static.platzi.com/media/user\_upload/tuto%20for%20tradicional-bba1126d-6798-4d6d-9c84-027fa933e79e.jpg</u>) Ahora a lo que vinimos.. Ahora vamos a usar un bucle tambi茅n, pero ahora es un \*\*FOR IN\*\*, a diferencia del FOR tradicional este solo tiene dos elementos en su estructura, los cuales son: \_Un 铆ndice temporal dentro del bucleEl array a recorrer\_\_ ahora veamos como se construye y como funciona ```jsconsole.warn(' FOR IN ');//Esto solo es un t铆tulo para que lo veas en la consola for(let i in heroes 聽){聽 聽 console.log( heroes\[i]);}```y este es el resultado !\[tuto for in.png]\(<u>https://static.platzi.com/media/user\_upload/tuto%20for%20in-4bec402d-ee79-40fa-86ea-cb82333c1090.jpg</u>) y finalmente vamos a usar un bucle tambi茅n, pero ahora es un \*\*FOR OF\*\*, este al igual que el FOR IN solo tiene dos elementos en su estructura, los cuales son: \_Una variable temporal en la que tenemos el valor actual dentro del bucleEl array a recorrer\_ ahora veamos como se construye y como funciona ```jsconsole.warn(' FOR OF ');//Esto solo es un t铆tulo para que lo veas en la consola for(let heroe of heroes 聽){聽 聽 console.log( heroe );}``` y este es el resultado !\[tuto for of.png]\(<u>https://static.platzi.com/media/user\_upload/tuto%20for%20of-675840f5-4762-4e9d-b3a3-c9ee1c810a75.jpg</u>) Espero que esta informaci贸n haya sido de su agrado y para su utilidad y beneficio

Un tutorial un poco fuera de contexto, pero a su vez algo interesante鈥
驴Por qu茅 forEach es m谩s r谩pido que for en JavaScript?

隆C贸mo crear una lista de tareas (To-Do List) sencilla usando JavaScript!馃摀鉁 Enlace: <https://platzi.com/tutoriales/3271-javascript-practico/31393-como-crear-una-lista-de-tareas-to-do-list-sencilla-usando-javascript/> ==========================================================================================================================================
Les comparto el siguiente tutorial: \[Operador Condicional Ternario]\(https://platzi.com/tutoriales/3271-javascript-practico/30970-operador-condicional-ternario/)
Hola !! por aqu铆 te dejo este peque帽o tutorial sobre un buen recurso -\[*import y export en javascript]\(https://platzi.com/tutoriales/3271-javascript-practico/30674-exportar-e-importar-en-javascript/)*- para interactuar entre archivos.
# Como hacer un bot贸n de upload con drag and drop usando HTML, JavaScript y CSS <https://platzi.com/tutoriales/3271-javascript-practico/30343-como-hacer-un-boton-de-upload-con-drag-and-drop-usando-html-javascript-y-css/>
MI TUTORIAL ES ESTE: <https://platzi.com/tutoriales/3271-javascript-practico/30027-metodos-de-manipulacion-de-array/> Y adem谩s, dejo un link donde hay mas metodos utiles: <https://es.javascript.info/array-methods>
Comparto mi tutorial: [C贸mo Integrar Eventos de JavaScript con HTML para Mostrar Resultados Din谩micos](https://platzi.com/tutoriales/3271-javascript-practico/28758-como-integrar-eventos-de-javascript-con-html-para-mostrar-resultados-dinamicos/) :)
Ac谩 dejo mi tuto, muy simple pero ah铆 les dejo mis razones [Saludo basico del navegador con prompt y alert (platzi.com)](https://platzi.com/tutoriales/3271-javascript-practico/28697-saludo-basico-del-navegador-con-prompt-y-alert/)
Este es mi resumen de Javascript, es m谩s un cheatsheet <https://platzi.com/tutoriales/3271-javascript-practico/28693-informacion-basica-de-javascript/>
Un tutorial b谩sico de realidad virtual con javascript <https://platzi.com/tutoriales/3271-javascript-practico/28462-tutorial-de-realidad-virtual-con-a-frame-y-javascript/>
Por favor, copia tu Tutorial de vez en cuando. Casi pierdo mi \[tutorial]\(https://platzi.com/tutoriales/3271-javascript-practico/28099-como-generar-un-array-de-todas-tus-funciones-del-ambito-global-javascript-itermedio/) luego de invertirle horas investigando y corrigiendo el c贸digo.
mi tutorial algo basico <https://platzi.com/tutoriales/3271-javascript-practico/27478-ley-de-ohm/>
Comparto mi tutorial <https://platzi.com/tutoriales/3271-javascript-practico/27375-como-iterar-sobre-un-array-usando-for-of/>
[Ejemplo sencillo manejar una Tabla con JavaScript (platzi.com)](https://platzi.com/tutoriales/3271-javascript-practico/27316-ejemplo-sencillo-manejar-una-tabla-con-javascript/)
Es posible agregar funciones dentro de un Objeto ? Revisa el siguiente link y descubrelo con un ejemplo super practico <https://platzi.com/tutoriales/3271-javascript-practico/27143-es-posible-agregar-funciones-dentro-de-un-objeto/> ================================================================================================================
# C贸mo extraer los valores de las propiedades de un objeto y devolverlos como un array. en JavaScript <https://platzi.com/tutoriales/3271-javascript-practico/27012-como-extraer-los-valores-de-las-propiedades-de-un-objeto-y-devolverlos-como-un-array-en-javascript/>
Cordial saludo. Realizo el tutorial como aporte, gracias. [#### Como obtener un array de los valores de las propiedades de un objeto en JS.](https://platzi.com/tutoriales/3271-javascript-practico/26915-como-obtener-un-array-de-los-valores-de-las-propiedades-de-un-objeto-en-js/) [ ](https://platzi.com/tutoriales/3271-javascript-practico/26915-como-obtener-un-array-de-los-valores-de-las-propiedades-de-un-objeto-en-js/)
<https://platzi.com/tutoriales/3271-javascript-practico/26754-como-recorrer-un-array-en-js/>
Hola, este es mi tutorial, es algo basico pero es mejor tenerlo claro: "Gu铆a Completa de Estructuras de Control en JavaScript: if, else if, else y switch": <https://platzi.com/tutoriales/3271-javascript-practico/26547-guia-completa-de-estructuras-de-control-en-javascript-if-else-if-else-y-switch/>

https://n9.cl/qv3xb
tutorial de c贸mo crear un array con los valores de un objeto

Tutorial de una web app que guarda registro de vehiculos y luego puede mostrarlos:
https://platzi.com/tutoriales/3271-javascript-practico/25596-web-app-registro-de-vehiculos/

OMG! aqu铆 dejo mi tutorial para mostrar una frase motivadora de manera aleatoria.

https://platzi.com/tutoriales/3271-javascript-practico/25467-frases-aleatorias-con-javascript/

Compa帽eros les comparto el tutorial que dise帽e donde explico como recorrer los elemento de un array con un ciclo for en JS

https://platzi.com/tutoriales/3271-javascript-practico/25416-como-crear-un-ciclo-for-para-recorrer-elemento-de-un-array-en-javascript/

Como consejo pueden colocar el enunciado de un ejercicio y su soluci贸n en c贸digo en chagpt y decirle que les explique el procedimiento paso a paso, de manera que cualquier persona pueda entenderlo y les ayudara much铆simo

Hay un problema en la plataforma de platzi que no permite cargar los tutoriales, he intentado enviar en dos ocasiones mi tutorial y no ha sido posible enviarlo, debido a que aparece en el navegador un mensaje que dice: que se present贸 un problema o error 500 por parte de platzi. La situaci贸n es que tambi茅n en la enviada del tutorial se pierde toda la informaci贸n y no es posible recuperarla, debiendo nuevamente realizar el trabajo. Agradezco al profesor Diego se sirva prestar atenci贸n a la presente, gracias

DESARROLLO Y PRESENTACI脫N DEL TUTORIAL, QUE EN MI CASO ESCOG脥 EL TEMA DE LA COERCI脫N IMPL脥CITA Y EXPL脥CITA.

C贸mo apreciar mejor los conceptos de 鈥淐oerci贸n Impl铆cita鈥 y 鈥淐oerci贸n Explicita鈥 en JavaScript. Teniendo en cuenta que Coerci贸n es cuando se transforma un tipo de dato en otro tipo de dato de una variable. En el lenguaje de JavaScript existen dos tipos de coerci贸n: la Impl铆cita y la explicita

En JavaScript existen dos clases de coerci贸n: la Coerci贸n Impl铆cita y la Coerci贸n Expl铆cita.

  1. Coerci贸n Impl铆cita:

Es cuando el motor de JavaScript en el momento de compilar nuestro c贸digo detecta operaciones de diferentes tipos de datos que pueden tener varios significados o inconsistencias en el c贸digo y lo interpreta a su manera, generando para nosotros resultados no esperados o errores en el c贸digo. Por ejemplo: La suma de un n煤mero con un string o viceversa, la suma o resta de un string con un n煤mero o viceversa, la suma o resta de un booleano con un n煤mero o string, etc.
La Coerci贸n Impl铆cita es cuando el lenguaje de programaci贸n de JavaScript nos ayuda a definir o cambiar el tipo de valor de nuestro c贸digo, en donde los resultados de los valores no son los que en ocasiones est谩bamos esperando
Ejemplos de coerci贸n impl铆cita:
鈥12鈥 + 8 // 鈥128鈥 Lo concatena.

8 + 鈥12鈥 // 鈥812鈥 Lo concatena.

鈥12鈥 * 8 // 鈥96鈥 Lo multiplica.

10 + false // 鈥10鈥 Suma el n煤mero con el booleano.

15 + true // 鈥16鈥 Suma el n煤mero con el booleano.

true + 鈥8鈥 // 鈥9鈥 Suma el booleano con el string.

true * 鈥8鈥 // 鈥8鈥 Multiplica el booleano con el string.

8 / 鈥4鈥 // 鈥2鈥 Divide el n煤mero con el string (el motor lo toma como n煤mero).

9 - false // 鈥9鈥 Resta el n煤mero con el booleano.
En el siguiente ejemplo insertamos dos tipos de valores diferentes en la variable let, que al sumar un n煤mero con un string, JavaScript decide concatenar.
let a = 16 + 鈥8鈥; // 168
typeof a // 'string鈥
2. Coerci贸n Expl铆cita:


Es la transformaci贸n de tipos de datos que hacemos a voluntad en nuestro c贸digo para controlar el resultado, mediante la utilizaci贸n de tres funciones: Number( ), String( ) y Boolean( ).
鈥 Number( ), para convertir a tipo de dato n煤mero.
鈥 String( ), para convertir a tipo de dato string.
鈥 Boolean( ), para convertir a tipo de dato l贸gico.
La Coerci贸n Expl铆cita es cuando nosotros obligamos a cambiar un tipo de valor por otro.
NOTA. No olvidar emplear la palabra reservada: 鈥渢ypeof鈥 seguido del nombre de la variable, par谩metro o funci贸n, para establecer el tipo de dato transformado.
Number(鈥68鈥) // 68.
typeof 68 // 鈥榥umber鈥.

String(68) // 鈥68鈥.
typeof 鈥68鈥 // 鈥榮tring鈥.

Boolean(0) // false.
typeof false // 鈥榖oolean鈥.
Ejemplos de coerci贸n expl铆cita:
En el siguiente ejemplo obligamos a cambiar un tipo de valor por otro con la concatenaci贸n; en el sentido que declaramos una variable de tipo n煤mero y otra variable que contiene a la primer variable de tipo n煤mero m谩s (+) un valor de string; para forzar con la concatenaci贸n que el tipo n煤mero se convierta en un string.
let num1 = 74;
let num2 = num1 + 鈥溾;

num2 //鈥74鈥, string.
Siguiendo con el mismo ejemplo vamos a convertir la variable let num1 = 74, la cual contiene un valor de n煤mero en un string, sin tener la necesidad de concatenar como en el ejemplo pasado; para lo cual generamos la variable let num3, que va a tomar el valor de la funci贸n o m茅todo: String(), en donde se sugiere que la variable num1 de tipo n煤mero se convierta en un string.
let num1 = 74;
let num3 = String(num2);

num3 // 鈥74鈥, string.
Espero que les haya gustado y llenado las expectativas de aprendizaje en el refuerzo de conocimientos.

Primer tutorial 馃槃:

For in vs For of

Dios les bendiga, yo pensaba que estas cosas eran una perdida de tiempo jajaja. Perd贸n, pero la verdad me call茅 la boca, mi gran frustraci贸n en este a帽o y medio + programando hab铆a sido no poder llevar ideas a programaci贸n de forma practica y cuando trataba me estancaba. Pero pues con dedicaci贸n, tiempo, fortaleciendo muy fuertemente las bases de la l贸gica de la programaci贸n m谩s que la sintaxis me permitieron desarrollar este tutorial del cual yo mismo me impact茅 literalmente lo hice en media hora el c贸digo, no ten铆a ninguna referencia ni nada, todo fue a punta de l贸gica y woah. Me sorprendi贸 el resultado, tambi茅n claro con ayuda de gpt para sintaxis pero realmente cuando tienes la l贸gica el cielo es el limite:

Para los que quieren aprender algo completamente nuevo con JavaScript. Aqu铆 les dejo mi tutorial 驴C贸mo tener una referencia din谩mica de una variable en JavaScript como en C++?

馃 Presento informaci贸n que aprend铆 tras casi descomponer mi computadora, al utiliazar el ciclo while.
como utilizar el ciclo while

Comparto mi tuto, un poco corto, pero con info importante y buenas practicas鈥
Creacion de una Fetch API (Async)
Tendrias alguna mejor solucion u optimizacion de la funcion??