Node JS環境で非同期を実現[1編,Calback]


コールバック関数
終了を待つのではなく、別のオブジェクトにタスクを渡します.別のオブジェクトがタスクを完了したとき、callback!
non-block(IO操作の実行時に停止せず、以下の操作を実行):
非同期関数(リクエストを発行し、すぐに制御権を返します).
function myCalculator(num1, num2) {
  let sum = num1 + num2;
  
    function myDisplayer(sum) {
        document.getElementById("demo").innerHTML = sum; // web 상에 display 해주는 함수
    }; // callback  함수 = myDisplayer
}

myCalculator(5, 5); // web 상에 10 이 나온다.
console.log("1");
setTimeout(() => console.log("2"), 1000);// () => console.log("2") 가 callbak 함수이다.
console.log("3");

// 1
// 3
// 2(1초뒤 출력)
地獄
コールバック地獄(callback hell)とは、コールバック関数を匿名関数として渡すプロセスを繰り返し、コードのインデントレベルが耐え難い程度に深まることを意味する.これは、通常、イベント処理やサーバ通信などの非同期タスクを実行するために発生しますが、コードの読み取り可能性が欠けているため、コードの変更が困難です.
次に例を示します.次のコードは、UserStorageクラスを使用してWebサイトにログインするコードを実現しています.
class UserStorage {
  loginUser(id, password, onSuccess, onError) {
    setTimeout(() => {
      if (id === "eamon" && password === "3481") {
        onSuccess(id);// id 와 password 가 일치하면 onSucess함수 실행
      } else {
        onError(new Error("not found"));
          // id 와 password 가 불일치하면 onError 실행
      }
    }, 2000);
  }

  getRoles(user, onSuccess, onError) {
    setTimeout(() => {
      if (user === "eamon") {
        onSuccess({ name: "eamon", role: "admin" });
          // id user 이름이 일치하면 onSucess함수 실행
      } else {
        onError(new Error("no access"));
          // id user 이름이 불일치하면 onError 실행
      }
    }, 1000);
  }
}
これらのクラスを利用してコールバック関数地獄を作成し、
const userStorage = new UserStorage();
const id = rl.prompt('enter your id');
const password = rl.prompt('enter your password');
userStorage.loginUser(
    id,
    password,
    user => {
        userStorage.getRoles(
            user,
            userWithRole => {
                alert(`hello ${userWithRole.name}, you a have a ${userWithRole.role} role.`);
            },
   		// getRoles의 onSucess함수에 해당하는 콜백함수.
            error => {
                console.log(error);
        // getRoles의 onError에 해당하는 콜백함수.
            }
        );
    },
    	// loginUser의 onSucess함수에 해당하는 콜백함수.
    error => {
        console.log(error);
    }
      	// loginUser의 onError에 해당하는 콜백함수.
)
地獄の欠点を取り戻す
  • 毒性低下.
  • のデバッグまたはエラーコードを見つけるのは難しいです.
  • リファレンス
  • https://www.w3schools.com/js/js_callback.asp
  • https://velog.io/@yujo/JS%EC%BD%9C%EB%B0%B1-%EC%A7%80%EC%98%A5%EA%B3%BC-%EB%B9%84%EB%8F%99%EA%B8%B0-%EC%A0%9C%EC%96%B4
  • https://www.youtube.com/watch?v=s1vpVCrT8f4