循环通过chrome.bookmarks.getChildren数组时的JS Promise

Question

我正在开发一个google chrome扩展，我必须循环遍历节点(文件夹)，以检查每个文件夹中有多少项。我正在向函数getBookmarksCount(ID)提供一个项目ID。我在从main函数获取结果时遇到了问题，console.log()在日志记录时返回正确的值。

下面是我的代码：

​

const getBookmarksCount = (bmkNode) => {
    let nodes = []
    let result = 0

    new Promise ((resolve, reject) => {
        chrome.bookmarks.getChildren(bmkNode, (bmkChildren) => {

            _.each(bmkChildren, (item) => {
            
                // Check if the item is a bookmark link
                if (!(item.url === undefined || item.url === null)) {
                    nodes.push(item.title)
                }
                
            })
    
            resolve(_.size(nodes))

        })
        
    }).then((size) => {
        console.log(size) //The correct number of items is listed here eg. 6
        result = size
    })

    return result
}

//I'm suppling a parent folder ID the function should return number of children

getBookmarksCount(123) // eg. 6 -> at the moment returns 0

​

这是我更新后的工作版本，没有承诺。setTimeout()是一个肮脏的黑客，但它是有效的。有什么建议可以改进这个功能吗？

​

const getBookmarksCount = (bmkNode) => {
let nodes = []

const getChildrenCount = (bmkNode) => {

    chrome.bookmarks.getChildren(bmkNode, (bmkChildren) => {
        
        _.each(bmkChildren, (item) => {

            // if is bookmark otherwise loop trough subfolder
            (!(item.url === undefined || item.url === null)) ? nodes.push(item.title): getChildrenCount(item.id)

        })

    })

    setTimeout(() => {
        $(`#counter_${bmkNode}`).html(_.size(nodes))
    }, 50)

}

getChildrenCount(bmkNode)

}

// HTML Template

<label class="label label-primary" id="counter_${item.id}">0</label>

​

Answer 1

正如Bravo在评论中指出的那样，你并不是真的在等待你的代码执行。不过，你们已经很接近了！

const getBookmarksCount = (bmkNode) => {
   return new Promise ((resolve) => {
      let nodes = []
      chrome.bookmarks.getChildren(bmkNode, (bmkChildren) => {
          _.each(bmkChildren, (item) => {
              // Check if the item is a bookmark link
              if (!(item.url === undefined || item.url === null)) {
                  nodes.push(item.title)
              }  
          })

          resolve(_.size(nodes))
      })
   })
}
getBookmarksCount(123).then(size => {
    console.log(size)
})

请注意第二行上的return new Promise，它与您提供的代码片段有一个关键的区别。通过这样做，您可以等待在这里“返回”，直到您实际完成异步工作并调用resolve。然后，为了获得返回值，您将在调用getBookmarksCount时执行与所使用的相同的.then语法。

希望这会有帮助，当然，也能起作用！