Pause: примеры (JAVASCRIPT)

Примеры использования функции pause

Базовая реализация функции:

function pause(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

Пример задержки перед выполнением действия:

async function example() {
    console.log('Начало');
    await pause(2000); // Пауза 2 секунды
    console.log('Прошло 2 секунды');
}
example();

// Результат (с задержкой):
// Начало
// (пауза 2 секунды)
// Прошло 2 секунды

Использование в цепочке промисов:

function pause(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

pause(1000)
    .then(() => console.log('1 секунда прошла'))
    .then(() => pause(500))
    .then(() => console.log('Еще 0.5 секунды'));

// Результат (с задержками):
// 1 секунда прошла
// (пауза 0.5 секунды)
// Еще 0.5 секунды

Похожие механизмы в JavaScript

• setTimeout: Основная функция для отложенного выполнения кода. Не возвращает промис, что усложняет интеграцию в современный асинхронный код. Позволяет отменить таймер с помощью clearTimeout.
• setInterval: Выполняет функцию повторно с заданным интервалом. Используется для периодических действий, а не единичной паузы.
• requestAnimationFrame: Синхронизирует выполнение функции с частотой обновления кадров браузера. Применяется для плавной анимации, а не для создания произвольных задержек.
• Паттерн «Throttling/Debouncing»: Библиотеки (например, Lodash) предоставляют функции для ограничения частоты вызовов, что является более специализированным случаем управления временем выполнения.

Когда что использовать: pause (на основе промиса) удобна в асинхронных функциях для линейной записи кода с задержками. setTimeout подходит для простых отложенных действий без использования async/await. requestAnimationFrame оптимален для анимации.

Альтернативы в других языках

Python: Модуль time предоставляет синхронную функцию sleep, которая блокирует текущий поток.

import time
print("Начало")
time.sleep(2)  # Блокировка на 2 секунды
print("Прошло 2 секунды")

# Результат аналогичен, но поток блокируется.

PHP: Функция sleep (секунды) и usleep (микросекунды) также блокируют выполнение скрипта.

echo "Начало\n";
sleep(2); // Задержка 2 секунды
usleep(500000); // Задержка 0.5 секунды
echo "Прошло время\n";

C (стандартная библиотека): Функция sleep (из unistd.h) приостанавливает выполнение процесса на указанное количество секунд.

#include <unistd.h>
#include <stdio.h>
int main() {
    printf("Start\n");
    sleep(2); // Задержка 2 секунды
    printf("End\n");
    return 0;
}

MySQL: Функция SLEEP(seconds) приостанавливает выполнение запроса на заданное количество секунд.

SELECT SLEEP(2); -- Запрос выполнится примерно за 2 секунды

Основное отличие: В JavaScript браузерного окружения блокировка главного потока недопустима, поэтому используются асинхронные подходы с промисами. В серверных языках (Python, PHP, C) часто используются синхронные блокирующие вызовы, что проще, но может влиять на производительность.

Типичные ошибки

1. Попытка использовать pause как синхронную функцию без await или then.

function pause(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

console.log('До паузы');
pause(1000); // Ошибка: пауза не будет ожидаться
console.log('После паузы'); // Выполнится сразу

// Результат:
// До паузы
// После паузы
// (пауза не сработала как ожидалось)

2. Использование отрицательного или нечислового значения времени.

async function test() {
    await pause(-1000); // Таймер сработает немедленно
    await pause('две секунды'); // Преобразуется в NaN, задержка 0мс
}
// Ошибки не возникнет, но поведение будет неочевидным.

3. Создание большого количества микротасков через цикл без осторожности.

async function rapidPauses() {
    for (let i = 0; i < 10000; i++) {
        await pause(0); // Каждая итерация создает таймер
    }
    // Это может привести к нагрузке на планировщик.
}

История изменений

Концепция функции pause не является частью стандарта ECMAScript, поэтому изменения касаются лишь способов ее реализации в контексте развития языка.

• До появления Promise (ES6/ES2015) задержки реализовывали через callback-функции в setTimeout, что приводило к «аду callback-ов».
• С введением async/await (ES8/ES2017) использование промис-ориентированной pause стало значительно удобнее, позволив писать линейный код с паузами.
• Современные предложения для JavaScript (например, Temporal API) не вводят синхронную функцию сна, так как это противоречит асинхронной модели браузера.

Расширенные примеры

Последовательные паузы в цикле:

async function countdown() {
    for (let i = 5; i > 0; i--) {
        console.log(i);
        await pause(1000);
    }
    console.log('Старт!');
}
countdown();

// Результат (с интервалом 1 секунда):
// 5
// 4
// 3
// 2
// 1
// Старт!

Использование в асинхронной обработке массива с задержками:

async function processItems(items) {
    for (const item of items) {
        console.log(`Обработка: ${item}`);
        await pause(300); // Задержка между обработкой элементов
        // Имитация асинхронной операции
        console.log(`Готово: ${item}`);
    }
}
processItems(['A', 'B', 'C']);

// Результат (с паузами 0.3 секунды):
// Обработка: A
// Готово: A
// Обработка: B
// Готово: B
// Обработка: C
// Готово: C

Комбинирование с Promise.race для таймаута:

async function withTimeout(promise, ms) {
    const timeoutPause = pause(ms).then(() => {
        throw new Error('Таймаут операции');
    });
    return Promise.race([promise, timeoutPause]);
}

// Пример использования
async function longOperation() {
    await pause(5000); // Имитация долгой операции
    return 'Результат';
}

try {
    const result = await withTimeout(longOperation(), 2000);
    console.log(result);
} catch (e) {
    console.error(e.message); // Таймаут операции
}

Пауза в методах класса:

class Robot {
    async walk(steps) {
        for (let i = 0; i < steps; i++) {
            console.log(`Шаг ${i + 1}`);
            await pause(500);
        }
    }
}

const robot = new Robot();
robot.walk(3);

// Результат (с интервалом 0.5 секунды):
// Шаг 1
// Шаг 2
// Шаг 3