Обновлено: используя BrowserWindow
.
Какой самый простой/лучший способ запускать команды javascript на веб-странице одну за другой? (асинхронно, не синхронно)
Например, несколько document.write
вызваны событием keypress
.
document.write("line 1");
wait_for_key_press();
document.write("line 2");
wait_for_key_press();
document.write("line 3");
wait_for_key_press();
document.write("line 4");
...
function wait_for_key_press(){
...
}
Если они синхронны, это происходит автоматически — они по своей сути будут запускаться один за другим. Я не уверен, что понимаю вопрос.
"один за другим ?" подразумевает, что вы хотите асинхронный
вы должны дождаться звонка wait_for_key_press
извините, отредактировал, я имел в виду обратное :P
@bobdylan код должен быть в этом формате? Об использовании Promise
не может быть и речи? например: do1(); wait().then(() => {do2(); do3();});
Это возможно с синтаксисом асинхронно / жду. Чтобы дождаться нажатия клавиши, добавьте прослушиватель событий к событию keypress
. В этом примере строка 2 печатается, когда пользователь нажимает клавишу ввода.
async function myProgram() {
console.info('line 1')
await myAsyncFunction();
console.info('line 2');
}
myProgram();
async function myAsyncFunction(){
return new Promise((resolve) => {
document.addEventListener('keypress', function _listener(event) {
if (event.keyCode === 13) {
document.removeEventListener('keypress', _listener);
resolve();
}
});
});
}
На самом деле мне нужно, чтобы каждая строка запускалась нажатием клавиши (отредактированный исходный пост)
Самый простой способ дождаться действия перед запуском кода — использовать промисы или прослушиватели событий (или и то, и другое). Например:
var resolves = [];
document.querySelector("#start").addEventListener("click", doActions);
document.querySelector("#stop-wait").addEventListener("click", function() {
resolves.forEach(function(resolve) {
resolve();
});
resolves = [];
});
function waitButtonClick() {
return new Promise(function(resolve) {
resolves.push(resolve);
});
}
function doActions() {
console.info("Step 1");
waitButtonClick().then(function() {
console.info("Step 2");
});
}
<button id = "start">Start Actions</button>
<button id = "stop-wait">Stop waiting</button>
То же самое можно сделать с помощью await
и async
:
var resolves = [];
document.querySelector("#start").addEventListener("click", doActions);
document.querySelector("#stop-wait").addEventListener("click", function() {
resolves.forEach(function(resolve) {
resolve();
});
resolves = [];
});
function waitButtonClick() {
return new Promise(function(resolve) {
resolves.push(resolve);
});
}
async function doActions() {
console.info("Step 1");
await waitButtonClick();
console.info("Step 2");
}
<button id = "start">Start Actions</button>
<button id = "stop-wait">Stop waiting</button>
Promise
, async
и await
реализованы только в современных браузерах и узлах (что должно подойти в вашем случае, поскольку вы используете электрон). Если вы также хотите поддерживать IE, вы можете создать собственный полифилл Promise
:
if (typeof window["Promise"] !== "function") {
window["Promise"] = function(callBack) {
var catchList = [];
var thenList = [];
this.then = function(callBack) {
if (typeof callBack === "function") thenList.push(callBack);
return this;
};
this.catch = function(callBack) {
if (typeof callBack === "function") catchList.push(callBack);
return this;
};
function resolve(result) {
thenList.forEach(function(callBack) {
callBack(result);
});
};
function reject(error) {
catchList.forEach(function(callBack) {
callBack(error);
});
};
callBack(resolve, reject);
};
}
Удивительно, я смог адаптировать вариант с ожиданием/асинхронностью. Спасибо !
Рад, что смог помочь @bobdylan. Я также только что обновил свой ответ, включив в него то, что вам следует делать, если вам нужно реализовать что-то подобное в IE или других старых браузерах.
@bobdylan Я думаю, вам также следует взглянуть на этот вопрос относительно забытых обещаний.
попробуй оповещение или приглашение