{"id":8194,"date":"2019-02-18T13:08:50","date_gmt":"2019-02-18T11:08:50","guid":{"rendered":"https:\/\/www.espai.es\/blog\/?p=8194"},"modified":"2021-09-13T20:41:57","modified_gmt":"2021-09-13T18:41:57","slug":"promesas-en-javascript","status":"publish","type":"post","link":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/","title":{"rendered":"Promesas en JavaScript"},"content":{"rendered":"<p>Aprovechando que hace poco ha sido San Valent\u00edn, hoy vamos a ver en qu\u00e9 consisten las\u00a0promesas en JavaScript.<\/p>\n<p>Las promesas se introdujeron en ECMAscript 6 y, b\u00e1sicamente, nos ofrecen una forma m\u00e1s limpia de trabajar con tareas as\u00edncronas.<\/p>\n<h2>\u00bfQu\u00e9 es una tarea as\u00edncrona?<\/h2>\n<p>En JavaScript existen muchas tareas que son as\u00edncronas. Un ejemplo sencillo es la tarea de cargar una imagen.<\/p>\n<pre>\r\nvar img = new Image();\r\nimg.src = &quot;sample1.jpg&quot;;\r\ndocument.write(&quot;Tama\u00f1o de la imagen: &quot; + img.width + &quot;x&quot; + img.height);\r\n<\/pre>\n<p>El anterior c\u00f3digo no funcionar\u00e1 de forma correcta. Esto es as\u00ed porque al cambiar el atributo <strong>src<\/strong> de la imagen, el navegador necesita tiempo para pedir la imagen solicitada al servidor, descargarla, y descomprimirla luego en memoria. Todo ese proceso puede llevar bastante tiempo, dependiendo de la calidad de la conexi\u00f3n y el tama\u00f1o de la imagen, pueden ser incluso varios segundos. Para que el c\u00f3digo JavaScript no se quede bloqueado todo ese tiempo, la carga de la imagen se realiza de forma as\u00edncrona; por lo que el c\u00f3digo sigue ejecut\u00e1ndose aunque no se haya completado la carga de la imagen.<\/p>\n<p>Para que el anterior c\u00f3digo funcione correctamente, debemos de escribir algo como esto:<\/p>\n<pre>\r\nvar img = new Image();\r\nimg.src = &quot;sample1.jpg&quot;;\r\nimg.onload = function() {\r\n    document.write(&quot;Tama\u00f1o de la imagen: &quot; + img.width + &quot;x&quot; + img.height);\r\n    document.close();\r\n};\r\n<\/pre>\n<p>En este caso, solo intentaremos acceder a las propiedades de la imagen cuando estamos seguros de haber terminado la carga de la misma.<\/p>\n<p><strong>Esta forma de trabajar presenta r\u00e1pidamente sus limitaciones cuando queremos ejecutar un c\u00f3digo al terminar de cargar no una, sino m\u00faltiples im\u00e1genes. Lo mismo sucede cuando queremos encadenar varias tareas as\u00edncronas una detr\u00e1s de otra<\/strong>. Y la cosa se complica bastante m\u00e1s si adem\u00e1s queremos controlar posibles errores y la forma de reaccionar ante ellos.<\/p>\n<h2>\u00bfEn qu\u00e9 consisten las promesas en JavaScript?<\/h2>\n<p>En una tarea as\u00edncrona, como la carga de una imagen, existe la posibilidad de que al cabo de unos instantes la tarea de carga finalice con \u00e9xito, de que se produzca un error, o de que la tarea de carga no termine de completarse nunca. Como al tratarse de una tarea as\u00edncrona no tenemos el resultado de la operaci\u00f3n de forma inmediata, necesitamos alg\u00fan modo de saber el resultado de la operaci\u00f3n y reaccionar ante dicho resultado.<\/p>\n<p>Las promesas en JavaScript son justamente eso; <strong>la promesa de que tendremos el resultado de una tarea as\u00edncrona<\/strong>. Para crear una promesa debemos de crear un objeto de la clase Promise. Este objeto, representa un valor que podr\u00eda, o no, estar disponible en el futuro. Y ese valor, es el resultado de una operaci\u00f3n as\u00edncrona.<\/p>\n<p>Podemos crear una promesa del siguiente modo:<\/p>\n<pre>\r\nvar promesa = new Promise(function(resolver, rechazar) {\r\n  \/* c\u00f3digo de la funci\u00f3n ejecutora *\/\r\n});\r\n<\/pre>\n<p>Al crear el objeto de tipo Promise, debemos de indicar lo que se conoce como funci\u00f3n ejecutora. Esta funci\u00f3n es la que debe de ejecutar el c\u00f3digo as\u00edncrono, y tiene dos posibles par\u00e1metros; resolver (resolve) y rechazar (reject). Estos par\u00e1metros son <strong>callbacks<\/strong>, es decir, funciones que se pasan por par\u00e1metro y que se llamar\u00e1n cuando se complete o falle la operaci\u00f3n deseada. El c\u00f3digo de la funci\u00f3n ejecutora debe de llamar a la callback de resolver si todo ha ido bien, o a la callback de rechazar si no ha sido as\u00ed. Es importante tener en cuenta que la funci\u00f3n ejecutora debe de llamar solo a una de las dos callbacks.<\/p>\n<p>En nuestro ejemplo, el c\u00f3digo para crear la promesa podr\u00eda ser el siguiente:<\/p>\n<pre>\r\nvar promesa = new Promise(function(resolve, reject) {\r\n    var img = new Image();\r\n    img.src = &quot;sample1.jpg&quot;;\r\n    img.onload = function() { resolve(img); }\r\n    img.onerror = function() { \r\n        reject(new Error(&quot;Error al cargar la imagen: &quot; + img.src));\r\n    }\r\n});\r\n<\/pre>\n<p>Vamos a mejorarlo un poco, vamos a crear una funci\u00f3n para cargar im\u00e1genes que nos devolver\u00e1 una promesa por cada imagen que queramos cargar.<\/p>\n<pre>\r\nfunction loadImg(src) {\r\n    return new Promise(function(resolve, reject) {\r\n        var img = new Image();\r\n        img.src = src;\r\n        img.onload = function() { resolve(img); }\r\n        img.onerror = function() { \r\n            reject(new Error(&quot;Error al cargar la imagen: &quot; + img.src)); \r\n        }\r\n    });\r\n}\r\n<\/pre>\n<p>Para usar las promesas en JavaScript, debemos de \u201cconsumirlas\u201d. Para ello podemos usar el m\u00e9todo <strong>then()<\/strong>.<\/p>\n<pre>\r\nvar promesa = loadImg(&quot;sample1.jpg&quot;);\r\npromesa.then(\r\n    function(img) { \r\n        document.write(&quot;Tama\u00f1o: &quot; + img.width + &quot;x&quot; + img.height); \r\n        document.close();\r\n    },\r\n    function(error) { \r\n        document.write(error.message); \r\n        document.close();\r\n    }\r\n);\r\n<\/pre>\n<p>El m\u00e9todo <strong>then()<\/strong> acepta dos par\u00e1metros, que son dos funciones callback. La primera se ejecutar\u00e1 si la promesa se ha cumplido satisfactoriamente, y la segunda se ejecutar\u00e1 si se ha producido alg\u00fan error.<\/p>\n<p>Estas funciones tienen como par\u00e1metros los que le pasamos en el c\u00f3digo de la funci\u00f3n ejecutora. En el caso de la callback para el error, <strong>se recomienda que el primer par\u00e1metro sea un objeto de la clase Error<\/strong>, ya que cualquier error\/excepci\u00f3n que se produzca en el c\u00f3digo de la funci\u00f3n ejecutora, provocar\u00e1 que al llamar al m\u00e9todo <strong>then()<\/strong> se ejecute la callback del error.<\/p>\n<p><strong>Si no queremos gestionar los errores, no es necesario el segundo par\u00e1metro del m\u00e9todo then()<\/strong>.<\/p>\n<p>Otra forma de gestionar los errores es con el m\u00e9todo <strong>catch()<\/strong>, que solo acepta de par\u00e1metro una callback que se ejecutar\u00e1 cuando se produzca un error. Por lo que tambi\u00e9n podemos escribir el anterior c\u00f3digo as\u00ed:<\/p>\n<pre>\r\nvar promesa = loadImg(&quot;sample1.jpg&quot;);\r\npromesa.then(\r\n    function(img) { \r\n        document.write(&quot;Tama\u00f1o: &quot; + img.width + &quot;x&quot; + img.height); \r\n        document.close();\r\n    }\r\n).catch(\r\n    function(error) { \r\n        document.write(error.message); \r\n        document.close();\r\n    }\r\n);\r\n<\/pre>\n<p>Existe la posibilidad de que queramos ejecutar un mismo c\u00f3digo tanto si se cumple como si no se cumple la promesa. En ese caso, en lugar de los m\u00e9todos <strong>then()<\/strong> o <strong>catch()<\/strong> podemos usar el m\u00e9todo <strong>finally()<\/strong> (NOTA: este m\u00e9todo es de EcmaScript 2018).<\/p>\n<pre>\r\nvar promesa = loadImg(&quot;sample1.jpg&quot;);\r\npromesa.then(\r\n    function(img) { \r\n        document.write(&quot;Tama\u00f1o: &quot; + img.width + &quot;x&quot; + img.height); \r\n    }\r\n).catch(\r\n    function(error) { \r\n        document.write(error.message);         \r\n    }\r\n).finally(\r\n    function() {\r\n        document.close();\r\n    }\r\n);\r\n<\/pre>\n<p>Es bastante frecuente el uso de <a href=\"https:\/\/www.espai.es\/blog\/2018\/01\/funciones-flecha-en-javascript\/\" target=\"_blank\" rel=\"noopener\">funciones flecha<\/a> cuando se usan promesas en JavaScript, por lo que el c\u00f3digo completo que estamos viendo tambi\u00e9n podemos escribirlo de este modo:<\/p>\n<pre>\r\nfunction loadImg(src) {\r\n    return new Promise(function(resolve, reject) {\r\n        var img = new Image();\r\n        img.src = src;\r\n        img.onload = () =&gt; { resolve(img); }\r\n        img.onerror = () =&gt; { \r\n            reject(new Error(&quot;Error al cargar la imagen: &quot; + img.src));\r\n        }\r\n    });\r\n}\r\n\r\nvar promesa = loadImg(&quot;sample1.jpg&quot;);\r\npromesa.then(\r\n    img =&gt; { document.write(&quot;Tama\u00f1o: &quot; + img.width + &quot;x&quot; + img.height); }\r\n).catch(\r\n    error =&gt; { document.write(error.message); }\r\n).finally(\r\n    () =&gt; { document.close(); }\r\n);\r\n<\/pre>\n<p>El poder encadenar un <strong>catch()<\/strong> despu\u00e9s de un <strong>then()<\/strong>, es porque ambos m\u00e9todos devuelven la promesa. Pero es posible hacer que se devuelva otra nueva promesa totalmente diferente; esto nos permite encadenar varias promesas, de forma que al cumplirse una, intentamos realizar la siguiente. Veamos un ejemplo:<\/p>\n<pre>\r\n\/\/ intentamos cargar la primera imagen\r\nvar promesa = loadImg(&quot;sample1.jpg&quot;);\r\npromesa.then(\r\n    img =&gt; { \r\n        \/\/ mostramos informaci\u00f3n de la primera imagen\r\n        document.write(&quot;Tama\u00f1o: &quot; + img.width + &quot;x&quot; + img.height + &quot;&lt;br&gt;&quot;);\r\n        \/\/ intentamos cargar la segunda imagen\r\n        return loadImg(&quot;sample2.jpg&quot;);\r\n    }\r\n).then(\r\n    img =&gt; { \r\n        \/\/ mostramos informaci\u00f3n de la segunda imagen\r\n        document.write(&quot;Tama\u00f1o: &quot; + img.width + &quot;x&quot; + img.height); \r\n        document.close();\r\n    }\r\n);\r\n<\/pre>\n<p>Esta forma de trabajar es muy frecuente cuando se usan promesas. Sin embargo, aunque esto puede ser muy \u00fatil cargando scripts o realizando otro tipo de peticiones a un servidor Web, no es habitual cuando queremos cargar im\u00e1genes.<\/p>\n<h2>M\u00e9todos est\u00e1ticos de la clase Promise<\/h2>\n<p>Cuando cargamos im\u00e1genes el orden en el que se cargan suele ser irrelevante. Lo que si nos puede interesar es <strong>saber cu\u00e1ndo est\u00e1n todas las im\u00e1genes cargadas<\/strong>. Para averiguarlo, disponemos del m\u00e9todo est\u00e1tico <strong>all()<\/strong> de la clase Promise. Este m\u00e9todo espera como par\u00e1metro un objeto que se pueda iterar y que contenga promesas, como por ejemplo, un array de promesas. De forma similar a <strong>Promise.all()<\/strong>, podemos usar <strong>Promise.race()<\/strong> si solo nos interesa la primera promesa que se cumpla (o que d\u00e9 un error).<\/p>\n<p>Si queremos reaccionar ante la primera promesa que se cumpla o falle, usaremos el m\u00e9todo <strong>race()<\/strong>;<\/p>\n<pre>\r\ndocument.write(&quot;Cargando im\u00e1genes, por favor espera...&quot;);\r\nPromise.race([\r\n    loadImg(&quot;sample1.jpg&quot;),\r\n    loadImg(&quot;sample2.jpg&quot;),\r\n    loadImg(&quot;sample3.jpg&quot;),\r\n]).then(\r\n    img =&gt; {\r\n        document.write(&quot;La primera imagen que se ha cargado es: &quot; + img.src); \r\n        document.close();\r\n        \/\/ una vez cargada, la podemos mostrar en pantalla\r\n        var imagen = document.createElement('img');\r\n        imagen.src = img.src;\r\n        document.body.appendChild(imagen);\r\n    }\r\n).catch(\r\n    error =&gt; {\r\n        document.write(error.message); \r\n        document.close();\r\n    }\r\n);\r\n<\/pre>\n<p>Si queremos reaccionar cuando se cumplan todas las promesas, usaremos el m\u00e9todo <strong>all()<\/strong>;<\/p>\n<pre>\r\ndocument.write(&quot;Cargando im\u00e1genes, por favor espera...&quot;);\r\nvar imagenes = [&quot;sample1.jpg&quot;, &quot;sample2.jpg&quot;, &quot;sample3.jpg&quot;];\r\nPromise.all(imagenes.map(loadImg)).then(\r\n    () =&gt; {\r\n        document.write(&quot;Todas las im\u00e1genes se han cargado con \u00e9xito!&quot;); \r\n        document.close();\r\n        \/\/ una vez cargadas, las podemos mostrar en pantalla\r\n        imagenes.forEach((src)=&gt;{\r\n            var img = document.createElement('img');\r\n            img.src = src;\r\n            document.body.appendChild(img);\r\n        });\r\n    }\r\n).catch(\r\n    error =&gt; {\r\n        document.write(error.message); \r\n        document.close();\r\n    }\r\n);\r\n<\/pre>\n<p>Y nada m\u00e1s. Espero que este art\u00edculo os haya resultado interesante. En un futuro art\u00edculo veremos como aplicar las promesas para obtener otro tipo de recursos del servidor Web.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Aprovechando que hace poco ha sido San Valent\u00edn, hoy vamos a ver en qu\u00e9 consisten las\u00a0promesas en JavaScript. Las promesas se introdujeron en ECMAscript 6 y, b\u00e1sicamente, nos ofrecen una forma m\u00e1s limpia de trabajar con tareas as\u00edncronas. \u00bfQu\u00e9 es una tarea as\u00edncrona? En JavaScript&#8230;<\/p>\n","protected":false},"author":23,"featured_media":8199,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_ef_editorial_meta_date_first-draft-date":"","_ef_editorial_meta_paragraph_assignment":"","_ef_editorial_meta_checkbox_needs-photo":"","_ef_editorial_meta_number_word-count":"","_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[7,5],"tags":[253,679],"class_list":["post-8194","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-web","category-programacion","tag-javascript","tag-promesas"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.1.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Promesas en JavaScript - Blog Escola Espai<\/title>\n<meta name=\"description\" content=\"\u00bfQue son y como funcionan las Promesas en JavaScript? En este art\u00edculo, acompa\u00f1ado de c\u00f3digo fuente sencillo de entender, analizaremos su funcionamiento.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Promesas en JavaScript - Blog Escola Espai\" \/>\n<meta property=\"og:description\" content=\"\u00bfQue son y como funcionan las Promesas en JavaScript? En este art\u00edculo, acompa\u00f1ado de c\u00f3digo fuente sencillo de entender, analizaremos su funcionamiento.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog Escola Espai\" \/>\n<meta property=\"article:published_time\" content=\"2019-02-18T11:08:50+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-09-13T18:41:57+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1000\" \/>\n\t<meta property=\"og:image:height\" content=\"500\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Abel Camarena\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Abel Camarena\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/\"},\"author\":{\"name\":\"Abel Camarena\",\"@id\":\"https:\/\/www.espai.es\/blog\/#\/schema\/person\/b2d40404b9d987e3586e186c021ef897\"},\"headline\":\"Promesas en JavaScript\",\"datePublished\":\"2019-02-18T11:08:50+00:00\",\"dateModified\":\"2021-09-13T18:41:57+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/\"},\"wordCount\":1111,\"commentCount\":0,\"image\":{\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg\",\"keywords\":[\"javascript\",\"promesas\"],\"articleSection\":[\"Dise\u00f1o Web\",\"Programaci\u00f3n\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/\",\"url\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/\",\"name\":\"Promesas en JavaScript - Blog Escola Espai\",\"isPartOf\":{\"@id\":\"https:\/\/www.espai.es\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg\",\"datePublished\":\"2019-02-18T11:08:50+00:00\",\"dateModified\":\"2021-09-13T18:41:57+00:00\",\"author\":{\"@id\":\"https:\/\/www.espai.es\/blog\/#\/schema\/person\/b2d40404b9d987e3586e186c021ef897\"},\"description\":\"\u00bfQue son y como funcionan las Promesas en JavaScript? En este art\u00edculo, acompa\u00f1ado de c\u00f3digo fuente sencillo de entender, analizaremos su funcionamiento.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#primaryimage\",\"url\":\"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg\",\"contentUrl\":\"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg\",\"width\":1000,\"height\":500,\"caption\":\"Promesas en JavaScript\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/www.espai.es\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Promesas en JavaScript\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.espai.es\/blog\/#website\",\"url\":\"https:\/\/www.espai.es\/blog\/\",\"name\":\"Blog Escola Espai\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.espai.es\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.espai.es\/blog\/#\/schema\/person\/b2d40404b9d987e3586e186c021ef897\",\"name\":\"Abel Camarena\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.espai.es\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/035501b0f14e120b1a49121758e2056b8d589fc43b9d3c3ad3670a197a90dddf?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/035501b0f14e120b1a49121758e2056b8d589fc43b9d3c3ad3670a197a90dddf?s=96&d=mm&r=g\",\"caption\":\"Abel Camarena\"},\"sameAs\":[\"http:\/\/www.espai.es\"],\"url\":\"https:\/\/www.espai.es\/blog\/author\/abel\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Promesas en JavaScript - Blog Escola Espai","description":"\u00bfQue son y como funcionan las Promesas en JavaScript? En este art\u00edculo, acompa\u00f1ado de c\u00f3digo fuente sencillo de entender, analizaremos su funcionamiento.","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:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/","og_locale":"es_ES","og_type":"article","og_title":"Promesas en JavaScript - Blog Escola Espai","og_description":"\u00bfQue son y como funcionan las Promesas en JavaScript? En este art\u00edculo, acompa\u00f1ado de c\u00f3digo fuente sencillo de entender, analizaremos su funcionamiento.","og_url":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/","og_site_name":"Blog Escola Espai","article_published_time":"2019-02-18T11:08:50+00:00","article_modified_time":"2021-09-13T18:41:57+00:00","og_image":[{"width":1000,"height":500,"url":"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg","type":"image\/jpeg"}],"author":"Abel Camarena","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"Abel Camarena","Tiempo de lectura":"8 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#article","isPartOf":{"@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/"},"author":{"name":"Abel Camarena","@id":"https:\/\/www.espai.es\/blog\/#\/schema\/person\/b2d40404b9d987e3586e186c021ef897"},"headline":"Promesas en JavaScript","datePublished":"2019-02-18T11:08:50+00:00","dateModified":"2021-09-13T18:41:57+00:00","mainEntityOfPage":{"@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/"},"wordCount":1111,"commentCount":0,"image":{"@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg","keywords":["javascript","promesas"],"articleSection":["Dise\u00f1o Web","Programaci\u00f3n"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/","url":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/","name":"Promesas en JavaScript - Blog Escola Espai","isPartOf":{"@id":"https:\/\/www.espai.es\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#primaryimage"},"image":{"@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg","datePublished":"2019-02-18T11:08:50+00:00","dateModified":"2021-09-13T18:41:57+00:00","author":{"@id":"https:\/\/www.espai.es\/blog\/#\/schema\/person\/b2d40404b9d987e3586e186c021ef897"},"description":"\u00bfQue son y como funcionan las Promesas en JavaScript? En este art\u00edculo, acompa\u00f1ado de c\u00f3digo fuente sencillo de entender, analizaremos su funcionamiento.","breadcrumb":{"@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#primaryimage","url":"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg","contentUrl":"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg","width":1000,"height":500,"caption":"Promesas en JavaScript"},{"@type":"BreadcrumbList","@id":"https:\/\/www.espai.es\/blog\/2019\/02\/promesas-en-javascript\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/www.espai.es\/blog\/"},{"@type":"ListItem","position":2,"name":"Promesas en JavaScript"}]},{"@type":"WebSite","@id":"https:\/\/www.espai.es\/blog\/#website","url":"https:\/\/www.espai.es\/blog\/","name":"Blog Escola Espai","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.espai.es\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/www.espai.es\/blog\/#\/schema\/person\/b2d40404b9d987e3586e186c021ef897","name":"Abel Camarena","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.espai.es\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/035501b0f14e120b1a49121758e2056b8d589fc43b9d3c3ad3670a197a90dddf?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/035501b0f14e120b1a49121758e2056b8d589fc43b9d3c3ad3670a197a90dddf?s=96&d=mm&r=g","caption":"Abel Camarena"},"sameAs":["http:\/\/www.espai.es"],"url":"https:\/\/www.espai.es\/blog\/author\/abel\/"}]}},"jetpack_featured_media_url":"https:\/\/www.espai.es\/blog\/wp-content\/uploads\/2019\/02\/featured.jpg","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/posts\/8194","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/users\/23"}],"replies":[{"embeddable":true,"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/comments?post=8194"}],"version-history":[{"count":13,"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/posts\/8194\/revisions"}],"predecessor-version":[{"id":12277,"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/posts\/8194\/revisions\/12277"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/media\/8199"}],"wp:attachment":[{"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/media?parent=8194"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/categories?post=8194"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.espai.es\/blog\/wp-json\/wp\/v2\/tags?post=8194"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}