私の既存のJavaScriptのトラバースと再帰的なロジックにブルーバードの約束を適用するには？

Question

私は、コールバックベースのメカニズムの多くを利用して私の既存のJavaScriptコードでブルーバードの約束をどのように利用できるか知りたい。

WebアプリケーションでjQueryを使用してページをロードすると、ページのメインメニューリンクが表示され、TreeModelという構造が生成され、後でページ上部にパンフレットが表示されます。私はこのTreeModelのを生成するために使用しています

機能は以下の通りです：

function _traverseNodeChildren(selector, parentNode, callback1, callback2) { 

    $(parentNode.model.element).find(selector).each(function(idx, elm) { 

     // Create a Tree Node using TreeModel 
     let node = _createTreeNode.apply(this.comp, [elm]); 
     this.parentNode.addChild(node); 

     let hasChildren = $(elm).find("+ul.dropdown-menu").length > 0; 
     if (hasChildren == true) 
      _traverseNodeChildren.apply(this.comp, ["+ul.dropdown-menu > li > a", node, callback1, callback2]); 

     if (node.model.id == "aboutLink") // last node 
     { 
      setTimeout(() => { 
       callback1.apply(this.comp, [callback2]); 
      }, 100); 
     } 
    }.bind({parentNode: parentNode, comp: this})); 
} 

を上記トラバーサルが完了した後、私は、この非同期要求の完了に非同期Ajaxリクエストやポストを伴いますmyServerCall関数を呼び出したいです最後に、第3の関数myFinalFuncを呼び出したいと思います。

現時点では私はこの横断コードを実行させるには、次のコードを使用しています：

const TreeModel = require('tree-model'); 
const _treeModel = new TreeModel(); 

let _bcRoot = _treeModel.parse({ 
    id: "0", 
    href: null, 
    text: "", 
    element: $(".main-menu").get(0) 
}); 

_traverseNodeChildren.apply(this, ["> li > a[data-bc-id]", 
      _bcRoot, myServerCall, myFinalFunc]); 

しかし、私はそれをより細かく制御を取得するために青い鳥約束に基づくアプローチに変換したいと思います。続き

は、それが最後になりたい私が欲しいのコードです：

_traverseNodeChildren.apply(this, ["> li > a[data-bc-id]", _bcRoot]) 
    .then(function() { 
     return myServerCall(); 
    }) 
    .then(function() { 
     return myFinalFunc(); 
    }) 
    .catch(function(error) { 

    }); 

私はこの使用して青い鳥をどのように行うことができますか？

Answer 1

私はcallbackが潜在的に（複数aboutLinksがある）複数回呼び出されたことを考えると、あなたが本当に約束にこれを変換することはできません、しかし

function traverseNodeChildren(comp, selector, parentNode, callback) { 
    $(parentNode.model.element).find(selector).each(function(_, elm) { 
     // Create a Tree Node using TreeModel 
     let node = createTreeNode(comp, elm); 
     parentNode.addChild(node); 

     let hasChildren = $(elm).find("+ul.dropdown-menu").length > 0; 
     if (hasChildren) 
      _traverseNodeChildren(comp, "+ul.dropdown-menu > li > a", node, callback); 

     if (node.model.id == "aboutLink") 
      setTimeout(function() { 
       callback(comp); 
      }, 100); 
     } 
    }); 
} 

traverseNodeChildren(this, "> li > a[data-bc-id]", _bcRoot, function(comp) { 
    myServerCall.call(comp, myFinalFunc) 
}); 

にコールバックコードを簡素化してから始めましょう。あなたはそれが異なって行動することを望んでいない限り。
aboutLinkが1つしかない場合、トラバーサル関数では非同期コールバックとコールバックはまったく必要ありません。

traverseNodeChildren(this, "> li > a[data-bc-id]", _bcRoot); 
Promise.delay(100) 
.then(myServerCall) 
.then(myFinalFunc) 
.catch(function(err) { … }); 

---

あなたはすべてのノード上で待機遅延トラバーサルのいくつかの種類をしたい場合、あなたは

を使用することができます。ちょうどあなたが今あっても容易 traverseNodeChildrenに触れることなくブルーバードに変換することができます

function traverseNodeChildren(comp, selector, parentNode) { 
    $(parentNode.model.element).find(selector).each(function(_, elm) { 
     // Create a Tree Node using TreeModel 
     let node = createTreeNode(comp, elm); 
     parentNode.addChild(node); 

     let hasChildren = $(elm).find("+ul.dropdown-menu").length > 0; 
     if (hasChildren) 
      _traverseNodeChildren(comp, "+ul.dropdown-menu > li > a", node); 
    }); 
} 

traverseNodeChildren(this, "> li > a[data-bc-id]", _bcRoot); 
setTimeout(function() { 
    myServerCall(myFinalFunc) 
}, 100); 

を行います

function traverseNodeChildren(comp, selector, parentNode) { 
    return Promise.mapSeries($(parentNode.model.element).find(selector), function(elm) { 
     // Create a Tree Node using TreeModel 
     let node = createTreeNode(comp, elm); 
     parentNode.addChild(node); 

     let hasChildren = $(elm).find("+ul.dropdown-menu").length > 0; 
     if (hasChildren) 
      return _traverseNodeChildren(comp, "+ul.dropdown-menu > li > a", node); 
     else 
      return Promise.delay(100); 
    }); 
} 

traverseNodeChildren(this, "> li > a[data-bc-id]", _bcRoot) 
.then(myServerCall) 
.then(myFinalFunc) 
.catch(function(err) { … });