Javascript Promise 学习 (中)
时隔多日,对promise有了多一点点的了解。
最近用angularjs 做开发,所以研究了一下它的 $q
功能不算很强大,算是简化版的 Q.js
参考了一下源码,不过我的等级还差很多...
作为学习,我自己又重写了一篇。
这次的比较整齐。代码也少了 .
$q = function (asyncFn) {
var defer = new Deferred();
asyncFn(defer.resolve.bind(defer), defer.reject.bind(defer));
return defer.promise;
};
$q.defer = function () {
return new Deferred();
};
$q.reject = function (reason) {
var defer = new Deferred();
defer.reject(reason);
return defer.promise;
};
$q.all = function (values) {
var defer = new Deferred();
var finalDatas = [];
var count = 0;
values.forEach(function (value, i) {
count++;
$q.when(value, function (data) {
finalDatas[i] = data; //直接按index装入,不用另外排序
if (--count === 0) { //一个++ 一个-- 互相抵消
defer.resolve(finalDatas);
}
}, function (reason) {
defer.reject(reason);
});
});
return defer.promise;
};
$q.when = function (value, onFulfilled, onRejected, onNotify) {
if (value instanceof Promise) return value.then(onFulfilled, onRejected, onNotify);
var defer = new Deferred();
defer.resolve(value);
return defer.promise.then(onFulfilled, onRejected, onNotify);
};
function Deferred() {
this.promise = new Promise();
}
Deferred.prototype = {
//resolve reject 几乎是一样的, notify 在调用后不会被删除
resolve: function (data) {
var promise = this.promise;
//要延误执行,防止then方法还没有设置好回调,就想要resolve的情况
setTimeout(function () {
promise.states = "fulfilled";
promise._processCallback(data);
}, 0);
},
reject: function (reason) {
var promise = this.promise;
setTimeout(function () {
promise.states = "rejected";
promise._processCallback(reason);
}, 0);
},
notify: function (data) {
var promise = this.promise;
setTimeout(function () {
promise.states = "notify";
promise._processCallback(data, true);
}, 0);
},
constructor: Deferred
}
//主要是保存defer, 做promise连用
function Callback(defer, onFulfilled, onRejected, onNotify) {
this.defer = defer;
this.onFulfilled = onFulfilled;
this.onRejected = onRejected;
this.onNotify = onNotify;
}
function Promise() {
this.states = "pending";
this.value = undefined;
this.reason = undefined;
this._callbacks = [];
}
Promise.prototype = {
then: function (onFulfilled, onRejected, onNotify) {
//把回调收集起来,如果states不是等待就马上出发
var defer = new Deferred();
this._callbacks.push(new Callback(defer, onFulfilled, onRejected, onNotify));
if (this.states !== "pending") {
var data = (this.states === "fulfilled") ? this.value : this.reason;
this._processCallback(data);
}
return defer.promise;
},
"catch": function (onRejected) {
return this.then(null, onRejected);
},
'finally': function (cleanup) {
return this.then(cleanup, cleanup);
},
_processCallback: function (data, is_keepCallback) {
//这里的data不接受promise,偷懒没做。哈哈
var promise = this;
if (this.states === "pending") return;
var states = ("on-" + this.states).toCamelCase();
var promiseCallbacks = this._callbacks;
var length = promiseCallbacks.length;
for (var i = 0, l = promiseCallbacks.length; i < l; i++) {
var callback = (is_keepCallback) ? promiseCallbacks[i] : promiseCallbacks.shift();
var defer = callback.defer;
if (G.isFunction(callback[states])) {
//要做错误处理哦
try {
//调用回调,
var returnValue = callback[states](data);
//如果是promise那就乾坤大挪移把promise连连接过去
if (returnValue instanceof Promise) {
returnValue.then(defer.resolve.bind(defer), defer.reject.bind(defer));//这里要用bind,因为resolve内需要引用this
}
else {
//不是的话就到值传给下一个promise咯
defer.resolve(returnValue);
}
}
catch (e) {
defer.reject(e);
}
}
else {
//data不是函数就直接传下去
defer.resolve(data);
}
}
},
constructor: Promise
}
Javascript Promise 学习 (中)的更多相关文章
- Javascript Promise 学习笔记
1. 定义:Promise是抽象异步处理对象以及对其进行各种操作的组件,它把异步处理对象和异步处理规则采用统一的接口进行规范化. 2. ES6 Promises 标准中定义的API: ...
- Javascript - Promise学习笔记
最近工作轻松了点,想起了以前总是看到的一个单词promise,于是耐心下来学习了一下. 一:Promise是什么?为什么会有这个东西? 首先说明,Promise是为了解决javascript异步编 ...
- Javascript Promise 学习(上)
Promise 就是处理异步的一个规范方法 a();b();alert("a");如果a() 里面有一个ajax 或者settimeout 那么alert("a" ...
- JavaScript语言学习中的注意事项
javascript: 基于浏览器 基于对象 事件驱动 脚本语言 由: javascript: ECMAscript(ES) DOM文档对象模型 BOM浏览器对象模型,三部分组成 使用js的三种方式 ...
- 【JavaScript】学习中遇到的一些问题
一.JavaScript中没法直接比较两个object和array是否相等
- JavaScript之Promise学习笔记
一直想知道Promise到底是怎么实现的,网上一搜几十篇文章,看的一脸蒙蔽.最后算是找到几个讲的真心很详细明了的.看了一份源码看了很久很久……最后找大佬问了几处看不懂的地方,大佬只看了十几分钟就看懂了 ...
- JavaScript学习中的挑战
当人们尝试学习 JavaScript , 或者其他编程技术的时候,常常会遇到同样的挑战: 有些概念容易混淆,特别是当你学习过其他语言的时候.很难找到学习的时间(有时候是动力).一旦当你理解了一些东西的 ...
- javascript学习中自己对作用域和作用域链理解
在javascript学习中作用域和作用域链还是相对难理解些,下面我关于javascript作用域和作用域链做一下详细介绍,给各位初学者答疑解惑. 首先我们介绍一下什么是作用域? 从字面上理解就是起 ...
- es6中的Promise学习
关于Promise Promise实例一旦被创建就会被执行 Promise过程分为两个分支:pending=>resolved和pending=>rejected Promise状态改变后 ...
随机推荐
- C++ STL之set常用指令
set,关联容器,元素不允许有重复,数据被组织成一棵红黑树,以牺牲插入和删除元素的效率换来了查找元素的高效率(O(logN)). 1.初始化 set<int> st; 2.begin返回第 ...
- (1.1.9)UVA 10930 A-Sequence(模拟)
/* * UVA_10930_1.cpp * * Created on: 2013年10月7日 * Author: Administrator */ #include <iostream> ...
- 合泰 HT66F30 定时器初始化
#define TM0_RUN (0<<7) //TM0运行 #define TM0_PAUST (1<<7) //TM0暂停 #define TM0_DIV4 (0<& ...
- java GBK字符转换成为UTF-8编码字符
import java.util.HashMap; import java.util.Map; /** * 创建日期: 2014-04-18 10:36:25 * 作者: 黄飞 * mail:huan ...
- Xcode7 国际化
1.第一步 HaiTing_xcodeproj.png 2.第二不 HaiTing_xcodeproj 2.png 3.第三步 Localizable_strings.png 5第五步 ZLBMeVi ...
- 来自苹果的编程语言——Swift简单介绍
关于 这篇文章简要介绍了苹果于WWDC 2014公布的编程语言--Swift. 原文作者: Lucida Blog 新浪微博 豆瓣 转载前请保留出处链接.谢谢. 前言 在这里我觉得有必要提一下Brec ...
- Max retries exceeded with ur
requests模块在抓取网页时抛出ConnectionError异常,Max retries exceeded with url 主要搜下 "Caused by <class 'so ...
- Js 正则表达式知识测试
本文对javascript中正则表达式进行了总结汇总,将知识点和注意点都理了一下,并附上2个练习题,供大家参考学习. 正则表达式: 1.什么是RegExp?RegExp是正则表达式的缩写.RegExp ...
- ASP.NET 中的返回按钮的实现【转】
返回上一页的这个东东在我们做项目的时候一般是用于填写完表单后确认的时候,有对原来输入的数据进行修改时用的,或者是因为网站为了方便浏览者而有心添加 的一个东东,一般这种功能的实现在ASP.net中都 ...
- cassandra新增、更新、删除数据。
package client; import java.io.UnsupportedEncodingException; import java.nio.ByteBuffer; import java ...