promise对象（angular 怎么把promise对象改为同步的）

本文目录

• angular 怎么把promise对象改为同步的
• 后端返回数据是[object Promise]（Promise对象）
• Promise入门之：让函数返回一个Promise对象
• promise的三种状态
• JS中promise对象的作用与使用
• 前端的Promise是干啥的
• 如何获取promise对象中的值

angular 怎么把promise对象改为同步的

这篇文章主要介绍了Angular中的Promise对象($q介绍),本文讲解了Promise模式、Q Promise的基本用法、AngularJs中的$q.defferd等内容,需要的朋友可以参考下 在用JQuery的时候就知道 promise 是 Js异步编程模式的一种模式，但是不是很明白他跟JQuery的deferred对象有什么区别。随着公司项目的进行，要跟后台接数据了，所以决定搞定它。 Promise Promise是一种模式，以同步操作的流程形式来操作异步事件，避免了层层嵌套，可以链式操作异步事件。 我们知道，在编写javascript异步代码时，callback是最最简单的机制，可是用这种机制的话必须牺牲控制流、异常处理和函数语义化为代价，甚至会让我们掉进出现callback大坑，而promise解决了这个问题。 ES6中Promise、angularJS内置的AngularJS内置Q，以及when采用的都是Promises/A规范，如下： 每个任务都有三种状态：未完成(pending)、完成(fulfilled)、失败(rejected)。 1.pending状态：可以过渡到履行或拒绝状态。 2.fulfilled状态：不能变为其他任何状态，而且状态不能改变，必须有value值。 3.rejected状态：不能变为其他任何状态，而且状态不能改变，必须有reason。 状态的转移是一次性的，状态一旦变成fulfilled（已完成）或者failed（失败/拒绝），就不能再变了。 代码如下: function okToGreet(name){ return name === ’Robin Hood’; } function asyncGreet(name) { var deferred = $q.defer(); setTimeout(function() { // 因为这个异步函数fn在未来的异步执行，我们把代码包装到 $apply 调用中，一边正确的观察到 model 的改变 $scope.$apply(function() { deferred.notify(’About to greet ’ + name + ’.’); if (okToGreet(name)) { deferred.resolve(’Hello, ’ + name + ’!’); } else { deferred.reject(’Greeting ’ + name + ’ is not allowed.’); } }); }, 1000); return deferred.promise; } var promise = asyncGreet(’Robin Hood’); promise.then(function(greeting) { alert(’Success: ’ + greeting); }, function(reason) { alert(’Failed: ’ + reason); }, function(update) { alert(’Got notification: ’ + update); }); Q Promise的基本用法 上面代码表示， $q.defer() 构建的 deffered 实例的几个方法的作用。如果异步操作成功，则用resolve方法将Promise对象的状态变为“成功”（即从pending变为resolved）；如果异步操作失败，则用reject方法将状态变为“失败”（即从pending变为rejected）。最后返回 deferred.promise ，我们就可以链式调用then方法。 JS将要有原生Promise，ES6中已经有Promise对象，firefox和Chrome 32 beta版本已经实现了基本的Promise API AngularJs中的$q.defferd 通过 调用 $q.defferd 返回deffered对象以链式调用。该对象将Promises/A规范中的三个任务状态通过API关联。 deffered API deffered 对象的方法 1.resolve(value)：在声明resolve()处，表明promise对象由pending状态转变为resolve。 2.reject(reason)：在声明resolve()处，表明promise对象由pending状态转变为rejected。 3.notify(value) ：在声明notify()处，表明promise对象unfulfilled状态，在resolve或reject之前可以被多次调用。 deffered 对象属性 promise ：最后返回的是一个新的deferred对象 promise 属性，而不是原来的deferred对象。这个新的Promise对象只能观察原来Promise对象的状态，而无法修改deferred对象的内在状态可以防止任务状态被外部修改。 Promise API 当创建 deferred 实例时会创建一个新的 promise 对象,并可以通过 deferred.promise 得到该引用。 promise 对象的目的是在 deferred 任务完成时,允许感兴趣的部分取得其执行结果。 promise 对象的方法 1.then(errorHandler, fulfilledHandler, progressHandler)：then方法用来监听一个Promise的不同状态。errorHandler监听failed状态，fulfilledHandler监听fulfilled状态，progressHandler监听unfulfilled（未完成）状态。此外,notify 回调可能被调用 0到多次，提供一个进度指示在解决或拒绝（resolve和rejected）之前。 2.catch(errorCallback) —— promise.then(null, errorCallback) 的快捷方式 3.finally(callback) ——让你可以观察到一个 promise 是被执行还是被拒绝, 但这样做不用修改最后的 value值。 这可以用来做一些释放资源或者清理无用对象的工作,不管promise 被拒绝还是解决。 更多的信息请参阅 完整文档规范. 通过then()方法可以实现promise链式调用。 代码如下: promiseB = promiseA.then(function(result) { return result + 1; }); // promiseB 将会在处理完 promiseA 之后立刻被处理, // 并且其 value值是promiseA的结果增加1 $q的其他方法 $q.when(value)：传递变量值，promise.then()执行成功回调 $q.all(promises)：多个promise必须执行成功，才能执行成功回调，传递值为数组或哈希值，数组中每个值为与Index对应的promise对象

后端返回数据是[object Promise]（Promise对象）

  打印后端传进来的数据时返回数据是的

  请求获取到的数据，打印会出现下图的问题
  加上async和await，就会获取到正确的数据。

Promise入门之：让函数返回一个Promise对象

Promise入门之：让函数返回一个Promise对象

运行结果：

运行结果：

注意在函数foo里面"then3"的位置，需要返回Promise.reject()，然后这个reject被"eeee1"处的catch捕获，然后这里必须再返回一个Promise.reject()到函数外面；如不然，相当于foo函数内部消化掉了"then3"位置的exception，导致在函数外部"eeee2"位置并不能捕获异常，因为此处会认为就没有异常发生。

promise的三种状态

promise的三种状态
Promise 是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现，ES6将其写进了语言标准，统一了用法，原生提供了Promise对象。
所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise 是一个对象，从它可以获取异步操作的消息。Promise 提供统一的 API，各种异步操作都可以用同样的方法进行处理。
Promise对象有以下两个特点。
（1）对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：Pending（进行中）、Resolved（已完成，又称 Fulfilled）和Rejected（已失败）。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是Promise这个名字的由来，它的英语意思就是“承诺”，表示其他手段无法改变。
（2）一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从Pending变为Resolved和从Pending变为Rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果。如果改变已经发生了，你再对Promise对象添加回调函数，也会立即得到这个结果。这与事件（Event）完全不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的。
有了Promise对象，就可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。此外，Promise对象提供统一的接口，使得控制异步操作更加容易。
Promise也有一些缺点。首先，无法取消Promise，一旦新建它就会立即执行，无法中途取消。其次，如果不设置回调函数，Promise内部抛出的错误，不会反应到外部。第三，当处于Pending状态时，无法得知目前进展到哪一个阶段（刚刚开始还是即将完成）。
如果某些事件不断地反复发生，一般来说，使用 Stream 模式是比部署Promise更好的选择。

JS中promise对象的作用与使用

promise的作用：ajax是异步请求，多层嵌套会造成回调地狱，promise模拟同步，将异步回调类似于同步来处理业务逻辑。
var p = new Promise(function（）{
//这里用于处理异步的回调

}),必传回调函数，不传程序会抛出异常。
创建实例对象时，回调函数会立即执行。
promise的三种状态：
pending：正在进行状态
fulfilled：完成状态
rejected：失败状态
传参1 resolve，是个函数，只要这个函数执行了说明是成功状态，参数2选传，rejecte，是个函数，这个函数执行了说明是失败状态。这两个只能执行一个，变化不可逆。
promise两种结果：
从进行到失败
从进行到成功
通过rejecte（data）h或者resolve（data）将异步响应的数据提取出来，在promise外部使用。
promise的then方法，用于处理成功或者失败的回调。
//接收上面的回调
var p1 =p.then(function(res){
})。执行后返回一个promise对象，但和p不是同一个对象。当p1执行了并且return出res,就可以连缀
p1=p.then(function(res){
return res
}).then(function(data){
//处理成功回调
}).catch(function(){
//处理失败回调
})
可以简写p.then(function(res){
//处理成功信息
}，function（err）{
//处理异常信息
})。但一般不这样写。
使用案例如下，

promise的then方法是异步方法，但会优先于定时器执行。

前端的Promise是干啥的

Promise是异步编程的一种解决方案，可以替代传统的解决方案--回调函数和事件。ES6统一了用法，并原生提供了Promise对象。作为对象，Promise有以下两个特点：

（1）对象的状态不受外界影响。

（2）一旦状态改变了就不会在变，也就是说任何时候Promise都只有一种状态。

可以通过Promise的构造函数创建Promise对象。

var promise = new Promise(function(resolve,reject)setTimeout(function(){                              
  console.log("hello world");},2000);
});

Promise构造函数接收一个函数作为参数，该函数的两个参数是resolve，reject，它们由JavaScript引擎提供。其中resolve函数的作用是当Promise对象转移到成功,调用resolve并将操作结果作为其参数传递出去；reject函数的作用是单Promise对象的状态变为失败时，将操作报出的错误作为其参数传递出去。如下面的代码：

   function greet(){    var promise = new Promise(function(resolve,reject){        var greet = "hello  world";
        resolve(greet);
    });    return promise;
    }
    greet().then(v=》{    console.log(v);//*
    })

上面的*行的输出结果就是greet的值，也就是resolve()传递出来的参数。

注意：创建一个Promise对象会立即执行里面的代码，所以为了更好的控制代码的运行时刻，可以将其包含在一个函数中，并将这个Promise作为函数的返回值。

Promise的then方法

  promise的then方法带有以下三个参数：成功回调，失败回调，前进回调，一般情况下只需要实现第一个，后面是可选的。Promise中最为重要的是状态，通过then的状态传递可以实现回调函数链式操作的实现。先执行以下代码：

function greet(){var promise = new Promise(function(resolve,reject){    var greet = "hello  world";
    resolve(greet);
});return promise;
}var p = greet().then(v=》{console.log(v);
})console.log(p);

如何获取promise对象中的值

有三种方法：
1、document.getElementById()这种方法。
2、采用JQuery方法：$("#id_name").get(0).value。(首先获得JQuery对象，再将JQuery对象转换成dom对象再取值，有点麻烦，不过也算一种办法，是吧）
3、直接使用dom对象的id。如：《input type="button" id="button1" value="测试" /》
要获得这个button的值，只要用：button1.value即可。（这中方法在比较新版的IE，FF，和遨游浏览器均测试可用）