[JS]Promise関数


Promise関数とは?


プロセスはJavaScriptの非同期処理に使用されるオブジェクトです.(承知~こんな感じ…)
JAvascriptの非同期処理は、「特定のコードの実行完了を待たずに、まず以下のコードのjavascriptの特性を実行する」ことを意味する.
△私はあなたを待たないで、いつ来ても、次のコードを実行します.

なぜPromiseが必要なのですか?


プロセスは、主にサーバから受信したデータを画面に表示するために使用されます.
通常、Webアプリケーションを実装する場合、サーバはAPIを使用してデータを要求および受信する.
APIが実行されると、サーバに「1つのデータを送信する」という要求が発行されます.ただし、データを受信する前に画面にデータを表示しようとすると、エラーや空白が発生します.
(コンピュータのロードとロードの時間が必要なので!!)
これらの問題を解決する方法の一つは「Premis」です.
->データのインポートに時間がかかるため、他の操作を要求して実行します(ロード中和面を解放します)?!と理解する.

Promiseの処理手順



ソース:https://joshua1988.github.io/web-development/javascript/promise-for-beginners/
この文章は理解に役立ちます!コメントをよく読む
function task1(a, b, cb) {
  setTimeout(() => {
    const res = a + b;
    cb(res);
  }, 3000);
}

function task2(a, cb) {
  setTimeout(() => {
    const res = a * 2;
    cb(res);
  }, 1000);
}
function task3(a, cb) {
  setTimeout(() => {
    const res = a * -1;
    cb(res);
  }, 2000);
}

task1(3, 4, (a_res) => {
  console.log("task1:", a_res);
  task2(a_res, (b_res) => {
    console.log("task2:", b_res);
    task3(b_res, (c_res) => {
      console.log("task3:", c_res);
    });
  });
});

//<결과>
//3초후.. task1: 7
//1초후.. task2: 14
//2초후.. task3: -14
しかしpromiseでコードを表現することができます
function task1(a, b) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const res = a + b;
      resolve(res);
    }, 3000);
  });
}

function task2(a) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const res = a * 2;
      resolve(res);
    }, 1000);
  });
}

function task3(a, cb) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const res = a * -1;
      resolve(res);
    }, 2000);
  });
}

task1(3, 4).then((a_res) => {
  console.log("task1ß:", a_res);
  task2(a_res).then((b_res) => {
    console.log("task2:", b_res);
    task3(b_res).then((c_res) => {
      console.log("task3:", c_res);
    });
  });
});


//<결과>
//3초후.. task1: 7
//1초후.. task2: 14
//2초후.. task3: -14
このように表現することができますが、newpromise構造は理解していないので、それはこのようにします.
return new Promise((resolve,reject)=>{});
=
const executor1 = (resolve,reject) => {}
return new Promise (executor1)
一番下のコード構造はコールバック関数と一致し,以下のように記述できる.
task1(3, 4)
  .then((a_res) => {
    console.log("task1:", a_res);
    return task2(a_res);
  })
  .then((b_res) => {
    console.log("task2:", b_res);
    return task3(b_res);
  })
  .then((c_res) => {
    console.log("task3:", c_res);
  });
  
  //<결과>
//3초후.. task1: 7
//1초후.. task2: 14
//2초후.. task3: -14
これを切寧と言います.
promisを使用すると、コードを下に拡張できます.
Premisを使用する利点は、途中で他の作業を挿入できることです(=再利用可能)
以下同
const bPromiseResult = task1(3, 4).then((a_res) => {
  console.log("task1:", a_res);
  return task2(a_res);
});

let a = "프로미스랑 많이 친해져야겠다";
console.log(a);

bPromiseResult
  .then((b_res) => {
    console.log("task2:", b_res);
    return task3(b_res);
  })
  .then((c_res) => {
    console.log("task3:", c_res);
  });

//<결과>
//프로미스랑 많이 친해져야겠다 
//3초후.. task1: 7
//1초후.. task2: 14
//2초후.. task3: -14
すなわち、promiseオブジェクトを使用して、非同期処理を呼び出すコード=task 1(3,4)と処理結果のコード=bPromiseResultを分離することで、コールバック関数構造(>フォーマット)を回避し、より読みやすく、より簡潔な非同期処理を行うことができます.
fromis...勉強を続けます!
今一番難しいのは、画像ファイルに表示されない文章です!こわす