3

Дамы и Господа, возник вопрос, можно ли на JS создавать звуки? Помню в детстве, я писал код на basic-ке, когда еще IBM 386 или IBM 486, был мечтой мечтой моего поколения)))).... Так вот в basic был оператор BEEP. Вопрос: есть ли некий аналог данного оператора на JS?

4
  • О 80386 и 80486, классика.
    – user262779
    31 янв 2018 в 14:17
  • ДА-ДА_ДА....))))
    – Air
    31 янв 2018 в 14:18
  • Да, как время летит быстро, еще вчера 80386 был мечтой, а тут уже квантовые процессоры тестируют.
    – user262779
    31 янв 2018 в 14:28
  • Боюсь представить, возможности))))
    – Air
    31 янв 2018 в 14:35

3 ответа 3

7

Я вижу два варианта

  1. Добавить тег <audio>
  2. Воспользоваться Web Audio API

Первый вариант позволит вопроизводить заранее записанные треки. Второй также позволит генерировать звуки.

Пример из MDN:

// создаем аудио контекст
var audioCtx = new(window.AudioContext || window.webkitAudioContext)();

// создаем OscillatorNode - генератор
var oscillator = audioCtx.createOscillator();

oscillator.type = 'square';
// задаем частоту в герцах
oscillator.frequency.setValueAtTime(440, audioCtx.currentTime);
oscillator.connect(audioCtx.destination);

// запускаем пищалку
oscillator.start();
// говорим "горшочек не вари" через 300 мс
setTimeout(e => oscillator.stop(), 300);

См. также:

  1. Making Music in the Browser – Web Audio API, Part 1 (по-английски)
  2. Violent Theremin demo (демо)
  3. OscillatorNode (по-английски)
7
  • tutankhamun, искал, не нашел, будь другом или ссылку или кусок кода
    – Air
    31 янв 2018 в 14:20
  • не воспроизводить, а именно создавать
    – Air
    31 янв 2018 в 14:21
  • Тогда первый вариант не подойдет. 31 янв 2018 в 14:32
  • Подойдет, просто тогда создавать на базе существущих файлов.
    – nick_n_a
    31 янв 2018 в 14:34
  • tutankhamun, не беда, а что на счет 2-го варианта?
    – Air
    31 янв 2018 в 14:34
1

Даже трудно сказать, работал ли пример, который я хочу предложить 2 года назад, когда был задан этот вопрос, в общем, простой пример аналога функции beep() на basic с параметрами частоты звука в герцах и длительности в секундах с применением WebAudio Api:

function beep(f, d) { // частота в герцах, длительность в секундах
  var ctx = new AudioContext();
  var oscillator = ctx.createOscillator();
  oscillator.frequency.value = f;
  oscillator.connect(ctx.destination);
  oscillator.start();
  oscillator.stop(d);
}
<button onclick="beep(1000, 0.5)"> старт </button>

Правда, если вопрос подразумевает аналог функции beep() на basic, написанный на чистом JS, то возможно лучше исключить WebAudio Api. Чуть больше кода, зато на чистом JS:

function beep(f, d) {
  var volume = 10000,
    u1 = -volume,
    u2 = volume,
    u = u1,
    samples = [],
    titlestring = decodeURIComponent(escape(window.atob("UklGRgAAAABXQVZFZm10IBAAAAABAAIARMKsAAAQwrECAAQAEABkYXRh"))),
    title = [];
  for (i = 0; i < titlestring.length; i++) title[i] = titlestring.charCodeAt(i);
  for (i = 0; i < d * 44100; i++) {
    u += f;
    if (u > u2) u = u1;
    samples[i] = u;
  }
  var outbuffer = new Int16Array(title.length / 2 + samples.length * 2);
  for (i = 0; i < title.length; i += 2) outbuffer[i / 2] = title[i] + title[i + 1] * 256;
  for (i = 0; i < samples.length * 2; i++) outbuffer[i * 2 + 44] = outbuffer[i * 2 + 45] = samples[i];
  var audio = new Audio(URL.createObjectURL(new Blob([outbuffer])));
  audio.play();
}
<button onclick="beep(435, 0.5)"> старт </button>

Кто-то даже спросил, можно ли на PHP напиcать аналог beep() на basic :) В таком случае не полхо бы, чтобы каждый современный язык её включал. Плюс ещё бы реанимировать особенность старых текстовых редакторов, когда в тексте встречался служебный символ с кодом 7, это вызывало beep() во время отображения текста.

1
  • Пример работал и по сей день работает
    – Air
    7 апр 2020 в 18:41
-1

И так:

<audio id="beep" src="https://www.soundjay.com/button/beep-01a.wav" 
       autostart="false" >
</audio>

<a onclick="playSound();">Click me to hear a beep</a>

<script>
    function playSound() {
          var sound = document.getElementById("beep");
          sound.play();
     }
</script>

0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.