js中的異步是指一個(gè)函數(shù)在執(zhí)行過(guò)程中，其中一部分不能馬上執(zhí)行完畢，然后執(zhí)行函數(shù)體中另外一部分。等到第一部分得到返回值再執(zhí)行第二部分。
1.回調(diào)函數(shù)callback
無(wú)法捕獲錯(cuò)誤 try catch
不能return
回調(diào)地獄
? 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.事件發(fā)布/訂閱模型
給一個(gè)事件，訂閱幾個(gè)方法，方法依次執(zhí)行。
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異步函數(shù)解決方案
? A執(zhí)行完執(zhí)行B,B執(zhí)行完執(zhí)行C。把A的返回值給B再給C
每一次執(zhí)行，返回一個(gè)新的Promise實(shí)例(鏈?zhǔn)秸{(diào)用)
? 代碼易讀
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生成器函數(shù)
調(diào)用一個(gè)生成器函數(shù)它不會(huì)立刻執(zhí)行
它返回一個(gè)迭代器函數(shù)，每調(diào)用一次next就可以返回一個(gè)值對(duì)象
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是一個(gè)為Node.js和瀏覽器打造的基于生成器的流程控制工具，借助于Promise，你可以使用更加優(yōu)雅的方式編寫非阻塞代碼。
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
可以實(shí)現(xiàn)和co一樣的功能
結(jié)構(gòu)簡(jiǎn)單，可讀性強(qiáng)
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));
