封装读取文件的方法
需求:给一个要读取文件的路径,这个方法能读取文件,并把内容返回
const fs = require('fs')
const path = require('path')
//第一个参数是读取的地址,第二个参数是个读取成功的回调函数,第三个参数是读取失败的回调参数
function getFileByPath(fpath, succCb, errCb) {
fs.readFile(fpath, 'utf-8', (err, dataStr) => {
if (err) return errCb(err)
succCb(dataStr)
})
}
getFileByPath(path.join(__dirname, './files/11.txt'), function (data) {
console.log('读取成功:' + data)
}, function (err) {
console.log('很抱歉读取失败,Err:' + err.message)
})
// 需求: 先读取文件1,再读取文件2,最后再读取文件3。 嵌套的次数多了被称为回调地狱。
// 如果直接不嵌套,直接放的话,异步可能不会按照顺序。
/* getFileByPath(path.join(__dirname, './files/1.txt'), function (data) {
console.log(data)
getFileByPath(path.join(__dirname, './files/2.txt'), function (data) {
console.log(data)
getFileByPath(path.join(__dirname, './files/3.txt'), function (data) {
console.log(data)
})
})
}) */
了解 ES6 中的 Promise
Promise 的本质是要干什么的:就是单纯的为了解决回调地狱问题;并不能帮我们减少代码量。
Promise 是一个构造函数,我们可以 new Promise() 得到一个 Promise 的实例;在 Promise 实例上,有两个函数,分别叫做 resolve(成功之后的回调函数) 和 reject(失败之后的回调函数);且实例都可以访问到 .then() 方法。
实例var promise = new Promise(function(){ }) 这个 function 内部写的就是具体的异步操作!,所以内部拿到 操作的结果后,无法使用 return 把操作的结果返回给调用者。 这时候,只能使用回调函数的形式,来把 成功 或 失败的结果,返回给调用者;
运行例子:
// 给路径,返回读取到的内容
const fs = require('fs')
function getFileByPath(fpath) {
return new Promise(function (resolve, reject) {
fs.readFile(fpath, 'utf-8', (err, dataStr) => {
if (err) return reject(err)
resolve(dataStr)
})
})
}
getFileByPath('./files/2.txt')
.then(function (data) {
console.log(data + '-------')
}, function (err) {
console.log(err.message)
})
运行步骤:首先是getFileByPath(’./files/2.txt’),然后return new Promise(function (resolve, reject) ,返回一个Promise实例,再访问.then(function (data){}, function (err) {}) 参数里面第一个函数是成功调用,第二个函数是失败调用。最后是运行fs.readFile(fpath, ‘utf-8’, (err, dataStr) => { })代码,结果是打印成功函数reject(err)或者resolve(dataStr)失败函数。
使用 ES6 中的 Promise,来解决 回调地狱的问题
注意: 通过 .then 指定回调函数的时候,成功的回调函数,必须传,但是失败的回调,可以省略不传。
如果前面的 Promise 执行失败,我们不想让后续的Promise 操作被终止,可以为 每个 promise 指定 失败的回调
getFileByPath('./files/11.txt')
.then(function (data) {
console.log(data)
// return 返回一个新的 promise 实例,可以继续用下一个 .then 来处理
return getFileByPath('./files/2.txt')
}, function (err) {
console.log('这是失败的结果:' + err.message)
return getFileByPath('./files/2.txt')
})
.then(function (data) {
console.log(data)
return getFileByPath('./files/3.txt')
})
.then(function (data) {
console.log(data)
})
如果后续的Promise执行,依赖于前面 Promise 执行的结果,如果前面的失败了,则后面的就没有继续执行下去的意义了,此时,我们想要实现,一旦有报错,则立即终止所有 Promise的执行;
getFileByPath('./files/1.txt')
.then(function (data) {
console.log(data)
// 读取文件2
return getFileByPath('./files/22.txt')
})
.then(function (data) {
console.log(data)
return getFileByPath('./files/3.txt')
})
.then(function (data) {
console.log(data)
})
.catch(function (err) { // catch 的作用: 如果前面有任何的 Promise 执行失败,则立即终止所有 promise 的执行,并 马上进入 catch 去处理 Promise中 抛出的异常;
console.log('这是自己的处理方式:' + err.message)
})
Jquery中的Ajax使用Promise
在一个文件夹里,首先 npm init -y
-y表示对npm要求提供的信息,都自动按下回车键,表示接受默认值。
然后 cnpm i jquery -S
安装 Jquery
引入<script src="./node_modules/jquery/dist/jquery.min.js"></script>
<script>
$(function () {
$('#btn').on('click', function () {
$.ajax({
url: './data.json',
type: 'get',
dataType: 'json'
})
//这样做一定没有兼容性
.then(function (data) {
console.log(data)
})
})
});
</script>