<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Ali Sequeira</title>
    <description>The latest articles on DEV Community by Ali Sequeira (@alisequeira_dev).</description>
    <link>https://dev.to/alisequeira_dev</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F634953%2Ff2270e35-f3a8-4a0b-85d7-82f6ca959d4f.jpeg</url>
      <title>DEV Community: Ali Sequeira</title>
      <link>https://dev.to/alisequeira_dev</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/alisequeira_dev"/>
    <language>en</language>
    <item>
      <title>Mi experiencia participando de un Hackathon</title>
      <dc:creator>Ali Sequeira</dc:creator>
      <pubDate>Wed, 13 Oct 2021 19:27:24 +0000</pubDate>
      <link>https://dev.to/alisequeira_dev/mi-experiencia-participando-de-un-hackathon-2dkp</link>
      <guid>https://dev.to/alisequeira_dev/mi-experiencia-participando-de-un-hackathon-2dkp</guid>
      <description>&lt;p&gt;Empecemos aclarando dudas. Qué es un hackathon? Bueno un hackathon es una competencia donde equipos de software toman una idea y la convierten en una aplicación funcional para el final del evento que por lo general dura entre 24 y 30 horas seguidas.&lt;/p&gt;

&lt;p&gt;Mi equipo perdio. No voy a mentir, nos sentimos frustrados, el esfuerzo y el desvelo pensamos que al final del día darian resultados satisfactorios pero no fue asi, antes de recoger cables como decimos aca, quiero reflexionar sobre lo aprendido de este evento tanto como lo bueno y lo malo que ha dejado mi participación en este evento (talvez regresemos proximo año 😉)&lt;/p&gt;

&lt;p&gt;Ire marcando puntos que considero que serian de ayuda para personas o grupos de amigos que estan interesados en participar de un evento como este.&lt;/p&gt;

&lt;h3&gt;
  
  
  Define una idea:
&lt;/h3&gt;

&lt;p&gt;Esto podemos considerarlo el paso mas sencillo de todo y lo es! para participar en un hackathon no tienes que llegar con la idea mas extraña de todas o la que resuelva un problema que no existe puedes construir un e-commerce, un videojuego, etc. En nuestro caso mi equipo y yo desarrollamos una aplicacion web donde usuarios pueden crear blogs enfocados a la enseñanza del idioma ingles y compartirlos con los usuarios de la aplicacion.&lt;/p&gt;

&lt;h3&gt;
  
  
  Prepararse es importante:
&lt;/h3&gt;

&lt;p&gt;Si bien el proposito del hackathon es crear algo desde 0 hasta que sea funcional, eso no quiere decir que no debas prepararte antes, me resulto de mucha ayuda la investigacion los días previos a la competencia, como que stack utilizar, que API’s son las mas adecuadas, que tecnologias me resultaban mejor. Hacer eso me aterrizo todas las ideas en mi cabeza, asi el dia de la competencia tenia una ruta clara que seguir. Nuestro proyecto fue construido usando Javascript, NEXT.JS fue el framework elegido por la rapidez en la que puedo crear aplicaciones web.&lt;/p&gt;

&lt;p&gt;Una vez mencionado el deber de organizarte con tus herramientas de trabajo ahora toca organizar a tus compañeros. El estres es algo con el que tendran que lidiar, si no estas preparado para eso desfortunadamente puede que termines con una pelea. Afortunadamete el equipo no termino en pelea...algo asi jajajaja las discuciones si ocurririeron, en un hackathon debes de esperar lo improbables. Puedes pensar que te has organizado con tu equipo y luego llegas al evento y te das cuenta que no fue asi o almenos no fue lo que esperabas, ya lo dijo el boxeador Mike Tyson “ Todos tienen un plan, hasta que te golpean en la cara” En nuestro caso el tiempo fue un factor que nos jugo en contra, almenos en las primeras horas de iniciar el evento. El tiempo pasa volando. Manejar los tiempos fue algo que nos costo conseguir pero terminamos lograndolo uno que otro regaño pero nada que no se resolviera con una disculpa 😅, la buena comunicacion fue un factor muy positivo en nuestro equipo haciendo trabajo mas agil como tambien para resolver conflictos entre nosotros. Rodearte de las personas correctas siempre sera una gran ventaja en todo.&lt;/p&gt;

&lt;h3&gt;
  
  
  Preparate para no dormir:
&lt;/h3&gt;

&lt;p&gt;Mencione que esto es una competencia de 24 horas? dormir? que es eso? okay fuera de broma si te recomiendo tomar descansos, una siesta puede ayudar a manejar el estres y el mal humor, PERO QUIEN PUEDE DORMIR CUANDO TIENES QUE TERMINAR UN PROYECTO EN 24 HORAS! tomalo con calma, recuerda que la organizacion es la clave, un descanso no hara daño, ojala hubiese aplicado ese consejo. el desvelo fue mi gran enemigo la mañana siguiente cuando debes asegurarte que todo este de maravillas, y como es costumbre algo tiene que fallar. como? tu base de datos no conecta? tu proyecto no compila? te quedan solo 3 horas? PANIC! la proxima vez me asegurare de tomar un descanso.&lt;/p&gt;

&lt;h3&gt;
  
  
  Esta bien si no ganas:
&lt;/h3&gt;

&lt;p&gt;Okay llego el momento, se ha acabado tu tiempo y es momento de presentar tu proyecto a los jueces y esperar a que tomen su decision, muchas cosas pasan por tu mente en ese momento. Llega la decision y tu equipo no gano. Demonios! ahora que haces? tu merecias ganar no es asi? bueno no siempre es asi. Todos queremos ganar y todos pensamos ser merecedores del premio, mas alla de eso no todo es malo. siempre tendras algo bueno por delante, algo nuevo aprendido, nuevos amigos, nuevas experiencias. Sin duda alguna dejando de lado el no ganar mi expereciencia en el hackathon nicaragua 2021 fue muy agradable. Descubri cosas sobre mi mismo que no sabia que podia. Fui capaz de de crear una aplicacion funcional (casi) en 24 horas. Tuve la oportunidad de fungir como lider con mis compañeros en momentos de mucho estres obviamente no solo, todos pusimos algo de nosotros para mantener este barco a flote. Al final me quedan los buenos recuerdos vividos en este evento. &lt;/p&gt;

&lt;p&gt;Esa sensación de haber terminado un proyecto y estar orgulloso de el, orgulloso del trabajo de cada uno de tus compañeros, son emociones invaluables. Definitivamente pienso que no sera la ultima vez que participe de estos eventos. Espero hacerlo mejor la proxima vez y cerrar con un premio. Definitivamente recomendaria a todos a participar alguna vez en su vida de un evento como estos. &lt;/p&gt;

</description>
      <category>javascript</category>
      <category>programming</category>
      <category>tutorial</category>
      <category>webde</category>
    </item>
    <item>
      <title>GIT para principiantes-comandos que debes saber.</title>
      <dc:creator>Ali Sequeira</dc:creator>
      <pubDate>Tue, 27 Jul 2021 17:36:42 +0000</pubDate>
      <link>https://dev.to/alisequeira_dev/git-para-principiantes-comandos-que-debes-saber-gb9</link>
      <guid>https://dev.to/alisequeira_dev/git-para-principiantes-comandos-que-debes-saber-gb9</guid>
      <description>&lt;p&gt;Aprender a utilizar un sistema de control de versiones como Git nos ayuda a trabajar de manera mas eficiente. Es una herramienta que si o si debes de aprender a usar cuando estas empezando en tu camino como desarrollador de software.&lt;/p&gt;

&lt;p&gt;Con Git puedes trabajar de manera sencilla con tu equipo de trabajo, ya que todos podran trabajar en las funcionalidades del proyecto sin tener que dependender que otros compañeros hagan su parte del trabajo primero.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Hoy te traigo una lista de comandos basicos de git que te ayudaran a ser mejor desarrollador.&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt; &lt;code&gt;git init&lt;/code&gt;  : Con este comando iniciamos el repositorio en nuestro proyecto.&lt;/li&gt;
&lt;li&gt; &lt;code&gt;git add nombre-del-archivo || git add .&lt;/code&gt; : Sirve para agregar los archivos que han cambiado en nuestra carpeta. La diferencia entre ambos es que con el nombre solo agregas ese archivo y usando punto (.) agregamos todos los archivos.&lt;/li&gt;
&lt;li&gt; &lt;code&gt;git commit -m "mensaje"&lt;/code&gt; : Con este comando agregamos los cambios realizados(Es importante tener en cuenta que siempre debemos escribir un mensaje)&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;git commit -am "mensaje"&lt;/code&gt; : Este comando es una combinacion entre &lt;code&gt;git add&lt;/code&gt; y &lt;code&gt;git commit&lt;/code&gt;. Cabe resaltar que este comando solo funciona para archivos que se les ha hecho git add previamente.&lt;/li&gt;
&lt;li&gt; &lt;code&gt;git status&lt;/code&gt; : Nos permite ver el estado de nuestra "base de datos". Nos indica cuales archivos han sido modificados.&lt;/li&gt;
&lt;li&gt; &lt;code&gt;git show&lt;/code&gt; : Nos muestra una lista de todos los cambios historicos que se han hecho en el repositorio.&lt;/li&gt;
&lt;li&gt; &lt;code&gt;git log nombre-del-archivo&lt;/code&gt; : Con este comando podemos ver el historial completo del archivo.&lt;/li&gt;
&lt;li&gt; &lt;code&gt;git push origin nombre-de-la-rama&lt;/code&gt; : Este comando es muy importante cuando tenemos nuestro repositorio conectado a un repositorio remoto, ya que nos permite enviar los cambios hechos.&lt;/li&gt;
&lt;li&gt; &lt;code&gt;git pull origin nombre-de-la-rama&lt;/code&gt; : A diferencia de &lt;code&gt;git push&lt;/code&gt; este nos permite traer a nuestro repositorio local todos los nuevos cambios que esten en nuestro repositorio remoto.&lt;/li&gt;
&lt;li&gt; &lt;code&gt;git branch nombre-de-la-rama&lt;/code&gt; : Ques es branch? Significa que hemos tomado una version de nuestro trabajo y a partir de ahi podemos crear nuevas versiones, o nuevas modificaciones sin afectar nuestro "trabajo principal".&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;git branch&lt;/code&gt; : Lista todas las ramas locales en tu repositorio.&lt;/li&gt;
&lt;li&gt; &lt;code&gt;git checkout&lt;/code&gt; : Este comando es muy especial, se puede usar de multiples maneras, sirve  para movernos entre las versiones de nuestro proyecto. Tambien para movernos entre las ramas que tenga nuestro repositorio.

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;git checkout + id&lt;/code&gt; : Nos permite volver a una version y ver los cambios hechos.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;git checkout nombre-de-la-rama&lt;/code&gt; : Esta es la manera en la que podemos cambiar de rama en nuestro proyecto.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;git checkout -D nombre-nueva-rama&lt;/code&gt; : Con este comando creamos una nueva rama y automaticamente nos cambia a esa rama.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Sin dunda alguna esto solo es una pequeña parte de todos los comandos y funcionalidades que puedes hacer con Git. Siempre voy a sugerir leer la documentacion oficial de cada herramienta o tecnologia &lt;a href="https://git-scm.com/doc"&gt;aqui te dejo la documentacion oficial de Git ;)&lt;/a&gt; Sin duda alguna esta pequeña lista es mas que suficiente para poder a empezar a usar esta maravillosa herramienta que te aseguro a partir de ahora tu trabajo como desarrollador ser mas facil que antes. &lt;/p&gt;

</description>
      <category>github</category>
      <category>webdev</category>
      <category>beginners</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>Aprende a clonar objetos en JavaScript</title>
      <dc:creator>Ali Sequeira</dc:creator>
      <pubDate>Wed, 21 Jul 2021 21:18:10 +0000</pubDate>
      <link>https://dev.to/alisequeira_dev/aprende-a-clonar-objetos-en-javascript-bkd</link>
      <guid>https://dev.to/alisequeira_dev/aprende-a-clonar-objetos-en-javascript-bkd</guid>
      <description>&lt;p&gt;En Javascript se puede clonar objetos de 3 maneras &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Object.assing()&lt;/li&gt;
&lt;li&gt;Spread operator (...)&lt;/li&gt;
&lt;li&gt;JSON&lt;/li&gt;
&lt;/ol&gt;

&lt;h3&gt;
  
  
  Usando Object.assign()
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;persona&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;nombre&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Ali&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;apellido&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Sequeira&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;edad&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;21&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;clonarPersona&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;Object&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;assign&lt;/span&gt;&lt;span class="p"&gt;({},&lt;/span&gt;&lt;span class="nx"&gt;persona&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Usando Spread(...)
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;persona&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;nombre&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Ali&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;apellido&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Sequeira&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;edad&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;21&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;clonarPersona&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="p"&gt;...&lt;/span&gt;&lt;span class="nx"&gt;persona&lt;/span&gt;
 &lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Usando JSON
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;persona&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;nombre&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Ali&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;apellido&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Sequeira&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;edad&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;21&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;clonarPersona&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;JSON&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;parse&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;JSON&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;stringify&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;persona&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Cual es la diferencia?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Tanto spread como Object.assign estan realizando algo llamado &lt;strong&gt;&lt;em&gt;Shallow copy&lt;/em&gt;&lt;/strong&gt; mientras que JSON realiza &lt;strong&gt;&lt;em&gt;Deep copy&lt;/em&gt;&lt;/strong&gt;&lt;br&gt;
Que quiere decir esto? se refiere a la manera en la que javascript "clono" el objeto.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Observa este ejemplo:&lt;/em&gt;&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt; &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;usuario&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;nombre&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Ali Sequeira&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="na"&gt;ocupacion&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Desarrollador&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="na"&gt;favoritos&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="na"&gt;pelicula&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Kill Bill&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="na"&gt;comida&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Hamburguesas&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;usuario2&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;Object&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;assign&lt;/span&gt;&lt;span class="p"&gt;({},&lt;/span&gt; &lt;span class="nx"&gt;usuario&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="nx"&gt;usuario2&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;favoritos&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;pelicula&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Down of the dead&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="cm"&gt;/* Ooops! :C espera que paso? */&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;usuario&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;favoritos&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;pelicula&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="c1"&gt;//"Down of the dead"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;como puedes observar los valores en ambos objetos cambiaron, la rason de esto es porque Object.assign()  o spread operator solo realiza shallow copy del objeto fuente. si los valores de la fuente almacena una referencia a un objeto esa referencia tambien es copiada. Es decir algunos valores siguen conectados al objeto original. Esto no pasa con "nombre" o "ocupacion" ya que al ser valores primitivos en este caso cadenas de texto(strings) no pueden ser mutados.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Ahora intentemos con JSON&lt;/em&gt;&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt; &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;usuario&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="na"&gt;nombre&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Ali Sequeira&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="na"&gt;ocupacion&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Desarrollador&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="na"&gt;favoritos&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="na"&gt;pelicula&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Kill Bill&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="na"&gt;comida&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Hamburguesas&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;

&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;usuario2&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;JSON&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;parse&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;JSON&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;stringify&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;usuario&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
&lt;span class="nx"&gt;usuario2&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;favoritos&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;pelicula&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;Down of the dead&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="cm"&gt;/* WUJU! todo sigue igual! */&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;usuario&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;favoritos&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;pelicula&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="c1"&gt;//"Kill Bill"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Porque utilizando JSON no sucede esto? bueno basicamente estamos utilizando "deep" copy que viene siendo lo contrario a shallow copy, los valores estan desconectados del objeto original debido a la sintaxis con la que se escribe utilizando las funciones JSON.stringify que transforma objetos a cadenas de texto(strings)  y JSON.parse que hace la inversa, transformando las cadenas de texto(string) a objetos.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>beginners</category>
      <category>vanillajs</category>
      <category>tutorial</category>
    </item>
  </channel>
</rss>
