使用“调试器”时，如何在 chrome 开发工具控制台中获得承诺的结果？答案

【问题标题】：How to get at the result of a promise in chrome dev tools console when "debugger" is used?使用“调试器”时，如何在 chrome 开发工具控制台中获得承诺的结果？
【发布时间】：2020-12-12 09:55:14
【问题描述】：

这样的事情会导致调试器控制台中的 Promise 挂起。如果您删除调试器或等到第二个console.log，您会得到一个结果，您可以在日志中单击打开。

<script>
import { Table } from 'apache-arrow';

async function loadData(dataUrl){
  const response = await fetch(dataUrl);
  return await response.arrayBuffer();
}

      console.log('loading data')
      let dataUrl = "https://raw.githubusercontent.com/RandomFractals/ChicagoCrimes/master/data/chicago-crimes-2017.arrow"
      let crimes = loadData(dataUrl).then(buffer => {return Table.from(new Uint8Array(buffer))})
      console.log(crimes)
      debugger
      console.log(crimes)
</script>

如何在调试器中解决未来问题并获取 REPL/控制台中的数据？

【问题讨论】：

你需要继续执行才能让承诺得到兑现。除了等待之外别无他法。

标签： javascript asynchronous promise google-chrome-devtools javascript-debugger

【解决方案1】：

您无法解决未来，但您可以在数据生成后立即掌握：

import { Table } from 'apache-arrow';

async function loadData(dataUrl) {
    const response = await fetch(dataUrl);
    return await response.arrayBuffer();
}

console.log('loading data');
let dataUrl =
    'https://raw.githubusercontent.com/RandomFractals/ChicagoCrimes/master/data/chicago-crimes-2017.arrow';
let crimes = loadData(dataUrl)
    .then((buffer) => {
        return Table.from(new Uint8Array(buffer));
    })
    .then((tab) => {
        console.log(tab);
        return tab;
    });
</script>

这种方法的优点是您可以通过删除第二个then 来摆脱控制台消息。

【讨论】：