回调地狱（callback hell） 和 promise

回调

写了却不调用，给别人调用的函数就是回调 即回头调用一下这个函数

function f1(){}
function f2(fn){
  fn()
}
f2(f1)

上述代码的 f1就是回调

因为我只把它创建出来了，我没有调用它而是f2调用了它

异步和回调的关系

• 异步任务需要用到回调函数来通知结果
• 但是回调函数不一定只用在异步任务里
• 回调可以用到同步里 比如

array.forEach(n=>console.log(n)) // 这个就是同步回调

callback hell 回调地狱

为什么会有回调地狱的出现呢？ 我将以下面的例子来解释说明

没有顺序的读取 a b c 三个文件

const fs = require('fs')

fs.readFile('./a.txt', 'utf8', function (err, data) {
    if (err) {
        // return console.log('读取错误');

        // 抛出异常
        // 1.阻止程序的执行  2. 把错误消息打印到控制台  
        throw err
    }
    console.log(data);
})
fs.readFile('./b.txt', 'utf8', function (err, data) {
    if (err) {
        // return console.log('读取错误');

        // 抛出异常
        // 1.阻止程序的执行  2. 把错误消息打印到控制台  
        throw err
    }
    console.log(data);
})
fs.readFile('./c.txt', 'utf8', function (err, data) {
    if (err) {
        // return console.log('读取错误');

        // 抛出异常
        // 1.阻止程序的执行  2. 把错误消息打印到控制台  
        throw err
    }
    console.log(data);
})

这里打印的data是没有顺序的，谁快谁就先执行。

PS F:\nodejs\Node_test> node .\13.回调地狱.js
hello aaaa
hello bbbb
hello cccc
PS F:\nodejs\Node_test> node .\13.回调地狱.js
hello aaaa
hello cccc
hello bbbb
PS F:\nodejs\Node_test> node .\13.回调地狱.js
hello aaaa
hello cccc
hello bbbb

如果想要有顺序的分别 读取 a b c 三个文件

const fs = require('fs')

fs.readFile('./a.txt', 'utf8', function (err, data) {
    if (err) {
        // return console.log('读取错误');

        // 抛出异常
        // 1.阻止程序的执行  2. 把错误消息打印到控制台  
        throw err
    }
    console.log(data);
    fs.readFile('./b.txt', 'utf8', function (err, data) {
        if (err) {
            // return console.log('读取错误');

            // 抛出异常
            // 1.阻止程序的执行  2. 把错误消息打印到控制台  
            throw err
        }
        console.log(data);
        fs.readFile('./c.txt', 'utf8', function (err, data) {
            if (err) {
                // return console.log('读取错误');

                // 抛出异常
                // 1.阻止程序的执行  2. 把错误消息打印到控制台  
                throw err
            }
            console.log(data);
        })
    })

})

我只需一层一层的嵌套即可，等读取a.txt完毕后再去执行b.txt，等读取b.txt完毕后再去执行c.txt

PS F:\nodejs\Node_test> node .\13.回调地狱.js
hello aaaa
hello bbbb
hello cccc
PS F:\nodejs\Node_test> node .\13.回调地狱.js
hello aaaa
hello bbbb
hello cccc
PS F:\nodejs\Node_test> node .\13.回调地狱.js
hello aaaa
hello bbbb
hello cccc

Promise

为什么需要用promise？

我个人理解有三点：

1. 在使用ajax调用成功和失败方法时，命名不够规范。
2. 容易出现回调地狱
3. 很难进行错误处理

成功 和 失败 分别怎么调用

• 如果成功， 会调用 resolve() 这个时候，我们后续的 .then() 会被回调
• 如果失败， 会调用 reject() 这个时候，我们后续的 .catch() 会被调用

new Promise((resolve, rejects) => {
  setTimeout(() => {
    // 成功时调用 resolve（）
    resolve('hello world')

    // 失败时调用 reject
    // rejects('error message')
  }, 1000)
}).then((data) => {
  console.log(data);
}).catch((err) => {
  console.log(err);
})