コールバック地獄、Promise、async/await

地獄

const printstr = (str) => {
	setTimeout(
    	() => {
			console.log(str)
		},
        Math.floor(Math,random() * 100) + 1
	)
}

const printAll = () => {
	printStr("A")
	printStr("B")
	printStr("C")
  }
printAll() // 비동기적으로 실행될 것입니다.

JavaScriptでsettimeout()を使用すると、非同期実行が可能になります.
この場合、順序を制御する場合は、コールバック関数を使用します.

const printstr = (str) => {
	setTimeout(
    	() => {
			console.log(str)
		},
        Math.floor(Math,random() * 100) + 1
	)
}

const printAll = () => {
	printStr("A", () => {
    	printStr("B", () => {
        	printStr("C", () => {})
          })
        })
      }
printAll() // 시간텀을 두고 "A" "B" "C" 가 순서대로 출력 될 것입니다.

ただここで問題が発生しました.コールバック関数を連続的に使用するため,コードが内側に進み,可読性が悪くなる.この形態を「callback地獄」と呼ぶ.
コールバック地獄問題を解決するためにJavaScriptはPromise構文を生成した.
Promise
Promiseはnewキーワードで作成されたオブジェクトです.
Promiseのパラメータとしてコールバック関数を受け取り,コールバック関数としてのパラメータを解析し拒否する.
resolve()とexcept()は、パラメータに値を追加することで伝達される関数です.(渡された値はメソッドによって使用されます.)
Pomiseパラメータのコールバック関数は、プロセスの作成と同時に自動的に呼び出されます.(runs automatilcally)
Promiseの使い方は、値を提供する生産者と値を使用する消費者を区別することができます.
承諾対象は、値を提供する生産者の役割です.
承諾の方法について.then(), .catch(), .finally()は、値を使用するユーザです.
.then(), .catch(), .finally()は、パラメータとしてコールバック関数を受け入れます.
メソッドを呼び出すと、コールバック関数が実行されます.
ここで、コールバック関数のパラメータは、生産者(プロセスオブジェクト)から渡される値です.
.then()はresolveから値を受信します.catch()は、受信値を拒否します.
finally()は値を終了として使用しません.
すべての3つのメソッドを呼び出すと、Premisオブジェクトが返されます.
メソッドのコールバック関数で返される値は、resolveやrequestなどの値を渡します.複数のプロセスのみをメソッドフィルタとして使用する場合は、そのプロセスに戻ります.

const getHen = () => 
    new Promise((resolve, reject) => {
        setTimeout(() => resolve('닭'),1000);
    });

const getEgg = hen =>
    new Promise((resolve, reject) => {
        setTimeout(() => resolve(`${hen} => 달걀`),1000);
    });

const cook = egg =>
    new Promise((resolve, reject) => {
        setTimeout(() => resolve(`${egg} => 후라이`),1000);
    });


getHen()
    .then(hen => getEgg(hen))
    .then(egg => cook(egg))
    .then(meal => console.log(meal));

複数のプロセスを同時に使用します.

const fetchNumber = new Promise((resolve, reject) => {
	setTimeout(() => resolve(1), 1000);
    });
    
    fetchNumber
    	.then(num => num * 2)
        .then(num => num * 3)
        .then(num => {
        	return new Promise((resolve, reject) => {
            	setTimeout(() => resolve(num -1), 1000);
            });
          })
          .then(num => console.log(num));

メソッドフィルタに値を渡します.
Async/await
プロミスも複数使用可能な場合、callback地獄のようにプロミス地獄を展開します.
従って,より簡便にプミス値を伝達する方法が現れた.
まずasync/await構文を使用すると、関数の前にasyncが加算されます.
[プロセス](Process)の前に[待機](Wait)を付けると、[プロセス](Process)によって渡された値が返されます([解析](Resolve)または[拒否](Reject)によって渡されます).
返される値は、符号化をより容易にし、読み取りやすくします.

は、待機中の注意事項によって伝達される値が非同期である.
したがって、待機するプロセスが多ければ多いほど、パフォーマンスは低下します.
そのため、待ちすぎた「promis」を避けるべきだ.

const result = async() => {
	const one = await gotoCodestates(); // gotoCodeStates()는 프로미스입니다.
    console.log(one);
    
    const two = await sitAndCode(); // sitAndCode()는 프로미스입니다.
    console.log(two);
    
    const three = await eatLunch(); // eatLunch()는 프로미스입니다.
    console.log(three);
    
    const four = await goToBed(); // goToBed()는 프로미스입니다.
    console.log(four);