{"id":22181,"date":"2018-07-18T12:15:13","date_gmt":"2018-07-18T09:15:13","guid":{"rendered":"https:\/\/www.webcodegeeks.com\/?p=22181"},"modified":"2018-07-18T12:19:59","modified_gmt":"2018-07-18T09:19:59","slug":"backbone-events-promises-async-await","status":"publish","type":"post","link":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/","title":{"rendered":"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps"},"content":{"rendered":"<p>At the risk of being a contrarian, I\u2019d like to show in this article how exactly can the Backbone\u2019s Events model be combined with the more modern constructs of Promises and async\/await to build a killer app using JavaScript.<\/p>\n<p>First, let\u2019s try to understand why do we need these constructs for asynchronous programming when JavaScript itself is a mostly asynchronous language featuring events and function callbacks. The <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Promise\">Promise API<\/a> was introduced in ES6 standard as a way of preventing callback hell:<\/p>\n<pre class=\" brush:php\">function someFunction(function anotherFunction(data){\r\n  function yetAnotherFunction() {\r\n    function reallyCoreFunction() {\r\n      \/\/readability sucks now!\r\n    }\r\n  }\r\n});<\/pre>\n<p>This is only three layers of callbacks, imagine what will happen when there are a hundred of them which is quite possible in a medium sized web app with multiple ajax calls and a dynamic interface. To solve this problem, functions started returning a \u201cPromise\u201d object instead of a callback function, so instead of multiple layers of callbacks, we can now use \u201cfunction chaining\u201d using the <strong>then<\/strong> keyword like this:<\/p>\n<pre class=\" brush:php\">someFunction()\r\n.then(function(){\r\n  yetAnotherFunction();\r\n})\r\n.then(function(){\r\n  reallyCoreFunction();\r\n})\r\n\/\/readability is better now!<\/pre>\n<p>As you can see, the Promise API has improved the readability to a considerable extent. Instead of a callback mechanism, the callee returns an object called <strong>Promise<\/strong> which can be chained for further execution. For this to happen, the callee has to call resolve() in order for the caller to end the wait and trigger further execution in the next chain:<\/p>\n<p>&nbsp;<\/p>\n<figure id=\"attachment_22185\" aria-describedby=\"caption-attachment-22185\" style=\"width: 755px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/promise_model.png\"><img decoding=\"async\" class=\"wp-image-22185 size-full\" src=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/promise_model.png\" alt=\"Promise Model\" width=\"755\" height=\"222\" srcset=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/promise_model.png 755w, https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/promise_model-300x88.png 300w\" sizes=\"(max-width: 755px) 100vw, 755px\" \/><\/a><figcaption id=\"caption-attachment-22185\" class=\"wp-caption-text\">Promise Model<\/figcaption><\/figure>\n<p>But the async\/await construct goes even further than this. You don\u2019t even need to do function chaining using <strong>then<\/strong>, but the <strong>await<\/strong> keyword itself is enough to do this. Internally, the async\/await model uses the Promise API to achieve its end because even in this model, the callee has to make the resolve() call in order to return execution control to the caller and the process continues after the next await statement:<\/p>\n<p>&nbsp;<\/p>\n<figure id=\"attachment_22186\" aria-describedby=\"caption-attachment-22186\" style=\"width: 755px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/async_await_model.png\"><img decoding=\"async\" class=\"wp-image-22186 size-full\" src=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/async_await_model.png\" alt=\"async await Model\" width=\"755\" height=\"222\" srcset=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/async_await_model.png 755w, https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/async_await_model-300x88.png 300w\" sizes=\"(max-width: 755px) 100vw, 755px\" \/><\/a><figcaption id=\"caption-attachment-22186\" class=\"wp-caption-text\">async await Model<\/figcaption><\/figure>\n<p>However, one disadvantage of async\/await is that the caller can only wait, it cannot receive a returned value which is possible in the Promise model. Another disadvantage is that the caller function itself who invoked the await statement needs to be declared as async which means it cannot be a part of a sequential statements in another process, but has to work independently as shown <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Statements\/async_function#Examples\">in this example<\/a>:<\/p>\n<pre class=\" brush:js\">var sequentialStart = async function() {\r\n  console.log('==SEQUENTIAL START==');\r\n  const slow = await resolveAfter2Seconds(); \/\/ If the value of the expression following the await operator is not a Promise, it's converted to a resolved Promise.\r\n  const fast = await resolveAfter1Second();\r\n  console.log(slow);\r\n  console.log(fast);\r\n}<\/pre>\n<p>Finally, the most important thing here is to realize that both Promises and async\/await are just one level of asynchrony, let\u2019s call this detail asynchrony or <strong>micro asynchrony<\/strong>, but there is also the other kind that works at the broader level which can be termed <strong>macro asynchrony<\/strong>, and this is where Backbone.Events comes into the picture.<\/p>\n<p>Consider that you have a complex web application with several views and each component should be able to trigger a message or event to any other component asynchronously in order for the app to render and function properly. Consider an app with a <strong>loginView <\/strong>that needs to trigger an alert that a user has just signed in. Now, keeping the separation of concerns, the best practice here would be that the loginView shouldn\u2019t try to render that part of the DOM and leave it to the other component: <strong>navbarView<\/strong>. Now, how can our loginView be able to \u201ctell\u201d the navbarView asynchronously over the wire to display that alert? Both Promises and async\/await are of no use here, and hence we need a macro-level all-purpose <strong>Event Bus<\/strong>, similar to the one that Backbone.js provides us:<\/p>\n<p>&nbsp;<\/p>\n<figure id=\"attachment_22187\" aria-describedby=\"caption-attachment-22187\" style=\"width: 757px\" class=\"wp-caption aligncenter\"><a href=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/backbone.events_model.png\"><img decoding=\"async\" class=\"wp-image-22187 size-full\" src=\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/backbone.events_model.png\" alt=\"backbone.events Model\" width=\"757\" height=\"278\" srcset=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/backbone.events_model.png 757w, https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/07\/backbone.events_model-300x110.png 300w\" sizes=\"(max-width: 757px) 100vw, 757px\" \/><\/a><figcaption id=\"caption-attachment-22187\" class=\"wp-caption-text\">backbone.events Model<\/figcaption><\/figure>\n<p>In this case, our caller and callee are inside separate components and don\u2019t even know each other. And separation of concerns imply that they cannot even contact each other directly. Now, Backbone provides this useful trigger\/listen mechanism called <strong>Backbone.Events<\/strong> using which any object in your app can listen to the events triggered on any other object! In this case, the loginView triggers an event called \u201cnavbarView.alert\u201d and thus \u201ctells\u201d the navbarView that it has to do something (in this case show an alert). This mechanism also supports passing of any kind of data along with the triggering of event (in this case the <em>message<\/em> parameter).<\/p>\n<p>Thus, we can see that combining the power of all these asynchronous models, we can easily handle any level of complexity in our app, provided that our <a href=\"https:\/\/www.webcodegeeks.com\/web-development\/architect-single-page-web-applications\/\">app itself is structured in the right way from the start<\/a>.<\/p>\n<div class=\"attribution\">\n<table>\n<tbody>\n<tr>\n<td>Published on Web Code Geeks with permission by Prahlad Yeri, partner at our <a href=\"\/\/www.webcodegeeks.com\/join-us\/wcg\/\" target=\"_blank\" rel=\"noopener\">WCG program<\/a>. See the original article here: <a href=\"https:\/\/prahladyeri.com\/blog\/2018\/07\/backbone-events-promises-async_await-combination.html\" target=\"_blank\" rel=\"noopener\">Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps<\/a><\/p>\n<p>Opinions expressed by Web Code Geeks contributors are their own.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>At the risk of being a contrarian, I\u2019d like to show in this article how exactly can the Backbone\u2019s Events model be combined with the more modern constructs of Promises and async\/await to build a killer app using JavaScript. First, let\u2019s try to understand why do we need these constructs for asynchronous programming when JavaScript &hellip;<\/p>\n","protected":false},"author":20,"featured_media":920,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[],"class_list":["post-22181","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps - Web Code Geeks - 2026<\/title>\n<meta name=\"description\" content=\"Interested to learn more about backbone? Check out our article on why do we need these constructs of Promises and async\/await for asynchronous programming!\" \/>\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.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps - Web Code Geeks - 2026\" \/>\n<meta property=\"og:description\" content=\"Interested to learn more about backbone? Check out our article on why do we need these constructs of Promises and async\/await for asynchronous programming!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Code Geeks\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webcodegeeks\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/prahlad1981\" \/>\n<meta property=\"article:published_time\" content=\"2018-07-18T09:15:13+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-07-18T09:19:59+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"150\" \/>\n\t<meta property=\"og:image:height\" content=\"150\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Prahlad Yeri\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/prahladyeri\" \/>\n<meta name=\"twitter:site\" content=\"@webcodegeeks\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Prahlad Yeri\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/\"},\"author\":{\"name\":\"Prahlad Yeri\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/adbf41ec03855cdb1730dd42f2725bfd\"},\"headline\":\"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps\",\"datePublished\":\"2018-07-18T09:15:13+00:00\",\"dateModified\":\"2018-07-18T09:19:59+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/\"},\"wordCount\":791,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"articleSection\":[\"JavaScript\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/\",\"name\":\"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps - Web Code Geeks - 2026\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"datePublished\":\"2018-07-18T09:15:13+00:00\",\"dateModified\":\"2018-07-18T09:19:59+00:00\",\"description\":\"Interested to learn more about backbone? Check out our article on why do we need these constructs of Promises and async\/await for asynchronous programming!\",\"breadcrumb\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#primaryimage\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg\",\"width\":150,\"height\":150},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.webcodegeeks.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JavaScript\",\"item\":\"https:\/\/www.webcodegeeks.com\/category\/javascript\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"name\":\"Web Code Geeks\",\"description\":\"Web Developers Resource Center\",\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.webcodegeeks.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\",\"name\":\"Exelixis Media P.C.\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"width\":864,\"height\":246,\"caption\":\"Exelixis Media P.C.\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webcodegeeks\",\"https:\/\/x.com\/webcodegeeks\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/adbf41ec03855cdb1730dd42f2725bfd\",\"name\":\"Prahlad Yeri\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/70a8e7bba939c7539943aa1191374d2504d95a2a95acb04a1e44adc3b4c72fe3?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/70a8e7bba939c7539943aa1191374d2504d95a2a95acb04a1e44adc3b4c72fe3?s=96&d=mm&r=g\",\"caption\":\"Prahlad Yeri\"},\"description\":\"Prahlad is a freelance software developer working on web and mobile application development. He also likes to blog about programming and contribute to opensource.\",\"sameAs\":[\"http:\/\/www.prahladyeri.com\/\",\"https:\/\/www.facebook.com\/prahlad1981\",\"http:\/\/in.linkedin.com\/pub\/prahlad-yeri\/16\/a53\/243\/\",\"https:\/\/x.com\/https:\/\/twitter.com\/prahladyeri\"],\"url\":\"https:\/\/www.webcodegeeks.com\/author\/prahlad-yeri\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps - Web Code Geeks - 2026","description":"Interested to learn more about backbone? Check out our article on why do we need these constructs of Promises and async\/await for asynchronous programming!","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.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/","og_locale":"en_US","og_type":"article","og_title":"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps - Web Code Geeks - 2026","og_description":"Interested to learn more about backbone? Check out our article on why do we need these constructs of Promises and async\/await for asynchronous programming!","og_url":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/","og_site_name":"Web Code Geeks","article_publisher":"https:\/\/www.facebook.com\/webcodegeeks","article_author":"https:\/\/www.facebook.com\/prahlad1981","article_published_time":"2018-07-18T09:15:13+00:00","article_modified_time":"2018-07-18T09:19:59+00:00","og_image":[{"width":150,"height":150,"url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","type":"image\/jpeg"}],"author":"Prahlad Yeri","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/prahladyeri","twitter_site":"@webcodegeeks","twitter_misc":{"Written by":"Prahlad Yeri","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#article","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/"},"author":{"name":"Prahlad Yeri","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/adbf41ec03855cdb1730dd42f2725bfd"},"headline":"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps","datePublished":"2018-07-18T09:15:13+00:00","dateModified":"2018-07-18T09:19:59+00:00","mainEntityOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/"},"wordCount":791,"commentCount":0,"publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","articleSection":["JavaScript"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/","url":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/","name":"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps - Web Code Geeks - 2026","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#primaryimage"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","datePublished":"2018-07-18T09:15:13+00:00","dateModified":"2018-07-18T09:19:59+00:00","description":"Interested to learn more about backbone? Check out our article on why do we need these constructs of Promises and async\/await for asynchronous programming!","breadcrumb":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#primaryimage","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/js-logo.jpg","width":150,"height":150},{"@type":"BreadcrumbList","@id":"https:\/\/www.webcodegeeks.com\/javascript\/backbone-events-promises-async-await\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.webcodegeeks.com\/"},{"@type":"ListItem","position":2,"name":"JavaScript","item":"https:\/\/www.webcodegeeks.com\/category\/javascript\/"},{"@type":"ListItem","position":3,"name":"Backbone.Events+Promises+async\/await is a great combination for building JavaScript apps"}]},{"@type":"WebSite","@id":"https:\/\/www.webcodegeeks.com\/#website","url":"https:\/\/www.webcodegeeks.com\/","name":"Web Code Geeks","description":"Web Developers Resource Center","publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.webcodegeeks.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.webcodegeeks.com\/#organization","name":"Exelixis Media P.C.","url":"https:\/\/www.webcodegeeks.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","width":864,"height":246,"caption":"Exelixis Media P.C."},"image":{"@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webcodegeeks","https:\/\/x.com\/webcodegeeks"]},{"@type":"Person","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/adbf41ec03855cdb1730dd42f2725bfd","name":"Prahlad Yeri","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/70a8e7bba939c7539943aa1191374d2504d95a2a95acb04a1e44adc3b4c72fe3?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/70a8e7bba939c7539943aa1191374d2504d95a2a95acb04a1e44adc3b4c72fe3?s=96&d=mm&r=g","caption":"Prahlad Yeri"},"description":"Prahlad is a freelance software developer working on web and mobile application development. He also likes to blog about programming and contribute to opensource.","sameAs":["http:\/\/www.prahladyeri.com\/","https:\/\/www.facebook.com\/prahlad1981","http:\/\/in.linkedin.com\/pub\/prahlad-yeri\/16\/a53\/243\/","https:\/\/x.com\/https:\/\/twitter.com\/prahladyeri"],"url":"https:\/\/www.webcodegeeks.com\/author\/prahlad-yeri\/"}]}},"_links":{"self":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/22181","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/comments?post=22181"}],"version-history":[{"count":0,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/22181\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media\/920"}],"wp:attachment":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media?parent=22181"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/categories?post=22181"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/tags?post=22181"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}