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 数组已填充完整，可以正确访问其元素。
以上就是JavaScript Promise 返回数组为何显示 undefined？的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
140
