この約束をどのようにリファクタリングするか？

Question

これは古典的なフォールバックソリューションです。最初のelがレンダリングされない場合は、他のレンダラーと再試行します。これを最もリファクタリングするには？

何このコードで間違っているのは、ということです。

• レンダラは配列にする必要がありますが、ここでは、彼らはその後、ブロックにしています。
• 以前のレンダラーが動作しなかった場合は、別のレンダラーに落とす必要があります。
• 最初のレンダラーは2番目のレンダラーと同じようなものです。結果が空であるかどうかをチェックします。そこには重複があります。しかし、最初のものは最初に実行する必要があり、2番目と他のものは一緒に実行することができます。

let first = $('#id1'); 

return this.render('priorityRenderer', first).then(isEmpty => { 

    let els = [ 
    $('#id2'), $('#id3') 
    ]; 

    if (isEmpty) { 
    // put back the first el to the pool to render it again below 
    els.unshift(first); 
    } 

    return Promise.all(els.map(el => { 
    return this.render('secondaryRenderer', el) 
     .then(result => { 
     if (result) { 
      return result; 
     } else { 
      return this.render('3thRenderer', el) 
     } 
     }) 
     .then(result => { 
     if (result) { 
      return result; 
     } else { 
      return this.render('4thRenderer', el) 
     } 
     }) 
     .then(result => { 
     if (result) { 
      return result; 
     } else { 
      return this.render('5thRenderer', el) 
     } 
     }); 
    }) 
}); 

Answer 1

最初のものが結果を返すまでは、レンダラーのチェーンを呼び出すためにthese approachesのいずれかを使用できます。

renderers(rs, el, i=0) { 
    if (i < rs.length) 
     return this.render(rs[i], el).then(result => result || this.renderers(rs, el, i+1)); 
    else 
     return Promise.reject(new Error("no renderer worked, tried: "+rs)); 
} 

は、その後、あなたのメソッド内で、あなたは

let first = $('#id1'); 
let els = [$('#id2'), $('#id3')]; 
let rs = ['secondaryRenderer', '3rdRenderer', '4thRenderer', '5thRenderer']; 

return Promise.all([ 
    this.renderers(['priorityRenderer'].concat(rs), first) 
].concat(els.map(el => 
    this.renderers(rs, el) 
))); 

を行うことができます