数据请求完成!
数据:
1
可以看出使用Promise可以获得与使用回调的同等效果,但通过Promise可以将请求数据和处理数据的过程解耦。异步操作的过程和异步操作的后续过程能保持依赖关系,同时又不过分依赖。
Promise对象使用
Promise对象的三个状态
-
pending
: 初始状态,既不是成功,也不是失败
-
fulfilled
: 操作成功完成
-
rejected
: 操作失败
获得Promise对象
-
使用构造函数
new Promise(function(resolve, reject){...})
executor
是带有两个参数的函数, Promise构造函数执行时立即调用该函数。
executor
内部通常会执行一些异步操作,一旦完成可以调用
resolve
函数将promise状态改为
fulfilled
,或者在发生错误时将它的状态改为
rejected
-
使用
Promise.resolve(value)
直接返回该对象
返回一个then方法执行后的Promise对象
-
value为空、基本类型或者不带then方法的对象
返回一个状态为
fulfilled
的Promise对象,并将
value
传递给对应的
then
方法
-
使用
Promise.reject(reason)
返回一个状态为
rejected
的Promise对象,并传入给定的失败信息
-
使用
Promise.race(iterable)
返回一个新的Promise对象,在iterable参数对象里所有Promise对象都成功的时候才返回成功,并将所有Promise的返回值作为数组返回。否则将返回第一个触发失败的Promise对象的错误信息
-
使用
Promise.all(iterable)
Promise对象的then方法
Promise对象可以通过then方法设置状态成功或者失败后继续执行的代码
promise.then(function(value){
},function(){
new Promise(function(resolve, reject){
resolve(1);
.then(function(data){
console.log("成功:"+data);
}, function(data){
console.log("失败:"+data);
返回值处理:
- 若then中回调函数返回一个值,那么then返回的Promise将作为
fulfilled
状态,并将返回值作为成功状态的回调函数的参数 - 若then中回调函数抛出一个错误,那么then返回的Promise将作为
rejected
状态,并将抛出的错误作为失败状态的回调函数的参数 - 若then中回调函数返回一个Promise,那么then将返回一个与回调函数返回的Promise状态一致的Promise,且返回参数与回调函数中返回参数一致。
Promise的reject方法
Promise对象可以通过reject方法设置状态失败后继续执行的代码
promise.catch(function(reason) {
Promise的finally方法
Promise对象可以通过finally方法设置无论状态成功或者失败都将执行的代码
promise.finally(function() {
MDN上关于Promise的解析
Promise Promise对象用于表示一个异步操作的最终状态(完成或失败)以及其返回的值。一个例子假设我们现在用Js异步请求一个文件并在请求文件后对文件数据进行处理请求数据和处理数据函数function ajaxFile(callback){ // 模拟数据请求 setTimeout(function(){ console.lo...
一个 Promise 对象可以理解为一次将要执行的操作(常常被用于异步操作),使用了 Promise 对象之后可以用一种链式调用的方式来组织代码,让代码更加直观。而且由于 Promise.all 这样的方法存在,可以让同时执行多个操作变得简单。
Promise的兴起,是因为异步方法调用中,往往会出现回调函数一环扣一环的情况。这种情况导致了回调金字塔问题的出现。不仅代码写起来费劲又不美观,而且问题复杂的时候,阅读代码的人也难以理解。
举例如下:
db.save(data, function(data){
// do something...
db.save(data1, func
我们在使用函数的时候经常需要在函数的参数传入另外一个函数,一层一层传递,很容易造成回调地狱,这样的代码不利于维护;
promise是个构造函数对象,解决了回调问题,它有三种状态,pending(等待态),fulfiled(成功态),rejected(失败态),常用到的方法则有 then,catch,all,race
promise是用来解决两个问题的:
回调地狱,代码难以维护, 常常第一个的函数的输出是第二个函数的输入这种现象
promise可以支持多个并发的请求,获取并发请求中的数据
这个promise可以解决异步的问题,本身不能说promise是异步的
Promise的构造函数接收一个参数
当使用JavaScript中的Promise时,当您尝试访问Promise的值时,您可能会看到返回值为[object Promise]的情况。这是因为Promise是一种异步操作,它不能立即返回结果,而是需要等待操作完成后返回结果。
要访问Promise的值,您需要使用Promise的then()方法,该方法接受一个回调函数作为参数,该回调函数在Promise被解析(resolved)时被调用。例...
检出以获取文档
Gulp-data提出了一个通用API,用于将数据附加到文件对象以供其他插件使用。 借助gulp-data,您可以从多种来源生成数据对象:json,前端,数据库,任何东西...并将其设置为文件对象,以供其他插件使用。
许多插件(例如gulp-swig或gulp-jade允许通过各自的options参数传递JSON数据。 但是,经常需要的是能够根据文件名或文件的其他属性动态设置数据的功能。 在不使用其他插件的情况下,这将成为问题-随着获取数据(通过JSON文件,前端,数据库,promise等)的方式数量的增加,越来越多的插件作者必须更新其API以支持这些来源。 gulp-data插件旨在标准化一种通用的方法,该方法足以将这些数据源封装到附加到文件对象的单个data属性中。 数据的来源,JSON文件,文件的最前部分甚至是数据库实际上取决于您, gulp-d
技术一般水平有限,有什么错的地方,望大家指正。
ES6已经实现了延迟对象Promise,但是今天主角是JQ里面的延迟对象,套路其实都是差不多的。下面先看一个比较牵强的例子:
<button id=add>add</button><button id=remove>remove</button>
<div id=content></div>
$(function(){
var dfd = new $.Deferred();
var add = $(#add);
var remove = $(#remove);
var content = $(#co
promise对象用于将node.js中的异步函数串行执行,串行执行的情况可以分为以下两种情况:串联使用then方法,每次返回promise对象或其他参数。let startTime = Date.now();
function fun1() {
let err = null;
let start = Date.now()-startTime;
return new Prom
同步:就是一件事一件事的执行。只有前一个任务执行完毕,才能执行后一个任务。
异步:是相对于同步而言的,就例如定时就是一个异步任务,当浏览器按顺序执行JavaScript的代码时,发现有个定时器,浏览器不会一直等,而是会直接跳过这个定时器去执行后面的代码,等代码都执行完毕后,再来执行定时器的代码!
*详细介绍可以点击链接:什么叫异步_普通网友的博客-CSDN博客_异步
2、什么情况下需要...
为什么需要Promise?
Javascript是一门单线程语言,早期我们解决异步场景时,大部分情况都是通过回调函数来进行。
例如,在浏览器中发送ajax请求,就是常见的异步场景。发送请求后,一段时间服务端相应之后我们才能拿到结果,如果我们希望在异步结束之后执行某个操作,就只能通过回调函数这样的方式进行操作。
var dynamicFunc = function(cb){
setTimeout(function(){
cb();
}, 1000);
dynamicFunc(function()
解决输入框显示[object
Promise]的问题
在项目中遇到了一个摸不着头脑的问题,研究了很久才解决,百度上没有看到有什么记录,就将其记录一下,
项目中的输入框一输入东西就会变为[object
Promise],并且还删不掉,上图:
经过一步步排查,最终发现是双向
数据绑定时出现了问题,:
赋值变为了
异步进程导致页面渲染出现问题,将async删除,问题解决:
可以使用async/await或者.then()方法来将promise对象转换为对象。例如:
async function getObjectFromPromise(promise) {
const result = await promise;
return result;
promise.then(result => {
const object = result;
// do something with the object
希望这个回答对您有帮助。