js-sllep(ms)

Question

przez jakiś czas używałem kodu funkcji sllep w moim skrypcie i przez jakiś czas on "działał" dopuki w funkcji nie zwiększyłem czasu. Wtedy zobaczyłem że funkcja tak jak piszą na tej stronie nie zatrzymuje na chwilę jednej operacji tylko zatrzymuje działanie całego skryptu. Teraz mam problem. Skrypt by działał gdyby funkcja sleep działała. I takie pytanie. Da się napisać działającą komendę w js która nie zatrzymuje działania całej strony tylko działa element po elemencie? Próbowałem już funkcji z tej strony ale nic nie wychodziło.

moja wcześniejsza funkcja:

function sleep(ms) {
        var d = new Date();
        var d2 = null;
        do { d2 = new Date(); }
        while(d2-d < ms);
    }

i kod przy którym to powinno działać, ale nie działa.

console.log("wykonane od razu");
sleep(1000);
console.log("wykonane po 2000ms razem z kolejnym logiem");
sleep(1000);
console.log("wykonane po 2000ms");

Comments

W jakim celu chcesz zatrzymać skrypt na stronie? Rozwiązanie z pętlą jest trochę wbrew naturze JavaScript. Poczytaj o asynchroniczności. Dla lepszego zobrazowania tematu warto obejrzeć tą prezentację.

przez jakiś czas on "działał" dopuki w funkcji nie zwiększyłem czasu

A co konkretnie złego się dzieje? Może w konsoli są jakieś błędy? 

---

"działał" czyli że zatrzymywał funkcję-znaczy tak myślałem i dlatego to działał w cudzysłowie.

Answer 1

Jakby jeszcze ktoś chciał powrócić do tego pytania to to rozwiązałem w ten sposób:

jest jedna funkcja sllep:

function sleep( time ) {
    return new Promise( ( resolve ) => {
        return setTimeout( resolve, time );
    } );
}

i każdą osobną funkcję przerobiłem na funkcję asychroniczną. Jeśli się wywoła funkcję asynchroniczną z funkcji asynchronicznej to nie powodują one błędu. Czyli 

( async function() {/*jshint ignore:line */
    opsp();//inna funkcja anynchroniczna-jej załączenie nie zakłuca działania tej funkcji
    document.querySelector("#haySlider > ol > li:nth-child(21)").click();
    var owd=document.querySelector("#oatsSlider > ol > li:nth-child(16) > span");
    if (owd!==null) {owd.click();}
    await sleep(10);/*jshint ignore:line */
    document.querySelector("#feed-button > span > span > span").click();
    }() );/*jshint ignore:line */

Czyli po prostu ten kod:

/* jshint ignore:start */ 
    async function sleep(as) { 
        await sleep_o( as ); 
    }; 
    /* jshint ignore:end */

Znaczy to samo co to:

    async function sleep(as) { /*jshint ignore:line */
        await sleep_o( as ); /*jshint ignore:line */
    }; /*jshint ignore:line */

tylko że jest bardziej przejrzyste. Jeszcze dlaczego mi tampermonkey wyrzucał błąd. Jshint jeszcze nie jest przystosowany do obsługiwania komend async i await gdyż są one w standardzie ECMAScript6 który nie jest jeszcze w pełni obsługiwany przez js-hint-a który jest domyślny dla sprawdzania tekstu w tampermonkey.To samo jest po zainstalowaniu js-hint-a i skonfigurowaniu go do obsługi ECMAScript6 w Sublime Text.

Answer 2

Najlepiej przejść na asynchroniczność i zrobić ze sleep funkcję zwracającą obiecankę z setTimeout. W połączeniu ze składnią funkcji asynchronicznych powstanie nawet znośne rozwiązanie. PoC: https://jsfiddle.net/Comandeer/f2vhg3gj/

Comments

Tylko że używając tej funkcji w miejsce każdego mojego wcześniejszego wystąpienia muszę wstawiać całą asynchroniczną funkcję. Normalnie w przeglądarce działa ale gdy piszę skrypt w tampermonkey to ta funkcja wogóle nie chce działać. Tak jakby mi pomijała async i await

---

gdy piszę skrypt w tampermonkey to ta funkcja wogóle nie chce działać

Jakieś błędy w konsoli? 

---

błędów w konsoli brak ale w tampermonkey są. To mogę zignorować dając kod w "   

/* jshint ignore:start */
    async function sleep(as) {
        await sleep_o( as );
    };
    /* jshint ignore:end */

"

ale to tylko ignoruje składnie. I nadal nie działa tak jak powinno

---

Hm, prawdę mówiąc nie wiem, jak to działa w Tampermonkey.