Примечание. Использование setTimeout и setInterval

внешний интерфейс GitHub опрос

setTimeout и setInterval

Использование setTimeout

setTimeout(cb, time);

setTimeout передает два параметра.Первый параметр cb, который представляет функцию обратного вызова, а второй представляет время, которое рассчитывается в мс.

Использование setInterval

setInterval(cb, time);

setInterval также передает два параметра.Первый параметр — cb, который представляет обратный вызов функции обратного вызова, а второй представляет время, которое рассчитывается в мс.

Различия и точки внимания между setTimeout и setInterval

разница

setTimeout означает таймер, который срабатывает один раз в определенное время, а setInterval означает таймер, который срабатывает один раз в определенное время и будет продолжать срабатывать

преобразование между собой

function run() {
    //其他代码
    setTimeout(function(){
        run();
    }, 10000);
}
setInterval(function(){
    run();
}, 10000);
  • Приведенный выше код все еще отличается:
    Первый кусок кода реализован с помощью setTimeout, у этой реализации есть недостаток, то есть setTimeout добавляет 10 секунд ко времени выполнения кода, например, run() выполняет 100 с, а весь процесс может быть 110 с.
    Вторая часть кода отличается: setInterval — это когда run() работает менее 10 секунд, тогда он вернется через 10 секунд. Если setInterval больше 10 секунд, мы подробно объясним это позже.

Вы действительно понимаете ———— setInterval

setInterval(function(){
    // ...
}, 100)

Рассмотрим три ситуации

  • Первый, когда время выполнения меньше 100 мс

小于100ms
менее 100 мс

  • Когда секунда больше 100 мс, например 150 мс, она находится во втором цикле.
    При выполнении он сразу же сработает во второй раз

100ms～200ms之间
Между 100 мс и 200 мс

  • Затем давайте рассмотрим третий случай, например, 500 мс, что намного больше, чем 100 мс.
    На самом деле, по механизму setInterval он отбросит то, что происходит посередине, это мы можем понять, взглянув на график.

远大于100ms
намного больше, чем 100 мс

Вы действительно понимаете - setTimeout

Первая, часто неверная проблема, это в setTimeout

var i = 0;
const o = {
    i: 1;
    fn: function(){
        console.log(this.i);
    }
}
setTimeout(o.fn, 1000); //0

Здесь видно, что если он вызывается объектом o, он будет равен 1, но выводит 0 по двум причинам:
1.setTimeout работает в глобальной среде
2. На самом деле он сделал следующие шаги:

var a = o.fn;
a();
//只有这样，this才会被绑定到全局上去

Во-вторых, что еще может сделать setTimeout?

На самом деле нет, давайте сначала рассмотрим вопросы, которые часто задают в интервью setTimeout.

setTimeout(function(){
    console.log(1);
},0);
console.log(2);

На самом деле, эта функция — длинная история, сначала выводится 2, а затем 1, потому что setTimeout поместит первую функцию в очередь задач, а затем пройдет через цикл событий, поэтому сначала выведет 2, а затем выведет 1.

Итак, давайте представим, что мы можем сделать с этой функцией? Когда событие всплывает, при нормальных обстоятельствах сначала срабатывает дочерний элемент, а затем срабатывает родительский элемент, поэтому мы можем использовать эту функцию, чтобы сначала срабатывал родительский элемент, а затем срабатывал дочерний элемент ( сабж не пробовал )

Примечание:
Если вы считаете, что текст хороший, проведите пальцем, чтобы поставить лайк, если вы хотите подписаться на меня, вы можете перейти к следующемуgithubСтавьте палец вверх, я буду настаивать на выходе, отдайте дань уважения товарищам, которые работают вместе 🙏

Знание приходит из сети, а практика производит истинное знание.Если есть какое-то сходство, оно будет захвачено и удалено.

Категории