約束- JavaScriptの概念を簡素化
7454 ワード
約束は何ですか。
定義では、約束は、何かをするか、特定のものが起こるという宣言です.プログラミング世界では、約束は非同期操作の最終的な補完(または失敗)を表すオブジェクトです.
州
約束は以下の州を持つことができます.
fulfilled
and rejected
. このメソッドを使用してこれらのハンドラをアタッチすることができます.promise.then(handleSuccess, handleRejection)
上記の約束に2つのハンドラメソッドを追加しました.さて、約束が叶うなら.handleSuccess
が呼び出され、拒否されるとhandleRejection
メソッドが呼び出されます.約束が保留中でないとき、我々は約束が解決されると言います.解決されることは単に言語的便宜であり、国家ではないことを心に留めておいてください.
方法
さらに、Promiseオブジェクトには、約束を処理するときに本当に有用な複数のメソッドがあります.
1 .約束。all ()
入力-約束の繰り返し
出力-入力約束の結果の配列に解決する単一の約束
このメソッドは、1つ以上の約束があり、すべての操作が正常に完了した場合にのみ何かを行いたい場合に便利です.
Promise.all()
は拒否される入力約束のどれかに直ちに拒絶する.たとえば、複数のAPI呼び出しを行いたい場合、コードが成功するようにコードを使用する場合は、Promise.all()
.const firstPromise = new Promise((resolve, reject) => {
setTimeout(resolve, 300, "First Promise");
});
const secondPromise = new Promise((resolve, reject) => {
setTimeout(resolve, 100, "Second Promise");
});
const thirdPromise = new Promise((resolve, reject) => {
setTimeout(resolve, 1000, "Third Promise");
});
const rejectedPromise = Promise.reject("EVERYBODY STAY CALM. STAY F***ING CALM. I WAS REJECTED");
//Promise.all() method
Promise.all([firstPromise, secondPromise, thirdPromise])
.then((results) => {
console.log("All the promises were fulfilled here - ", results);
})
.catch((error) => {
console.error("Error: ", error);
});
//Promise.all() method with a rejected promise
Promise.all([firstPromise, rejectedPromise, thirdPromise])
.then((results) => {
console.log("All the promises were fulfilled");
console.log("Response from all method - ", results);
})
.catch((error) => {
console.error("Error: ", error);
});
出力Error: EVERYBODY STAY CALM. STAY F***ING CALM. I WAS REJECTED
All the promises were fulfilled here - [ 'First Promise', 'Second Promise', 'Third Promise' ]
2 .約束。allsettled ()
入力-約束の繰り返し
出力-入力約束の結果の配列に解決する単一の約束
我々は、タスクがお互いに依存しているときに、この方法を使用することができますし、それぞれの約束の結果に関係なく、すべての約束のすべての結果を知りたい.
//Promise.allSettled() method with a rejected promise
Promise.allSettled([firstPromise, rejectedPromise, thirdPromise])
.then((results) => {
console.log("I don't care if all the results are fulfilled or not");
console.log("Response from allSettled method - ", results);
})
.catch((error) => {
console.error("Error: ", error);
});
あなたは明らかに間の違いを見ることができますall
and allSettled
メソッド.The all
方法は、すべての約束が満たされることを望みますallSettled
方法は約束をするだけだsettled
にかかわらずfulfilled
or rejected
)I don't care if all the results are fulfilled or not
Response from allSettled method - [
{ status: 'fulfilled', value: 'First Promise' },
{
status: 'rejected',
reason: 'EVERYBODY STAY CALM. STAY F***ING CALM. I WAS REJECTED'
},
{ status: 'fulfilled', value: 'Third Promise' }
]
3 .約束any ()
入力-約束の繰り返し
出力-任意の約束の約束のいずれかとしてすぐに解決する単一の約束は、満たされた約束の値で
約束が全く満たされないならば、返された約束は
AggregateError
.const firstPromise = new Promise((resolve, reject) => {
setTimeout(resolve, 300, "First Promise");
});
const secondPromise = new Promise((resolve, reject) => {
setTimeout(resolve, 100, "Second Promise");
});
const thirdPromise = new Promise((resolve, reject) => {
setTimeout(resolve, 1000, "Third Promise");
});
const rejectedPromise = Promise.reject(
"EVERYBODY STAY CALM. STAY F***ING CALM. I WAS REJECTED"
);
//Promise.any() Method
Promise.any([firstPromise, secondPromise])
.then((fasterPromise) => {
console.log("Response from any method with no rejections - ", fasterPromise);
})
.catch((error) => {
console.error("Error: ", error);
});
//Promise.any() Method with rejections
Promise.any([rejectedPromise, rejectedPromise])
.then((fasterPromise) => {
console.log("Response from any method with rejections - ", fasterPromise);
})
.catch((error) => {
console.error("Error: ", error);
});
//Promise.any() Method
Promise.any([firstPromise, secondPromise]).then((fasterPromise) => {
console.log("Response from any method - ", fasterPromise);
});
出力Error: [AggregateError: All promises were rejected]
Response from any method with no rejections - Second Promise
4 .約束。race ()
入力-約束の繰り返し
出力-約束
fulfils
or rejects
その約束からの価値や理由によって、イデラブルの約束の1つが成就するか、拒絶するとすぐにconst firstPromise = new Promise((resolve, reject) => {
setTimeout(resolve, 300, "First Promise");
});
const secondPromise = new Promise((resolve, reject) => {
setTimeout(resolve, 100, "Second Promise");
});
const thirdPromise = new Promise((resolve, reject) => {
setTimeout(resolve, 1000, "Third Promise");
});
const rejectedPromise = Promise.reject(
"EVERYBODY STAY CALM. STAY F***ING CALM. I WAS REJECTED"
);
//Promise.race() Method
Promise.race([firstPromise, secondPromise])
.then((fasterPromise) => {
console.log(
"Response from race method with no rejections - ",
fasterPromise
);
})
.catch((error) => {
console.error("Error: ", error);
});
//Promise.race() Method with rejections
Promise.race([secondPromise, rejectedPromise])
.then((fasterPromise) => {
console.log("Response from race method with rejections - ", fasterPromise);
})
.catch((error) => {
console.error("Error: ", error);
});
方法の名前が示唆するように、我々はここでレースをします.約束があるかどうかは重要ではないfulfilled
or rejected
. The race
メソッドは、最速の解決された約束を返します.出力
Error: EVERYBODY STAY CALM. STAY F***ING CALM. I WAS REJECTED
Response from race method with no rejections - Second Promise
5 .約束reject ()とプロミス。resolve ()
以前の例で使用しているので、既にリジェクトメソッドに精通しています.基本的に、rejectメソッドを使って約束を拒絶します.
また、値がPromiseオブジェクトである場合、値として渡されたPromise、または値として渡されたPromiseを返す解決メソッドがあります.解決は満たされて混乱することではない.お読みくださいthis StackOverflow answer 詳細については.
運命
また、解決し、未解決の2つの相互排他的な運命があります.
結論
要約すると、JavaScriptの非同期操作を処理するために約束を使用します.特に、複数の非同期操作が実行されている場合、約束を知らない場合はそれらを処理する悪夢です.
今日の記事から何か貴重なことを学びましたように.あなたがそれを好きなら、次の記事を見逃すことはありませんので、次のようにドロップし、私に従ってください.そしていつものように、セーフガイズ😷
Reference
この問題について(約束- JavaScriptの概念を簡素化), 我々は、より多くの情報をここで見つけました https://dev.to/thisurathenuka/promises-javascript-concepts-simplified-in2テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol