javascript promise 返回数组为何显示 undefined
在使用 javascript promise 处理异步操作时，有时会出现返回数组但无法正确访问其元素的情况。
问题中的代码中，使用了 promise 来处理多个元素的截图，并在每个截图完成后将数据加入 imgs 数组。然而，直接访问 e[0] 会显示 undefined，且 e.length 也为 0。
解决方案
立即学习“Java免费学习笔记（深入）”；
为了解决这个问题，需要将 resolve(imgs) 修改为以下代码：
if (imgs.length === element.length) {
resolve(imgs);
}同时，将这段代码移动到 imgs.push(page.todataurl("image/jpeg", 1.0)) 后面。只有当所有截图完成后，才会触发 promise 的 resolve 方法，确保 imgs 数组中包含了所有元素。
修改后的代码如下：
let element = document.querySelectorAll('.test')
let promise = new Promise((resolve,reject) => {
let imgs = []
for (var i = 0; i < element.length; i++) {
html2canvas(element[i],{
useCORS: true,
allowTaint: false,
logging: true
}).then(function(canvas) {
let ctx = canvas.getContext("2d")
let page = document.createElement("canvas")
page.width = canvas.width
page.height = canvas.height
page.getContext("2d").putImageData(ctx.getImageData(0, 0, canvas.width, canvas.height), 0, 0)
imgs.push(page.toDataURL("image/jpeg", 1.0))
if (imgs.length === element.length) {
resolve(imgs);
}
})
}
})
promise.then(e => {
console.log(e, e.length)
})这样修改后，会在所有截图完成后 resolve promise，确保 e 数组已填充完整，可以正确访问其元素。
