コールバック地獄とは何ですか?コールバック地獄を解決する方法

1.コールバック地獄とは何ですか?

	地狱这个词不陌生吧!对,没错就是那个十八层地狱的地狱,一层一层的地狱。

1.同期APIと非同期APIの違い

この質問はNode.jsAPIから開始する必要があります。誰かがここで質問しますか?ブロガー、コールバック地獄の問題について話しませんでしたか?どうすればAPIにアクセスできますか、心配しないでください。ブロガーに段階的に説明させてください。

同步API 是从上到下依次执行,前面的代码会阻塞后面的代码执行
次のコードを見てください


这里我写了一个for询还1000次,在循环里面打印,在循环体后面是另外的一个打印结果
结果是什么呢?
这个需要你自己去敲一下代码才能更好的了解喔!

for(var i=0; i<1000; i++){
    
    
	console.log(i);
}
console.log('循环体后面的代码')

异步API不会等待API执行完后在向下执行代码
次のコードを見てください、それはどのように実行されますか?

console.log('代码开始执行')
//异步操作 setTimout
setTimout(() =>{
    
     console.log('5秒后执行代码') },5000);//5000就是5秒
setTimout(() =>{
    
     console.log('0秒后执行代码')},0);
console.loh('代码结束执行');

这里的执行顺序是:
代码开始执行
代码结束执行
0秒后执行代码
5秒后执行代码

逻辑梳理:先执行同步的API,在去执行异步的API
      同步API有两个  分别是两个console.log
      异步API也有两个 分别是setTimout
      异步API里面的定时器会先执行0  在执行5

2.Node.jsの非同期API

	使用fs.readFile(‘./demo.txt’,(err,result) =>{});
	上面这个就是一个异步API
	是使用系统模块fs去查看文件

非同期APIの背後にあるコードの実行が、現在の非同期APIの実行結果に依存しているが、実際には、後続のコードが実行されたときに非同期APIが結果を返さない場合、この問題をどのように解決できますか?

	fs.readFile(‘./demo.txt’,(err,result) =>{});
	console.log('文件打印结果')

3.非同期APIを使用することによって引き起こされるコールバック地獄のケースを書きます

ケース要件:依次读取A文件,B文件,C文件

  1. まず、jsファイルを作成する必要があります
  2. 次に、1.txt 2.txt3.txtを作成します
  3. 各テキストに123を書く
  4. このようにして、3つのファイルが作成され、コードコードのリンクが入力されます。
const fs = require('fs')

fs.readFile('./1.txt','utf8',(err,result1) =>{
    
    
    console.log(result1);
    fs.readFile('./2.txt','utf8',(err,result2) =>{
    
    
        console.log(result2);

        fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
            console.log(result3);

        })
    })
});

このjsファイルを実行すると、実行結果は正しいですが、大丈夫ですか?
しかし、私たちは3つしか書いていません。18を書いたらどうなるでしょうか。

const fs = require('fs')

fs.readFile('./1.txt','utf8',(err,result1) =>{
    
    
    console.log(result1);
    fs.readFile('./2.txt','utf8',(err,result2) =>{
    
    
        console.log(result2);

        fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
            console.log(result3);
            fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
                console.log(result3);
                fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
                    console.log(result3);
                    fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
                        console.log(result3);
                        fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
                            console.log(result3);
                            fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
                                console.log(result3);
                                fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
                                    console.log(result3);
                                    fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
                                        console.log(result3);
                                        fs.readFile('./3.txt','utf8',(err,result3) =>{
    
    
                                            console.log(result3);
                                
                                        })
                                    })
                                })
                            })
                        })
                    })
                })
            })
        })
    })
});

このように理解できますか?コールバックのレイヤーとネストされたそのようなコールバックのレイヤーは、地獄のようなものです!このようなコードは保守が容易ではありません。

2.コールバック地獄を解決する方法は?

	Promise的出现就是解决Node.js异步编程中回调地狱的问题
基础语法
let promise = new Promise((resolve,reject) =>{
    
    
	setTimout(() =>{
    
    
	if(true){
    
    
	//resolve将异步API的执行结果传递出去
	    resolve({
    
    name:"张三"})
	}else{
    
    
		//reject 也是一个函数,当判断失败的时候,将结果传递出去
  		reject('失败了')
  }	
},2000);
})
//成功了
promise.then(result => console.log(result));//{name:‘张三’}
		.catch(error => console.log(error));//失败了

1. Promiseを使用して、以前に行ったケースを完了します

  1. jsファイルを作成する
  2. ファイルは前のファイルを使用できます
  3. コードの記述を開始する
//1、引入系统模块fS
const fs = require('fs');

//2、创建一个promise对象
let promise = new Promise((resolve,reject) =>{
    
    

    fs.readFile('./1.txt','utf8',(err,result) =>{
    
    
        if(err !=null){
    
    
            reject(err);
        }else{
    
    
            resolve(result);
        }
    });
});
//文件成功的信息
promise.then((result) =>{
    
    
    console.log(result);
})
//文件失败的信息
.catch((err) =>{
    
    
    console.log(err);
})

2.改善された方法

const fs = require('fs')
function p1(){
    
    
    return new Promise((resolve,reject) =>{
    
    
        fs.readFile('./1.txt','utf8',(err,result) =>{
    
    
            resolve(result);
        })
    })
}
function p2(){
    
    
     return new Promise((resolve,reject) =>{
    
    
        fs.readFile('./2.txt','utf8',(err,result) =>{
    
    
            resolve(result);
        })
    })
}
function p3(){
    
    
    return new Promise((resolve,reject) =>{
    
    
        fs.readFile('./3.txt','utf8',(err,result) =>{
    
    
            resolve(result);
        })
    })
}
//依次执行1、2、3
p1().then((r1) =>{
    
    
    console.log(r1);
    //return p2
    return p2();
})
.then((r2) =>{
    
    
    console.log(r2);
    //return p3()
    return p3();
})
.then((r3) =>{
    
    
    console.log(r3);
})

これを読んだ後、あなたはコールバック地獄が何であるか知っていますか?そしてそれを解決する方法は?
覚えておいてください!コードを読んだり記事を読んだりする記憶は深くありません。自分でコードを入力する必要があります。これはインタビューでよく見られます。コードワードは簡単ではありません。1つのキーでトリプル接続できるといいのですが。

おすすめ

転載: blog.csdn.net/weixin_45054614/article/details/115032044