Revision 948839 of OscillatorNode

<p>{{APIRef("Web Audio API")}}</p>

<p>The&nbsp;<strong><code>OscillatorNode</code></strong>&nbsp;interface represents a periodic waveform, like a sine wave. It is an {{domxref("AudioNode")}} audio-processing module that causes a given&nbsp;frequency&nbsp;of sine wave to be created — in effect, a constant tone.</p>

<p>An <code>OscillatorNode</code> is created using the {{domxref("AudioContext.createOscillator")}} method. It always has exactly one output and no inputs, both with the same amount of channels. Its basic property defaults (see {{domxref("AudioNode")}} for definitions) are:</p>

<table class="properties">
 <tbody>
  <tr>
   <th scope="row">Number of inputs</th>
   <td><code>0</code></td>
  </tr>
  <tr>
   <th scope="row">Number of outputs</th>
   <td><code>1</code></td>
  </tr>
  <tr>
   <th scope="row">Channel count mode</th>
   <td><code>max</code></td>
  </tr>
  <tr>
   <th scope="row">Channel count</th>
   <td><code>2</code> (not used in the default count mode)</td>
  </tr>
  <tr>
   <th scope="row">Channel interpretation</th>
   <td><code>speakers</code></td>
  </tr>
 </tbody>
</table>

<h2 id="Properties">Properties</h2>

<p><em>Inherits properties from its parent,&nbsp;</em><em>{{domxref("AudioNode")}}</em>.</p>

<dl>
 <dt>{{domxref("OscillatorNode.frequency")}}</dt>
 <dd>An <a href="/en-US/docs/Web/API/AudioParam#a-rate">a-rate</a> {{domxref("AudioParam")}} representing the frequency of oscillation in hertz (though the&nbsp;<code style="font-size: 14px;">AudioParam</code>&nbsp;returned is read-only, the value it represents is not.)</dd>
</dl>

<dl>
 <dt>{{domxref("OscillatorNode.detune")}}</dt>
 <dd>An <a href="/en-US/docs/Web/API/AudioParam#a-rate">a-rate</a> {{domxref("AudioParam")}} representing detuning of oscillation in cents (though the&nbsp;<code style="font-size: 14px;">AudioParam</code>&nbsp;returned is read-only, the value it represents is not.)</dd>
</dl>

<dl>
 <dt>{{domxref("OscillatorNode.type")}}</dt>
 <dd>Represents the shape of the oscillator wave generated. Different waves will produce different tones.</dd>
</dl>

<h2 id="Methods">Methods</h2>

<p><em>Inherits methods from its parent,&nbsp;</em><em>{{domxref("AudioNode")}}</em>.</p>

<dl>
 <dt>{{domxref("OscillatorNode.start()")}}</dt>
 <dd>This method specifies the exact time to start playing the tone.</dd>
 <dt>{{domxref("OscillatorNode.stop()")}}</dt>
 <dd>This method specifies the exact time to stop playing the tone.</dd>
 <dt>{{domxref("OscillatorNode.setPeriodicWave()")}}</dt>
 <dd>Used to point to a {{domxref("PeriodicWave")}} defining a periodic waveform that can be used to shape the oscillator's output, when <code>type = "custom"</code> is used. This replaces the now-obsolete {{domxref("OscillatorNode.setWaveTable")}}.</dd>
</dl>

<h2 id="Event_handlers">Event handlers</h2>

<dl>
 <dt>{{domxref("OscillatorNode.onended")}}</dt>
 <dd>Used to set the event handler for the <code>ended</code> event, which fires when the tone has stopped playing.</dd>
</dl>

<h2 id="Examples">Examples</h2>

<p>The following example shows basic usage of an {{ domxref("AudioContext") }} to create an oscillator node. For an applied example, check out our <a href="https://mdn.github.io/violent-theremin/">Violent Theremin demo</a> (<a href="https://github.com/mdn/violent-theremin/blob/gh-pages/scripts/app.js">see app.js</a> for relevant code).</p>

<pre class="brush: js">
// create web audio api context
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();

// create Oscillator node
var oscillator = audioCtx.createOscillator();

oscillator.type = 'square';
oscillator.frequency.value = 3000; // value in hertz
oscillator.start();</pre>

<h2 id="Specifications">Specifications</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('Web Audio API', '#the-oscillatornode-interface', 'OscillatorNode')}}</td>
   <td>{{Spec2('Web Audio API')}}</td>
   <td>&nbsp;</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility">Browser compatibility</h2>

<div>{{CompatibilityTable}}</div>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>14 {{property_prefix("webkit")}}</td>
   <td>23</td>
   <td>{{CompatNo}}</td>
   <td>15&nbsp;{{property_prefix("webkit")}}<br />
    22 (unprefixed)</td>
   <td>6 {{property_prefix("webkit")}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Chrome</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>Firefox OS</th>
   <th>IE Phone</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatNo}}</td>
   <td>28&nbsp;{{property_prefix("webkit")}}</td>
   <td>25</td>
   <td>1.2</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>6&nbsp;{{property_prefix("webkit")}}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="See_also">See also</h2>

<ul>
 <li><a href="/en-US/docs/Web_Audio_API/Using_Web_Audio_API">Using the Web Audio API</a></li>
</ul>