AngularJs 之 Promise 探究

2024-06-06 19:32
文章标签 promise angularjs 探究

本文主要是介绍AngularJs 之 Promise 探究,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

一、Promise 存在的意义

  解决代码层次变深后,带来的难以阅读、调试、维护、升级这些难题。

二、JavaScript传统的异步调用是使用回调函数,当我们需要对三个及三个以上的服务器进行调用访问时,如果使用回调函数的方式,那就是一层嵌套一层,最后就不知道嵌套到哪里去了,而且每一层之间如果涉及到参数的传递或者返回值的共享,那可真的是要玩死你 @_@ 。最终结果要不就是写一个几十上百行的一个嵌套层,就像俄罗斯的套娃,要不就是写几十个 fuction 管理每一层的参数和返回值。要是命名再不规范一点(用重庆话说就是:脑壳都要给你仔儿扣爆)#_#

Promise实现这种业务的时候,只能用行云流水来形容,齐刷刷地干完。


$http.get('/api/test').then(function(cresponse){//访问第一个server
return $http.get('/api/' + cresponse.data.key);//访问第二个server 此时返回一个Promise对象 可供下一层级调用
}).then(function(aresponse){
return $http.get('/zs/' + aresponse.data.api);访问第三个server 此时返回一个Promise对象 可供下一层级调用
}).then(function(bresponse){
//最终成功时的处理,当然你也可以一直向下调用
},function(error){
//最终失败的处理
});

没有一层层嵌套的代码,是不是清爽多了。  慢着!你说还看不出有什么好处,好吧,那我就上原始的JavaScript模拟访问服务器,实现上面的功能。(注:我们假定以下代码块中的Hget方法是封装好的访问服务器的方法(博主是个大懒虫!!  哪昵?懒也是本程程的'美好品质'。))

Hget('/api/test', function(result){//第一层访问Hget('/api/', function(result){//第二层
<pre name="code" class="javascript">    Hget('/api/', function(result){//第三层<pre name="code" class="javascript">       if(result.data.success){
console.log(result.data.msg);
} 
});

 });}) 
 

好了,效果出来了。

三、Promise 能实现以下功能

1. 每一个异步任务都会返回一个promise对象

2. 第一个promise 函数都含有一个then函数,成功及错误处理函数

3. 当异步任务结束时, 处理成功和失败的函数都只会被调用一次。

4. then 函数同样会返回一个promise对象

5. 每一个处理函数,都可以返回值并传入下一个函数链中。

6. 如果处理函数返回promise对象(触发一个异步请求),那么下一个处理函数在请求结束后会立即被调用。


好了,打完收工。下次再战。






这篇关于AngularJs 之 Promise 探究的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1037027

相关文章

Android平台播放RTSP流的几种方案探究(VLC VS ExoPlayer VS SmartPlayer)

技术背景 好多开发者需要遴选Android平台RTSP直播播放器的时候,不知道如何选的好,本文针对常用的方案,做个大概的说明: 1. 使用VLC for Android VLC Media Player(VLC多媒体播放器),最初命名为VideoLAN客户端,是VideoLAN品牌产品,是VideoLAN计划的多媒体播放器。它支持众多音频与视频解码器及文件格式,并支持DVD影音光盘,VCD影

Codeforces Round #240 (Div. 2) E分治算法探究1

Codeforces Round #240 (Div. 2) E  http://codeforces.com/contest/415/problem/E 2^n个数,每次操作将其分成2^q份,对于每一份内部的数进行翻转(逆序),每次操作完后输出操作后新序列的逆序对数。 图一:  划分子问题。 图二: 分而治之,=>  合并 。 图三: 回溯:

AngularJS for login

web.xml <?xml version="1.0" encoding="UTF-8"?><web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/n

数据视图(AngularJS)

<!DOCTYPE html><html ng-app="home.controller"><head><meta charset="utf-8"><title>数据视图</title><link href="page/common/css/bootstrap.min.css" rel="stylesheet"><script src="page/common/js/angular.js"></

【JavaScript】异步操作:Promise对象

文章目录 1 概述2 Promise 对象的状态3 Promise 构造函数4 Promise.prototype.then()5 then() 用法辨析6 微任务 1 概述 Promise 对象是 JavaScript 的异步操作解决方案,为异步操作提供统一接口。它起到代理作用,充当异步操作与回调函数之间的中介,使得异步操作具备同步操作的接口。 Promise 的设计思想是,

【AngularJS】字符查找

首先,在页面的控制器代码中添加一个名为“key”的属性,用于保存用户在文本框中输入的字符内容,该属性初始化时为空值。         然后,通过“ng-repeat”指令显示数据时,调用Angular中的“filter”过滤器,并添加一个对象性字符参数,指定在数据对象的“name”属性中查找“key”值,即在“姓名”属性中查找文本框输入的字符,如果找到,则显示在列表中,否则不显示

探究零工市场小程序如何改变传统兼职模式

近年来,零工市场小程序正逐渐改变传统的兼职模式,为求职者和雇主提供了一个更为高效、便捷的平台。本文将深入探讨零工市场小程序如何影响传统兼职模式,以及它带来的优势和挑战。 一、背景与挑战 传统的兼职市场往往存在信息不对称的问题,求职者难以快速找到合适的工作,而雇主也难以找到匹配的劳动力。此外,兼职工作的不稳定性和安全性也是求职者关注的焦点。零工市场小程序的兴起,旨在解决这些问题,通过数字化手

Promise的使用总结

Promise 是 JavaScript 中用于处理异步操作的一种机制。它提供了一种更清晰和更简洁的方式来处理异步代码,避免了回调地狱。以下是 Promise 的使用方法,包括创建 Promise、链式调用、错误处理、并行执行等。 1. 创建 Promise 你可以使用 new Promise 来创建一个新的 Promise 对象。Promise 构造函数接受一个执行函数,该函数有两个参数:r

Java多线程编程模式实战指南:Promise模式

文章来源: http://www.infoq.com/cn/articles/design-patterns-promise?utm_source=infoq&utm_campaign=user_page&utm_medium=link 文章代码地址: https://github.com/Viscent/JavaConcurrencyPattern/ 一、

apk中签名文件探究(*.SF, *.MF,*.RSA)

文章来源: 作者:嘟嘟小灰 链接:https://www.jianshu.com/p/e07da93acf98 来源:简书 1、取一个apk,然后进行不同签名,生成1.apk、2.apk,并提取META-INF里面的文件进行比对 def calc_sha1(data):sha1obj = hashlib.sha1()if not isinstance(data, (bytear