一.展示异步操作
const fs = require("fs");
fs.readFile("./a.txt", function(error, data) {
if (error) {
console.log("读取失败.");
} else {
console.log(data.toString());
}
});
fs.readFile("./b.txt", function(error, data) {
if (error) {
console.log("读取失败.");
} else {
console.log(data.toString());
}
});
fs.readFile("./c.txt", function(error, data) {
if (error) {
console.log("读取失败.");
} else {
console.log(data.toString());
}
});
//一共有六种输出结果
//1. a b c
//2. a c b
//3. b a c
//4. b c a
//5. c a b
//6. c b a
代码分析:
因为fs.readFile是异步操作,其函数内部的执行完成时间不一样,也就导致了输出结果顺序不是按照函数顺序进行排序的。可能会有人想着把异步操作嵌套起来,可这样就变成了回调地狱。为了使代码赏心悦目ES6中有针对的promise语法。
1.不用promise
const fs = require("fs");
fs.readFile("./a.txt", function(error, data) {
if (error) {
console.log("读取失败.");
} else {
console.log(data.toString());
fs.readFile("./b.txt", function(error, data) {
if (error) {
console.log("读取失败.");
} else {
console.log(data.toString());
fs.readFile("./c.txt", function(error, data) {
if (error) {
console.log("读取失败.");
} else {
console.log(data.toString());
}
});
}
});
}
});
//稳定输出: a b c
2.使用promise
const fs = require("fs");
var promise = function(urlPath) {
return new Promise(function(resolve, reject) {
fs.readFile(urlPath, function(error, data) {
if (error) {
reject(error);
} else {
resolve(data.toString());0刘***
}
});
});
};
promise("./a.txt")
.then(function(data) {
console.log(data);
return promise("./b.txt");
})
.then(function(data) {
console.log(data);
return promise("./c.txt");
})
.then(function(data) {
console.log(data);
});
//稳定输出: a b c
接下来就解析下Promise的运行方式
二.Promise运行方式
1.一个promise对象中有三种状态:pending resolve reject,对应待定 完成 拒绝。
2.事件进入promise实例一开始是pending状态,当事件成功时调用resolve函数,返回promise对象;反之失败时调用reject函数,也返回promise对象。
3.then函数的作用就是接收前面的promise对象,返回promise对象(一般不是同一个promise对象)
var p1 = new Promise(function(resolve, reject) {
fs.readFile("./a.txt", function(error, data) {
if (error) {
reject(error);
} else {
resolve(data.toString());
}
});
});
var p2 = new Promise(function(resolve, reject) {
fs.readFile("./b.txt", function(error, data) {
if (error) {
reject(error);
} else {
resolve(data.toString());
}
});
});
var p3 = new Promise(function(resolve, reject) {
fs.readFile("./c.txt", function(error, data) {
if (error) {
reject(error);
} else {
resolve(data.toString());
}
});
});
p1.then(function(data) {
console.log(data);
return p2;
})
.then(function(data) {
console.log(data);
return p3;
})
.then(function(data) {
console.log(data);
});
data就是每次每次读取成功的文件数据.
三.封装promise的ajax方法
function get(urlPath) {
return new Promise(function(resolve, reject) {
var oReq = new XMLHttpRequest();
oReq.open("get", url, true);
oReq.onload = function() {
resolve(oReq.responseText);
};
oReq.onerror = function(error) {
reject(error);
};
oReq.send();
});
}