如何将Promise结果存入变量？exifr库异步赋值问题求助

我正在使用exifr库读取PNG图片的创建日期，在遍历数组为地图标记添加数据时，遇到了Promise异步处理的问题。

我原本想在循环的每次迭代中执行以下代码：

exifr.parse(bottlefullurl, {xmp: true, tiff:false})
    .then(output => bottledate = output.CreateDate);

jmarker.jmarkerdatedata = bottledate;

但由于Promise异步操作还未完成，bottledate始终返回undefined。不过直接用console.log可以正常输出结果，说明库是可用的：

exifr.parse(bottlefullurl, {xmp: true, tiff:false})
    .then(output => console.log(output.CreateDate));

解决方法 #

因为exifr.parse是异步操作，它不会立刻返回结果，后续代码会先执行。所以必须把需要用到异步结果的赋值操作放到then的回调函数中，确保只有当EXIF数据读取完成后才执行赋值。如果你还不熟悉箭头函数，可以换成普通函数写法：

exifr.parse(bottlefullurl, {xmp: true, tiff: false})
  .then(function(output) {
    // 异步操作完成后再给标记赋值
    jmarker.jmarkerdatedata = output.CreateDate;
    // 标记的其他后续操作也需要放在这个回调里，比如渲染标记等
  });

这样修改后，只有当图片的创建日期读取完成，才会把值绑定到地图标记的jmarkerdatedata属性上，就不会出现undefined的问题了。

内容的提问来源于stack exchange，提问作者Cmeet