js中的异步是指一个函数在执行过程中,其中一部分不能马上执行完毕,然后执行函数体中另外一部分。等到第一部分得到返回值再执行第二部分。
1.回调函数callback
无法捕获错误 try catch
不能return
回调地狱
function personInfo(callback){
$.ajax({
type: "GET",
url: "test.json",
data: {
username:username,
content:content
},
dataType: "json",
success: function(data){
if(data.length>0){
callback&&callback();
}
}
});
}
2.事件发布/订阅模型
给一个事件,订阅几个方法,方法依次执行。
function Event() {
this.event = {};
}
Event.prototype.on = function (type,callBack) {
if(this.event[type]){
this.event[type].push(callBack);
}else{
this.event[type] = [callBack];
}
};
Event.prototype.emit = function (type,...data) {
this.event[type].forEach((item)=>item(...data));
};
let event = new Event();
function fn1(){
console.log('吃饭');
}
function fn2(){
console.log('工作');
}
event.on('我的一天',fn1);
event.on('我的一天',fn2);
event.emit('我的一天');
3.Promise异步函数解决方案
A执行完执行B,B执行完执行C。把A的返回值给B再给C
每一次执行,返回一个新的Promise实例(链式调用)
代码易读
let p1 = new Promise(function(resolve,reject){
reject(10000000);
});
p1.then(function(value){
console.log('成功1=',value);
},function(reason){
console.log('失败1=',reason);
});
p1.then(function(value){
console.log('成功2=',value);
},function(reason){
console.log('失败2=',reason);
});
4.Generator生成器函数
调用一个生成器函数它不会立刻执行
它返回一个迭代器函数,每调用一次next就可以返回一个值对象
function *go(a){
console.log(1);
let b = yield a;
console.log(2);
let c = yield b;
console.log(3);
return c;
}
let it = go("a值");
let r1 = it.next();
let r2 = it.next('B值');
5.Co
co是一个为Node.js和浏览器打造的基于生成器的流程控制工具,借助于Promise,你可以使用更加优雅的方式编写非阻塞代码。
let fs = require('fs');
function readFile(filename) {
return new Promise(function (resolve, reject) {
fs.readFile(filename, function (err, data) {
if (err)
reject(err);
else
resolve(data);
})
})
}
function *read() {
let template = yield readFile('./template.txt');
let data = yield readFile('./data.txt');
return template + '+' + data;
}
co(read).then(function (data) {
console.log(data);
}, function (err) {
console.log(err);
});
function co(gen) {
let it = gen();
return new Promise(function (resolve, reject) {
!function next(lastVal) {
let {value, done} = it.next(lastVal);
if (done) {
resolve(value);
} else {
value.then(next, reason => reject(reason));
}
}();
});
}
6.Async/ await
可以实现和co一样的功能
结构简单,可读性强
let fs = require('fs');
function readFile(filename) {
return new Promise(function (resolve, reject) {
fs.readFile(filename, 'utf8', function (err, data) {
if (err)
reject(err);
else
resolve(data);
})
})
}
async function read() {
let template = await readFile('./template.txt');
let data = await readFile('./data.txt');
return template + '+' + data;
}
let result = read();
result.then(data=>console.log(data));
网友评论