{"id":142,"date":"2019-04-14T23:06:41","date_gmt":"2019-04-14T22:06:41","guid":{"rendered":"https:\/\/esoftwar.es\/blog\/?p=142"},"modified":"2019-04-15T15:44:49","modified_gmt":"2019-04-15T14:44:49","slug":"aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6","status":"publish","type":"post","link":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/","title":{"rendered":"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6"},"content":{"rendered":"

Hoy aprenderemos en este post como manejar de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT y como implementar esta funcionalidad que nos da JavaScript ES6 para solventar el problema de los callback hell<\/code>.<\/p>\n

Lo primero que he de decir es que son una mejora a los llamados Generators<\/code> en JavaScript.<\/p>\n

\u00bfQu\u00e9 son las callback hell?<\/h2>\n

Las callback hell en principio no son f\u00e1ciles de explicar con palabras mejor verlo en c\u00f3digo pero si tuviera que decir qu\u00e9 son las callback hell dir\u00eda que se producen cuando intentamos hacer un c\u00f3digo As\u00edncrono en JavaScript y usamos \u00abcallback\u00bb para que de forma as\u00edncrona se ejecute una funci\u00f3n cuando termine de ejecutarse parte del c\u00f3digo de una funci\u00f3n y si encadenamos muchas operaciones as\u00edncronas seguidas se producir\u00e1 este infierno de llamadas, pero mejor verlo en imagen para tener una idea m\u00e1s clara.<\/p>\n

<\/p>\n

\"Callback

Bien, como podemos observar esto es un infierno, el poder manejar el flujo de nuestra ejecuci\u00f3n y hace que el c\u00f3digo sea ilegible por nosotros, por no decir lo complicado que es depurar este c\u00f3digo.<\/p>\n

La soluci\u00f3n que nos da el comit\u00e9 ECMAScript es un wrapper o envoltorio que va un paso m\u00e1s all\u00e1 para manejar las llamadas as\u00edncronas mediante los iterables como son los Generators<\/code> en JavaScript y que estos Generators siempre ten\u00edan que ir acompa\u00f1ado de bibliotecas como \"co\"<\/code> para manejar el flujo de llamadas as\u00edncronas dentro de una funci\u00f3n.<\/p>\n

\u00bfQu\u00e9 son los Generators en JavaScript?<\/h2>\n

Pues como dije anteriormente es una manera de llamar a varias funciones de forma as\u00edncronas iterando de forma que cuando termine la ejecuci\u00f3n de la primera funci\u00f3n se ejecute la segunda funci\u00f3n y as\u00ed sucesivamente y todo esto desde una \u00fanica funci\u00f3n la cual se marcaba con el signo de asterisco \"*\"<\/code>, veamos un ejemplo:<\/p>\n

\/*\r\n* Create function with asterisk this function it's a generators\r\n* \r\n* This function return an object <Iterator>\r\n*\/\r\nfunction* runGenerators(){\r\n    \r\n    \/\/ Call functions with yield before of function call\r\n    yield first(); \/\/ Step one from next() method\r\n    yield second(); \/\/ Step two from next() method\r\n}\r\n\r\n\/\/ Asynchronous call first from iterator object with next() method.\r\nfunction first(){\r\n    console.log(\"First call..\");\r\n}\r\n\r\n\/\/ Asynchronous call first from iterator object with next() method.\r\nfunction second (){\r\n    console.log(\"Second call..\");\r\n}\r\n\r\n\/\/ Return Iterator into myIterator\r\nlet myIterator = runGenerators();\r\n\r\n\/\/ Sleep \r\nmyIterator.next();\r\nmyIterator.next();\r\n\r\n\/\/ Output script:\r\n\/\/ First call..\r\n\/\/ Second call..\r\n\/\/\r\n\r\n<\/pre>\n
Como se puede observar primero ejecuta una primera iteraci\u00f3n cuando se ejecuta el m\u00e9todo next() del iterador y hasta que esta no termine y se vuelva a llamar de nuevo al m\u00e9todo next() del iterador no se ejecuta la siguiente sentencia o paso que este caso es la funci\u00f3n second().<\/p>\n
Esto es solo un ejemplo sobre los Generators muy b\u00e1sico en otro post hablaremos con todo detalle sobre c\u00f3mo usar de forma f\u00e1cil los Generators en JavaScript ES6.
\nUna vez visto los Generators podemos hacernos una idea de porque se implemento en ES6 la nueva funcionalidad ASYNC\/AWAIT y c\u00f3mo esta va a solucionar el tener que usar librer\u00edas de terceros para el manejo de la programaci\u00f3n funcional as\u00edncrona en JavaScript. Bien ahora veamos<\/p>\n
\u00bfPor qu\u00e9 usar siempre ASYNC\/AWAIT?<\/h2>\n
Simplemente porque esta nueva funcionalidad es y ser\u00e1 un standard en JavaScript ES6 el cual es una mejora muy importante en el manejo de las llamadas as\u00edncronas y el flujo y control de estas.<\/p>\n
Diferencias entre Generators<\/code> y ASYNC\/AWAIT<\/code><\/p>\n
    \n
  1. async\/await usa await<\/code> en vez de yield<\/code><\/li>\n
  2. await solo funciona con Promesas<\/li>\n
  3. En lugar de function*<\/code> , usa la palabra clave async function<\/code> .<\/span><\/li>\n<\/ol>\n
    As\u00ed que async\/await<\/code> es esencialmente un subconjunto o mejora de generators y tiene un nuevo az\u00facar sint\u00e1ctico.<\/p>\n
    La palabra clave async<\/code> le dice al compilador de JavaScript que trate la funci\u00f3n de manera diferente. El compilador se detiene cada vez que llega a la palabra clave await<\/code> dentro de esa funci\u00f3n.  Asume que la expresi\u00f3n despu\u00e9s de await<\/code> devuelve una promesa<\/strong> y espera hasta que la promesa se resuelva o se rechace antes de seguir adelante.<\/span><\/p>\n
    Bueno despu\u00e9s de tanta explicaci\u00f3n ser\u00e1 mejor ver c\u00f3mo se implementa ASYNC y AWAIT en un ejemplo b\u00e1sico.<\/p>\n
    \/\/ Create first function\r\nfunction getUserById(userId){\r\n    \/\/ Return a Promise\r\n    return new Promise(resolve => {\r\n  setTimeout(() => {\r\n      resolve({ name: \"Francisco\", job: \"developer\"}); \/\/ Send second call..\r\n  }, 1000);\r\n    }, reject => {\r\n      \/\/ Reject value..\r\n    });\r\n}\r\n\r\n\/\/ Create second function\r\n\/\/ This function it depends on the function first for ejecution\r\nfunction getUserProfile(userProfile){\r\n    \r\n    let {name, job} = userProfile; \/\/ to receive of first Promise\r\n\r\n    \/\/ Return a Promise\r\n    return new Promise( (resolve, reject) => {\r\n  setTimeout(() => {\r\n      if ( name === \"Francisco\") {\r\n    resolve(`User ${name} is correct and he works as ${job} `); \r\n      } else {\r\n          reject(\"User unknown..\");\r\n            }\r\n  }, 1000);\r\n    });\r\n}\r\n\r\n\/\/ Use of ASYNC\/AWAIT very easy \r\nasync function getProfile(userId){\r\n\r\n    let myUser = await getUserById();\r\n    let myProfile = await getUserProfile(myUser);\r\n    \/\/\r\n    console.log(myProfile);\r\n}\r\n\r\n\/\/ Ejecute asynchronous call\r\ngetProfile(\"100\");\r\n\r\n\/\/ Output console\r\n\/\/ User Francisco is correct and he works as developer\r\n\/\/<\/pre>\n
    Bien c\u00f3mo podemos observar el manejo de las llamadas as\u00edncronas o callback se hace muy f\u00e1cil de crear y sobre todo de testear en nuestro c\u00f3digo por lo que es recomendable el uso de la nueva funcionalidad ASYNC\/AWAIT que JavaScript ES6 nos proporciona.<\/p>\n
    \/\/ Use of ASYNC\/AWAIT very easy\r\nasync function getProfile(userId){\r\n\r\n    let myUser = await getUserById();\r\n    let myProfile = await getUserProfile(myUser);\r\n    \/\/\r\n    console.log(myProfile);\r\n}\r\n\r\n\/\/ \\ 0 \/ - \\ 0 \/  - \\ 0 \/ \r\n\/\/<\/pre>\n
    Adem\u00e1s de esta forma de iteraci\u00f3n sobre funciones, ES2018 nos trae for-await-of<\/code> para iterar en un bucle for y poder hacer llamadas a funciones que retornan Promises de forma as\u00edncrona. Veamos un peque\u00f1o ejemplo:<\/p>\n
    \/\/ Create all Promises\r\nconst promises = [\r\n    new Promise(resolve => resolve(\"Sleep one..\")),\r\n    new Promise(resolve => resolve(\"Sleep two..\")),\r\n    new Promise(resolve => resolve(\"Sleep three..\"))\r\n];\r\n\r\n\/\/ Use of ASYNC\/AWAIT\r\nasync function testPromises() {\r\n    for await (const promise of promises) {\r\n        console.log(promise);\r\n    }\r\n}\r\n\r\n\/\/ Run\r\ntestPromises();\r\n\r\n\/\/ Output\r\n\/\/ Sleep one..\r\n\/\/ Sleep two..\r\n\/\/ Sleep three..\r\n\/\/<\/pre>\n
    Una vez m\u00e1s vemos c\u00f3mo esta funcionalidad de ES2018 nos facilita enormemente el manejo de llamadas callback de forma as\u00edncrona dentro de un bucle.<\/p>\n
    Conclusi\u00f3n:<\/span><\/strong><\/h3>\n
    Hemos visto como ES6 trae nuevos az\u00facar sint\u00e1ctico como es el manejo de callback de forma as\u00edncrona mediante ASYNC\/AWAIT<\/code>. No debemos de desaprovechar esta mejora que JavaScript proporciona una abstracci\u00f3n de mayor nivel que los generators para resolver espec\u00edficamente el problema de los callback.<\/p>\n
    En cuanto a la iteraci\u00f3n en un bucle for-await-of<\/code> es una caracter\u00edstica completamente nueva del 2018 para ayudar a realizar dentro de un bucle una serie de llamadas (callback) a funciones as\u00edncronas y obtener el resultado de cada funci\u00f3n as\u00edncrona de forma normal.<\/p>\n
    \n
    <\/div>\n
    <\/div>\n
    <\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
    Hoy aprenderemos en este post como manejar de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT y como implementar esta funcionalidad que nos da JavaScript ES6 para solventar el problema de los callback hell. Lo primero que he de decir es que son una mejora a los llamados Generators en JavaScript. \u00bfQu\u00e9 son las callback hell? […]<\/p>\n","protected":false},"author":2,"featured_media":177,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"full-width-content","footnotes":""},"categories":[4],"tags":[],"class_list":{"0":"post-142","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-javascript","8":"entry"},"yoast_head":"\nAprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6 - Aprendiendo lenguajes por c\u00f3digo<\/title>\n<meta name=\"description\" content=\"La funcionalidad ASYNC\/AWAIT fue introducida en ES6 para solventar el problema de los "callback hell". Son una mejora a los llamados Generators en ES6.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6 - Aprendiendo lenguajes por c\u00f3digo\" \/>\n<meta property=\"og:description\" content=\"La funcionalidad ASYNC\/AWAIT fue introducida en ES6 para solventar el problema de los "callback hell". Son una mejora a los llamados Generators en ES6.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/\" \/>\n<meta property=\"og:site_name\" content=\"Aprendiendo lenguajes por c\u00f3digo\" \/>\n<meta property=\"article:published_time\" content=\"2019-04-14T22:06:41+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2019-04-15T14:44:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png\" \/>\n\t<meta property=\"og:image:width\" content=\"850\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Francisco Pay\u00e1n\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Francisco Pay\u00e1n\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/\"},\"author\":{\"name\":\"Francisco Pay\u00e1n\",\"@id\":\"https:\/\/esoftwar.es\/blog\/#\/schema\/person\/987708a8a221d06730da8fe3a552aebf\"},\"headline\":\"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6\",\"datePublished\":\"2019-04-14T22:06:41+00:00\",\"dateModified\":\"2019-04-15T14:44:49+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/\"},\"wordCount\":831,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png\",\"articleSection\":[\"JavaScript\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/\",\"url\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/\",\"name\":\"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6 - Aprendiendo lenguajes por c\u00f3digo\",\"isPartOf\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png\",\"datePublished\":\"2019-04-14T22:06:41+00:00\",\"dateModified\":\"2019-04-15T14:44:49+00:00\",\"description\":\"La funcionalidad ASYNC\/AWAIT fue introducida en ES6 para solventar el problema de los \\\"callback hell\\\". Son una mejora a los llamados Generators en ES6.\",\"breadcrumb\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#primaryimage\",\"url\":\"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png\",\"contentUrl\":\"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png\",\"width\":850,\"height\":300,\"caption\":\"asinc and await javascript\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/esoftwar.es\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/esoftwar.es\/blog\/#website\",\"url\":\"https:\/\/esoftwar.es\/blog\/\",\"name\":\"Aprendiendo lenguajes por c\u00f3digo\",\"description\":\"Blog para geek y otras hierbas.\",\"publisher\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/esoftwar.es\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/esoftwar.es\/blog\/#organization\",\"name\":\"esoftwar.es\",\"url\":\"https:\/\/esoftwar.es\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/esoftwar.es\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/03\/Logo550.png\",\"contentUrl\":\"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/03\/Logo550.png\",\"width\":550,\"height\":550,\"caption\":\"esoftwar.es\"},\"image\":{\"@id\":\"https:\/\/esoftwar.es\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/esoftwar.es\/blog\/#\/schema\/person\/987708a8a221d06730da8fe3a552aebf\",\"name\":\"Francisco Pay\u00e1n\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/esoftwar.es\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/2ea17ea73a0207c077cefb69f8fcf7c5c420e02371e882b906295cde73c5fd50?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/2ea17ea73a0207c077cefb69f8fcf7c5c420e02371e882b906295cde73c5fd50?s=96&d=mm&r=g\",\"caption\":\"Francisco Pay\u00e1n\"},\"description\":\"Desarrollador Backend, Frontend y Mobile. Autodidacta apasionado del c\u00f3digo fuente. Mis metas son aprender y desarrollar c\u00f3digo en el d\u00eda a d\u00eda. Me gusta la m\u00fasica, el deporte al aire libre y tener amigos\/as.\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6 - Aprendiendo lenguajes por c\u00f3digo","description":"La funcionalidad ASYNC\/AWAIT fue introducida en ES6 para solventar el problema de los \"callback hell\". Son una mejora a los llamados Generators en ES6.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/","og_locale":"es_ES","og_type":"article","og_title":"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6 - Aprendiendo lenguajes por c\u00f3digo","og_description":"La funcionalidad ASYNC\/AWAIT fue introducida en ES6 para solventar el problema de los \"callback hell\". Son una mejora a los llamados Generators en ES6.","og_url":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/","og_site_name":"Aprendiendo lenguajes por c\u00f3digo","article_published_time":"2019-04-14T22:06:41+00:00","article_modified_time":"2019-04-15T14:44:49+00:00","og_image":[{"width":850,"height":300,"url":"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png","type":"image\/png"}],"author":"Francisco Pay\u00e1n","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"Francisco Pay\u00e1n","Tiempo de lectura":"6 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#article","isPartOf":{"@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/"},"author":{"name":"Francisco Pay\u00e1n","@id":"https:\/\/esoftwar.es\/blog\/#\/schema\/person\/987708a8a221d06730da8fe3a552aebf"},"headline":"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6","datePublished":"2019-04-14T22:06:41+00:00","dateModified":"2019-04-15T14:44:49+00:00","mainEntityOfPage":{"@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/"},"wordCount":831,"commentCount":0,"publisher":{"@id":"https:\/\/esoftwar.es\/blog\/#organization"},"image":{"@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#primaryimage"},"thumbnailUrl":"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png","articleSection":["JavaScript"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/","url":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/","name":"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6 - Aprendiendo lenguajes por c\u00f3digo","isPartOf":{"@id":"https:\/\/esoftwar.es\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#primaryimage"},"image":{"@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#primaryimage"},"thumbnailUrl":"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png","datePublished":"2019-04-14T22:06:41+00:00","dateModified":"2019-04-15T14:44:49+00:00","description":"La funcionalidad ASYNC\/AWAIT fue introducida en ES6 para solventar el problema de los \"callback hell\". Son una mejora a los llamados Generators en ES6.","breadcrumb":{"@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#primaryimage","url":"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png","contentUrl":"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/04\/async_await_w.png","width":850,"height":300,"caption":"asinc and await javascript"},{"@type":"BreadcrumbList","@id":"https:\/\/esoftwar.es\/blog\/aprende-de-forma-facil-que-es-async-y-await-en-javascript-es6\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/esoftwar.es\/blog\/"},{"@type":"ListItem","position":2,"name":"Aprende de forma f\u00e1cil qu\u00e9 es ASYNC y AWAIT en JavaScript ES6"}]},{"@type":"WebSite","@id":"https:\/\/esoftwar.es\/blog\/#website","url":"https:\/\/esoftwar.es\/blog\/","name":"Aprendiendo lenguajes por c\u00f3digo","description":"Blog para geek y otras hierbas.","publisher":{"@id":"https:\/\/esoftwar.es\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/esoftwar.es\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/esoftwar.es\/blog\/#organization","name":"esoftwar.es","url":"https:\/\/esoftwar.es\/blog\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/esoftwar.es\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/03\/Logo550.png","contentUrl":"https:\/\/esoftwar.es\/blog\/wp-content\/uploads\/2019\/03\/Logo550.png","width":550,"height":550,"caption":"esoftwar.es"},"image":{"@id":"https:\/\/esoftwar.es\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/esoftwar.es\/blog\/#\/schema\/person\/987708a8a221d06730da8fe3a552aebf","name":"Francisco Pay\u00e1n","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/esoftwar.es\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/2ea17ea73a0207c077cefb69f8fcf7c5c420e02371e882b906295cde73c5fd50?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/2ea17ea73a0207c077cefb69f8fcf7c5c420e02371e882b906295cde73c5fd50?s=96&d=mm&r=g","caption":"Francisco Pay\u00e1n"},"description":"Desarrollador Backend, Frontend y Mobile. Autodidacta apasionado del c\u00f3digo fuente. Mis metas son aprender y desarrollar c\u00f3digo en el d\u00eda a d\u00eda. Me gusta la m\u00fasica, el deporte al aire libre y tener amigos\/as."}]}},"_links":{"self":[{"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/posts\/142","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/comments?post=142"}],"version-history":[{"count":31,"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/posts\/142\/revisions"}],"predecessor-version":[{"id":176,"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/posts\/142\/revisions\/176"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/media\/177"}],"wp:attachment":[{"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/media?parent=142"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/categories?post=142"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/esoftwar.es\/blog\/wp-json\/wp\/v2\/tags?post=142"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}