JavaScriptの約束事は何ですか？

Question

約束

（...）今利用できる値、もしくは将来的に、または決して（出典：MDN）さ

は、だから私はどのアプリを持って言うことができます写真で作業したい画像は、例えば、ロードされる。アルゴリズムがバックグラウンドで動作した後（または何らかの他の種類の遅延）今、私は、ピクチャが将来ので利用可能かどうかを、コールバックではなく約束を使って確認したいと思います。これはしません

Promise.all([ 
    loadImage('images/pic1.jpg'), 
    loadImage('images/pic2.jpg') 
]).then((images) => { 
    images.forEach(img => addImg(img.src)) 
}).catch((error) => { 
    // handle error 
}) 

：これに属する約束は、次のようになります

function loadImage(url) { 
    return new Promise((resolve, reject) => { 
    let image = new Image() 

    image.onload = function() { 
     resolve(image) 
    } 

    image.onerror = function() { 
     let message = 
     'Could not load image at ' + url 
     reject(new Error(msg)) 
    } 

    image.src = url 
    }) 
} 

：画像が利用可能な場合、私は次のコードを使用することができ、確認するには

ピクチャがの場合は、の場合はには表示されません。写真は一秒でそこにありますが、約束は誤りを返すでしょう。

ここで約束しないものは何ですか？私の場合、それは実際の約束そのものではなく、loadImage(url)に依存しています。

PS：例は、それが解決されたとき、どのような約束を知っているだろうfunfunfunction

---

に触発しますか？

私の理解では、バックグラウンドで動く可能性のあるフレームワークはもちろんのこと、その周りの他のコードを「聴く」ことはできません。私はこの例のようになるでしょう：写真が利用可能かどうかを約束します - 彼らはまだバックグラウンドで働いています - >約束が解決してエラーをスローする - >アルゴリズムは画像で終了します - >画像がありますか？

Answer 1

JavaScriptの約束事は何ですか？

参照：You're Missing the Point of Promisesを参照してください。

---

Promiseを使用することに関連するすべてのニュアンスを考慮することはできません。 promiseタグを参照すると、頻繁に投稿するユーザーが投稿した他のユーザーの質問と回答を読むことができます。promiseタグあなたの啓発のために、それらの質問と回答のコメントで特定の事例について質問してください。

---

あなたはないPromise鎖の可変外の値をチェックすることで、.then()または.catch()を使用してPromiseの値を取得します。

"現在"と "未来"は無視してください。 .then()、または.catch()にコードを実装することに重点を置いてください。識別子によって参照される非同期値を参照する他のすべてのコードは信頼できません。

let id = void 0; 
 

 
let promise = new Promise(resolve => 
 
       setTimeout(() => {id = 123; resolve(id) }, Math.random() * 2000) 
 
      ); 
 

 
// this is not accurate 
 
console.log(`id: ${id}`); // what is `id` here? 
 

 
promise.then(res => console.log(`id: ${res}`));

注また、実行プログラムとしてPromiseコンストラクタに渡された関数は、.then()から直ちに

let id = void 0; 
 

 
let promise = new Promise(resolve => 
 
       setTimeout(resolve, Math.random() * 2000, id = 123) 
 
      ); 
 

 
// is this accurate? 
 
console.log(`id: ${id}`); // what is `id` here? 
 

 
promise.then(res => console.log(`id: ${res}`));

return値と呼ばれます。

return値が.then()である。代わり.forEach()

Promise.resolve(123) 
 
.then(data => console.log(data)) 
 
.then(res => console.log(res)) // `undefined` 
 

 
Promise.resolve(123) 
 
.then(data => { console.log(data); return data}) 
 
.then(res => console.log(res)) // `123`

使用.map()の.map()を使用する代わりに、.forEach()

let fn = (id) => new Promise(resolve => 
 
        setTimeout(resolve, Math.random() * 2000, id) 
 
       ); 
 
        
 
Promise.all([1,2,3].map(fn)) 
 
.then(data => Promise.all(data.forEach(id => fn(id * 10)))) 
 
.then(data => console.log(`data: ${data}`)); // where is `data` 
 

 
        
 
Promise.all([1,2,3].map(fn)) 
 
.then(data => Promise.all(data.map(id => fn(id * 10)))) 
 
.then(data => console.log(`data: ${data}`)); // `[10, 20, 30]`

Aは、拒絶反応を処理したり、エラーが変換されます解決Promiseにthrowないnまたは拒絶は_

let fn =() => new Promise((resolve, reject) => 
 
       setTimeout((id) => {reject(new Error(id)) }, Math.random() * 2000, 123) 
 
      ) 
 

 
fn().then(res => console.log(`id: ${res}`)) 
 
.catch(err => console.log(`err: ${err}`)) 
 
.then(res => console.log(`res: ${res}`)) // `undefined` 
 

 
fn().then(res => console.log(`res: ${res}`)) 
 
.catch(err => { console.log(`err: ${err}`); return err }) 
 
// `.then()` is not called, function passed to `.catch()` is called 
 
.then(res => console.log(`res: ${res}`)) 
 
.catch(err => console.log(`err: ${err}`)) // `123`