{"id":378,"date":"2020-09-04T11:07:28","date_gmt":"2020-09-04T09:07:28","guid":{"rendered":"http:\/\/www.myblog.nguenkam.com\/?p=378"},"modified":"2020-09-04T11:09:44","modified_gmt":"2020-09-04T09:09:44","slug":"how-to-resolve-a-value-from-a-promise","status":"publish","type":"post","link":"https:\/\/nguenkam.com\/blog\/index.php\/2020\/09\/04\/how-to-resolve-a-value-from-a-promise\/","title":{"rendered":"How to resolve a value from a promise"},"content":{"rendered":"\n<p><\/p>\n\n\n\n<p>The&nbsp;<strong>Promise<\/strong>&nbsp;is an object that represents either completion or failure of a user task. A promise in JavaScript can be in three states pending, fulfilled or rejected.<br>The main advantage of using a Promise in JavaScript is that a user can assign callback functions to the promises in case of a rejection or fulfillment of Promise. As the name suggests a promise is either kept or broken. So, a promise is either completed(kept) or rejected(broken).<\/p>\n\n\n\n<p><strong>Promise resolve() method:<\/strong><br>Promise.resolve() method in JS returns a Promise object that is resolved with a given value. Any of the three things can happend:<\/p>\n\n\n\n<ul><li>If the value is a promise then promise is returned.<\/li><li>If the value has a \u201cthen\u201d attached to the promise, then the returned promise will follow that \u201cthen\u201d to till the final state.<\/li><li>The promise fulfilled with its value will be returned.<\/li><\/ul>\n\n\n\n<h5><strong>Syntax:<\/strong><\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>Promise.resolve(value);<\/code><\/pre>\n\n\n\n<p><strong>Parameters:<\/strong><br>Value to be resolved by this Promise.<\/p>\n\n\n\n<p><strong>Return Value:<\/strong><br>Either the promise of the promise fulfilled with its value is returned.<\/p>\n\n\n\n<h5><strong>Examples (with javascript):<\/strong><\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;script> \n    var promise = Promise.resolve(17468); \n  \n  promise.then(function(val) { \n        console.log(val); \n    }); \n\/\/Output: 17468 \n&lt;\/script> <\/code><\/pre>\n\n\n\n<h3 class=\"has-vivid-red-color has-text-color\">&#8230; TypeScript<\/h3>\n\n\n\n<p>Let\u00b4s create  a simple promise like this:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>const one = new Promise&lt;string>((resolve, reject) => {});<\/code><\/pre>\n\n\n\n<p id=\"65d4\">In this&nbsp;<code>Promise<\/code>,we used the promise constructor to take in&nbsp;<code>string<\/code>&nbsp;as the generic type for the Promise\u2019s&nbsp;<code>resolve<\/code>&nbsp;value. The promise constructor takes an&nbsp;<code>executor<\/code>&nbsp;callback which the compiler will call by the runtime with these two arguments:<\/p>\n\n\n\n<ul><li><code>resolve<\/code>&nbsp;\u2014 This is a function that is used to resolve the promise.<\/li><li><code>reject<\/code>&nbsp;\u2014 This is a function that is used to reject the promise.<\/li><\/ul>\n\n\n\n<p>So, our promise can either be resolved, or rejected. The&nbsp;<code>resolve<\/code>&nbsp;part is taken care of by&nbsp;<code>.then<\/code>, and the&nbsp;<code>reject<\/code>&nbsp;part is taken care of by&nbsp;<code>.catch<\/code>.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>one.then(value => {\n  console.log('resolved', value);\n});\none.catch(error => {\n  console.log('rejected', error);\n});<\/code><\/pre>\n\n\n\n<p>If we resolve a&nbsp;<code>Promise<\/code>,&nbsp;<code>then<\/code>&nbsp;callbacks are executed. Else, it means that the&nbsp;<code>Promise<\/code>&nbsp;is rejected and the&nbsp;<code>catch<\/code>&nbsp;callbacks are executed.<\/p>\n\n\n\n<p>Promise resolutions are easy to write:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>resolve('Hello')<\/code><\/pre>\n\n\n\n<p>Promise rejections on the other hand, should only be done in exceptional cases. It is considered as a bad practice to&nbsp;<code>reject<\/code>&nbsp;a promise with a raw string. Always use the error constructor&nbsp;<code>new Error<\/code>&nbsp;when rejecting a promise.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>reject(new Error('failed'));<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>The&nbsp;Promise&nbsp;is an object that represents either completion or failure of a user task. A promise in JavaScript can be in three states pending, fulfilled or rejected.The main advantage of using a Promise in JavaScript is that a user can assign callback functions to the promises in case of a rejection or fulfillment of Promise. As [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":379,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[5,84,83],"tags":[29,85,86,87],"_links":{"self":[{"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/378"}],"collection":[{"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/comments?post=378"}],"version-history":[{"count":3,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/378\/revisions"}],"predecessor-version":[{"id":1420,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/378\/revisions\/1420"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/media\/379"}],"wp:attachment":[{"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=378"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=378"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nguenkam.com\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=378"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}