欢迎访问我的博客https://qqqww.com/,祝码农同胞们早日走上人生巅峰,迎娶白富美~~~
准备
- 一个空
js
文件和files
文件里面放上三个文件,方便下面操作
- 载入核心模块
const fs = require('fs')
const path = require('path')
需求:封装一个方法,给你一个要读取文件的路径,你这个方法能帮我读取文件,并把内容返回给我
普通方式
// 这是普通读取文件的方式
fs.readFile(path.join(__dirname, './files/1.txt'), 'utf-8', (err, dataStr) => {
if (err) throw err
console.log(dataStr)
})
但是这样达不到需求,所以就有了下面一种方式
简单封装一
由于读取文件是异步操作,不能直接在函数内部return,所以没有接收到返回值,在外部调用就是undefined
所以用callback
接收一下
简单封装二
封装一个给定文件路径,返回读取到的内容的读取文件的异步方法
function getFileByPath (fpath, callback) {
fs.readFile(fpath, 'utf-8', (err, data) => {
if (err) throw err
// console.log(data)
callback(data)
})
}
getFileByPath(path.join(__dirname, './files/1.txt'), (data) => {
console.log(data) // 111
})
这样基本就达到需求了,但是依然不能知道读取文件数据到底成功还是失败,没有明确的标识
简单封装三
所以可以给 callback 规定两个参数,一个失败结果,一个成功结果
同时我们规定,如果成功后,返回结果应该位于 callback 结果的第二个位置,此时第一个结果由于没有出错,所以放一个 null ,如果失败了,则第一个结果放置 error 对象,第二个位置放置一个 undefined
function getFileByPath (fpath, callback) {
fs.readFile(fpath, 'utf-8', (err, data) => {
if (err) throw err
// console.log(data)
callback(null, data)
})
}
getFileByPath(path.join(__dirname, './files/1.txt'), (err, data) => {
// console.log(data) // 111
if (err) return console.log(err.message)
console.log(data)
})
这种情况下,不管成功还是失败,共用的是一个参数(不是很好理解),可以拆分为两个,成功一个回调,失败一个回调,这样更好理解
简单封装四
function getFileByPath (fpath, succCb, errCb) {
fs.readFile(fpath, 'utf-8', (err, data) => {
if (err) errCb(err)
succCb(data)
})
}
getFileByPath(path.join(__dirname, './files/1.txt'), function (data) {
console.log(data + '成功了')
}, function (err) {
console.log(err.message + '失败了')
})
这样就基本封装完成,达到需求,并提示失败和成功,提升体验
Promise解决回调地狱
假如我们使用上一种封装方法,去按顺序读取三个文件files/1.txt
、files/2.txt
、files/3.txt
这样就需要嵌套
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)
})
})
})
假如以上的嵌套有很多,还不止这样三个嵌套呢?就会成这样
这样就形成了回调地狱,由于函数查找变量的规则需要由内至外一层一层去查找,这样难免造成大量的资源浪费
引入Promise来解决回调地狱的问题
Promise介绍
Promise
是ES6
中的一个对象,用于表示一个异步操作的最终状态(完成或失败),以及其返回的值。
在浏览器控制台输入console.dir(Promise)
可以看到
我们看图片中两个红框,第一个红框,Promise
是一个构造函数
第二个红框是两个回调函数,reject()
表示失败执行,resolve()
表示成功后执行
点开prototype:Promise
发现一个then
方法和catch()方法
,而then和catch
方法和在Promise
的原型对象中,所以可以用promise
直接调用
Promise解决回调地狱
这样就可以封装一个基于Promise
读取文件的函数
const fs = require('fs')
function getFileByPath(fpath) {
return new Promise (function (resolve, reject) {
fs.readFile(fpath, 'utf-8', (err, data) => {
if (err) return reject(err)
resolve(data)
})
})
}
// 如果 ,前面的 Promise 执行失败,我们不想让后续的Promise 操作被终止,可以为 每个 promise 指定 失败的回调
getFileByPath('./files/11.txt')
.then(function (data) {
console.log(data)
// 读取文件2
return getFileByPath('./files/2.txt')
}, function (err) {
console.log('这是失败的结果:' + err.message)
// return 一个 新的 Promise
return getFileByPath('./files/2.txt')
})
.then(function (data) {
console.log(data)
return getFileByPath('./files/3.txt')
})
.then(function (data) {
console.log(data)
}).then(function (data) {
console.log(data)
})
当 我们有这样的需求: 哪怕前面的 Promise 执行失败了,但是,不要影响后续 promise 的正常执行,此时,我们可以单独为 每个 promise,通过 .then 指定一下失败的回调;
有时候,我们有这样的需求,个上面的需求刚好相反:如果 后续的Promise 执行,依赖于 前面 Promise 执行的结果,如果前面的失败了,则后面的就没有继续执行下去的意义了,此时,我们想要实现,一旦有报错,则立即终止所有 Promise的执行。
getFileByPath('./files/1.txt')
.then(function (data) {
console.log(data)
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)
})