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 оптимален для анимации.

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

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

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

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) часто используются синхронные блокирующие вызовы, что проще, но может влиять на производительность.