feat: connect method

docs/index.html

@@ -336,6 +336,41 @@ <h4>AudioNode</h4>
               ファクトリメソッドを, サポートするブラウザが限定的であれば, コンストラクタ呼び出しを使うのが現実解と言えるでしょう.
             </p>
           </section>
+          <section>
+            <h4>connect メソッド (AudioNode の接続)</h4>
+            <p>
+              現実世界の音響機器では, 入力と出力, あるいは, 音響変化も接続することで, その機能を果たします. 例えば, エレキギターであれば,
+              サウンド入力を担うギターとサウンド出力を担うアンプ (厳密にはスピーカー) は, 単体ではその機能を果たしません.
+              シールド線などで接続することによって機能します.
+            </p>
+            <p>
+              このことは, Web Audio API の世界も同じです. (<code>AudioContext</code> インスタンスを生成して,) サウンド入力点となる
+              <code>AudioNode</code> のサブクラスのインスタンス (先ほどのコード例だと, <code>OscillatorNode</code> インスタンス) と, サウンド出力点となる
+              <code>AudioDestinationNode</code> インスタンスを生成しただけではその機能を果たしません. 少なくとも,
+              サウンド入力点と出力点を接続する処理が必要となります. さらに, Web Audio API が定義する様々なノードと接続することで, 高度なオーディオ処理を実現する
+              API として真価を発揮します.
+            </p>
+            <p>
+              Web Audio API のアーキテクチャは, 現実世界における音響機器のアーキテクチャと似ています. このことは, Web Audio API
+              の理解を進めていくとなんとなく実感できるようになると思います.
+            </p>
+            <p>
+              Web Audio APIにおいて「接続」の役割を担うのが, <code>AudioNode</code> がもつ <b><code>connect</code> メソッド</b>です. 実装としては,
+              <code>AudioNode</code> サブクラスのインスタンスの, connect メソッドを呼び出します. このメソッドの第 1 引数には, 接続先となる
+              <code>AudioNode</code> のサブクラスのインスタンスを指定します.
+            </p>
+            <pre
+              data-prismjs-copy="クリップボードにコピー"
+              data-prismjs-copy-success="コピーしました"
+            ><code class="language-js line-numbers">// Autoplay Policy は解除されている状態
+
+const context = new AudioContext();
+
+const oscillator = context.createOscillator();
+
+// OscillatorNode (Input) -&gt; AudioDestinationNode (Output)
+oscillator.connect(context.destination);</code></pre>
+          </section>
         </section>
       </section>
     </main>