未加星标

JavaScript Promises Primer

字体大小 | |
[前端(javascript) 所属分类 前端(javascript) | 发布者 店小二03 | 时间 2017 | 作者 红领巾 ] 0人收藏点击收藏

JavaScript Promises Primer

In javascript, a promise is simply a placeholder for a future value. It’s a piece of code that promises to return a value at some point in time. The beauty of promises is that they provide an easy and elegant way to handle asynchronous operations (e.g., setTimeout , AJAX calls, etc.). In the following article, I’ll show you the basic setup for JavaScript promises. I’ll also showa couple of examples of their typical operation. You’ll find the information useful, I promise!

Basic Setup

A promise looks like this:

See the Pen GryKYG by Develop Intelligence ( @DevelopIntelligenceBoulder ) on CodePen .

Things to note:

A promise is instantiated with a call to the Promise constructor Here, the promise is assigned to a promise variable A callback function is passed to the promise with the parameters resolve and reject Asynchronous code is executed within the promise’s callback function Good results are passed to the promise’s then method by calling resolve Bad results (and errors) are passed to the promise’s catch method by calling reject A callback is used in then to handle the good data A callback is used in catch to handle the bad data Examples

Here’s an example of a promise in action:

See the Pen RKxbOJ by Develop Intelligence ( @DevelopIntelligenceBoulder ) on CodePen .

Notice how the asynchronous setTimeout code is wrapped in the promise and it’s callback function, and how it returns a value 2 seconds after thetest function is called.The conditional logic within the promise/callback is used to determine whether resolve or reject gets called. The value resulting from the asynchronous code is passed to either then or catch through resolve or reject . If an error were to occur, it would also be passed to reject .

Additionally, worth noting is the common terminology used with promises:

Before a promise receives a value, it is said to be pending Once a promise receives a value, if the value meets acceptance criteria, it’s fulfilled Once a value is received, if it doesn’t meet acceptance criteria, it’s rejected

Here’s one more example using AJAX :

See the Pen GryRBb by Develop Intelligence ( @DevelopIntelligenceBoulder ) on CodePen .

Notice how the AJAX code is wrapped in an instance of a promise. If everything goes well with the AJAX request, the returned value is resolved and sent to the promise’s then method for handling. If something goes wrong and the response comes back with something other than is intended or if there is an error, then that data will be picked up by the promises catch method, with the error data eventually being logged to the console. Promise, then, catch; it’s as easy as that.

Hopefully you found this information on JavaScript promises useful. Remember that promises offer a clean way to work with asynchronous operations. They are constructed with a call to the Promise constructor. They have then and catch methods that are used to handle results; the then method handles good values once they’ve been fulfilled/resolved, and the catch method handles bad data or errors.

本文前端(javascript)相关术语:javascript是什么意思 javascript下载 javascript权威指南 javascript基础教程 javascript 正则表达式 javascript设计模式 javascript高级程序设计 精通javascript javascript教程

主题: JavaScriptJava
分页:12
转载请注明
本文标题:JavaScript Promises Primer
本站链接:http://www.codesec.net/view/530611.html
分享请点击:


1.凡CodeSecTeam转载的文章,均出自其它媒体或其他官网介绍,目的在于传递更多的信息,并不代表本站赞同其观点和其真实性负责;
2.转载的文章仅代表原创作者观点,与本站无关。其原创性以及文中陈述文字和内容未经本站证实,本站对该文以及其中全部或者部分内容、文字的真实性、完整性、及时性,不作出任何保证或承若;
3.如本站转载稿涉及版权等问题,请作者及时联系本站,我们会及时处理。
登录后可拥有收藏文章、关注作者等权限...
技术大类 技术大类 | 前端(javascript) | 评论(0) | 阅读(27)