Question

我想写一个readKey函数async，然后await在浏览器中按下每个键。

我想将其构建为基于async - await的同步，看似正常的代码。

那么我可以写一个readLine函数执行await readKey()直到用户点击[enter]，并删除最后一个键，如果用户点击[返回]等等。

然后我可以编写await readLine()的函数，并编写调用它们的函数等等。

我只是不知道如何弥合编写document.onkeypress处理程序之间的差距......并将该事件中的密钥放入我编写的某个async readKey函数中。在其他语言中，我可以使用其他多线程原语来实现，但我无法弄清楚如何在js中。我试图找出是否有某种方式来yield这个值，但我也看不出怎么做。

Answer 1

是。让我们分解一下：

是否有可能等待自定义事物？

是的 - 您可以等待任何Promise。例如，等待超时：

const timerPromise = new Promise(resolve => setTimeout(resolve, 1000));
await timerPromise;

是否可以承诺按键？

是 - 在事件发生时解决承诺。

function readKey() {
    return new Promise(resolve => {
        window.addEventListener('keypress', resolve, {once:true});
    });
}

Answer 2

感谢@Kornel和@ Xotic750，这就是我要找的东西：

const readKey = () => new Promise(resolve => window.addEventListener('keypress', resolve, { once: true }));

(async function() {
  console.log('Press a key');
  const x = await readKey();
  console.log('Pressed', String.fromCharCode(x.which));

  console.log('Press a key');
  const y = await readKey();
  console.log('Pressed', String.fromCharCode(y.which));
}());

Answer 3

这将等到元素上的按键事件发生

await new Promise(r=>element.addEventListener('keypress', r));

或者一个等待任何类型事件的函数，看起来像这样

waitForEvent = (element, type) => new Promise(r=>element.addEventListener(type,r));

然后我们可以做类似的事情

await waitForEvent(document, "load");
// or 
await waitForEvent(element, "keypress");

有没有办法写异步等待响应onkeypress事件的代码？

3 个答案: