如何限制1秒内被调用50次的playSound函数仅执行一次

解决方案 #

核心思路是通过节流或防抖逻辑限制播放函数的执行频率，避免短时间重复触发。你可以根据实际业务需求选以下任意一种实现：

方案1：节流（1秒内最多播放1次，首次触发立即执行） #

适合收到第一笔订单就立刻提醒，后续1秒内的新订单不重复触发的场景：

let lastPlayTime = 0;
// 提前初始化音频实例复用，减少资源消耗
const notificationAudio = new Audio('/audio/short_notification.mp3');

function playSound() {
    const currentTime = Date.now();
    // 距离上次播放不足1秒直接跳过
    if (currentTime - lastPlayTime < 1000) return;
    lastPlayTime = currentTime;
    // 重置播放进度，避免上一次播放未结束导致无声音
    notificationAudio.currentTime = 0;
    notificationAudio.play();
}

方案2：防抖（1秒内多次触发，只在最后一次触发后延迟1秒播放） #

适合希望所有短时间内到账的订单全部推送完成后，只播放一次提醒的场景：

let debounceTimer = null;
const notificationAudio = new Audio('/audio/short_notification.mp3');

function playSound() {
    // 每次调用清空之前的计时
    clearTimeout(debounceTimer);
    debounceTimer = setTimeout(() => {
        notificationAudio.currentTime = 0;
        notificationAudio.play();
    }, 1000);
}

内容的提问来源于stack exchange，提问作者Naser Nikzad