recursal/MDN huggingface dataset:
MessageEvent: source プロパティ
==========================

**`source`** は `MessageEvent` インターフェイスの読み取り専用プロパティで、メッセージ送信者を表す `MessageEventSource` （WindowProxy, `MessagePort`, `ServiceWorker` オブジェクトのいずれか）です。

値
-

メッセージ送信者を表す `MessageEventSource` （WindowProxy, `MessagePort`, `ServiceWorker` オブジェクトのいずれか）です。

例
-


```js
myWorker.onmessage = (e) => {
  result.textContent = e.data;
  console.log("Message received from worker");
  console.log(e.source);
};
```

仕様書
---

| Specification |
| --- |
| HTML Standard # dom-messageevent-source-dev |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* `ExtendableMessageEvent` — このインターフェイスに似ていますが、もっと柔軟性が必要なインターフェイスで使用されます。
MessageEvent: origin プロパティ
==========================

**`origin`** は `MessageEvent` インターフェイスの読み取り専用プロパティで、メッセージ送信元のオリジンを表す文字列です。

値
-

オリジンを表す文字列です。

例
-


```js
myWorker.onmessage = (e) => {
  result.textContent = e.data;
  console.log("Message received from worker");
  console.log(e.origin);
};
```

仕様書
---

| Specification |
| --- |
| HTML Standard # dom-messageevent-origin-dev |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* `ExtendableMessageEvent` — このインターフェイスに似ていますが、もっと柔軟性が必要なインターフェイスで使用されます。
MessageEvent: data プロパティ
========================

**`data`** は `MessageEvent` インターフェイスのプロパティで、このメッセージの送信元が送信するデータを表します。

値
-

このメッセージの送信元が送信するデータです。このイベントの発信元が何であるかによって、あらゆるデータ型になる可能性があります。

例
-


```js
myWorker.onmessage = (e) => {
  result.textContent = e.data;
  console.log("Message received from worker");
};
```

仕様書
---

| Specification |
| --- |
| HTML Standard # dom-messageevent-data-dev |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* `ExtendableMessageEvent` — このインターフェイスに似ていますが、もっと柔軟性が必要なインターフェイスで使用されます。
MessageEvent: ports プロパティ
=========================

**`ports`** は `MessageEvent` インターフェイスの読み取り専用プロパティで、メッセージが（チャネルメッセージングや共有ワーカーにメッセージを送信する場合など、適切な場合に）送信されるチャネルに関連するポートを表す `MessagePort` オブジェクトの配列です。

値
-

`MessagePort` オブジェクトの配列です。

例
-


```js
onconnect = (e) => {
  const port = e.ports[0];

  port.addEventListener("message", (e) => {
    const workerResult = `Result: ${e.data[0] \* e.data[1]}`;
    port.postMessage(workerResult);
  });

  port.start(); // addEventListener を使用した場合は必要。 onmessage セッターからは暗黙に呼び出されます。
};
```

仕様書
---

| Specification |
| --- |
| HTML Standard # dom-messageevent-ports-dev |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* `ExtendableMessageEvent` — このインターフェイスに似ていますが、もっと柔軟性が必要なインターフェイスで使用されます。
MessageEvent: lastEventId プロパティ
===============================

**`lastEventId`** は `MessageEvent` インターフェイスの読み取り専用プロパティで、このイベントの固有の ID を表す文字列です。

値
-

ID を表す文字列です。

例
-


```js
myWorker.onmessage = (e) => {
  result.textContent = e.data;
  console.log("Message received from worker");
  console.log(e.lastEventId);
};
```

仕様書
---

| Specification |
| --- |
| HTML Standard # dom-messageevent-lasteventid-dev |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* `ExtendableMessageEvent` — このインターフェイスに似ていますが、もっと柔軟性が必要なインターフェイスで使用されます。
ScreenOrientation.unlock()
==========================

`ScreenOrientation` インターフェイスの **`unlock()`** プロパティは、含んでいる文書の向きのデフォルトの向きへの固定を解除します。

構文
--


```js
unlock()
```

### 引数

なし

### 返値

なし (`undefined`)

仕様書
---

| Specification |
| --- |
| Screen Orientation # dom-screenorientation-unlock |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
ScreenOrientation.angle
=======================

`ScreenOrientation` インターフェイスの読み取り専用プロパティ **`angle`** は、文書の現在の向きの角度を返します。

値
-

`unsigned short` の整数です。

仕様書
---

| Specification |
| --- |
| Screen Orientation # dom-screenorientation-angle |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
ScreenOrientation.type
======================

`ScreenOrientation` の読み取り専用プロパティ **`type`** は、文書の現在の向きのタイプを返します。`"portrait-primary"`、`"portrait-secondary"`、`"landscape-primary"`、`"landscape-secondary"` のいずれかです。

値
-

`String` です。

仕様書
---

| Specification |
| --- |
| Screen Orientation # dom-screenorientation-type |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
PromiseRejectionEvent.promise
=============================

`PromiseRejectionEvent` インターフェイスの **`promise`** は読み取り専用プロパティで、拒否された JavaScript の `Promise` を表します。プロミスが拒否された理由は、イベントの `PromiseRejectionEvent.reason` プロパティを検査することでわかります。

### 値

拒否されて、処理されていない JavaScript の `Promise` です。

例
-

この例では処理されておらず、 `reason` の `code` 項目が "Module not ready" であるオブジェクトであるプロミスを待ち受けし、正しい実行に失敗するタスクを再実行する何もしないコールバックをセットアップします。

`event.preventDefault()` はプロミスが処理されたことを示すために呼ばれます。


```js
window.onunhandledrejection = (event) => {
  if (event.reason?.code === "Module not ready") {
    requestIdleCallback((deadline) => {
      loadModule(event.reason.moduleName).then(performStartup);
    });
    event.preventDefault();
  }
};
```

仕様書
---

| Specification |
| --- |
| HTML Standard # dom-promiserejectionevent-promise |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* プロミスの拒否イベント
* `Promise`
* `PromiseRejectionEvent`
* `rejectionhandled`
* `unhandledrejection`
PromiseRejectionEvent()
=======================

**`PromiseRejectionEvent()`** コンストラクターは、新しい `PromiseRejectionEvent` オブジェクトを返します。これは、 JavaScript の `Promise` が拒否されたときに発生するイベントを表します。

プロミス拒否イベントにより、失敗したプロミスや、失敗を見逃したプロミスを検出して報告することが可能になります。また、エラーに対するグローバルハンドラーを書くことも容易になります。

`PromiseRejectionEvent` には 2 種類あります。 `unhandledrejection` は、プロミスが拒否されたが処理されなかった場合に JavaScript ランタイムによって発行されます。 `rejectionhandled` イベントは、プロミスが拒否されたが、拒否が拒否ハンドラーによって捕捉された場合に発行されるものです。

構文
--


```js
new PromiseRejectionEvent(type, options)
```

### 引数

`type`

 文字列で、イベントの名前を表します。
 大文字と小文字の区別があり、ブラウザーは `rejectionhandled` または `unhandledrejection` のどちらかに設定します。


`options`

オブジェクトで、 *`Event()` で定義されたプロパティに加え*、以下のプロパティを持つことができます。

`promise`

拒否された `Promise`。

`reason`

プロミスが拒否された理由を表す任意の値または `Object`。これは、エラーコード、エラー文字列、プロミスが拒否された状況を記述する詳細な情報を含むオブジェクトなど、何でもかまいません。


### 返値

引数で指定された通りに構成された、新しい `PromiseRejectionEvent` オブジェクトです。

例
-

この例では、文字列 "My house is on fire" を理由とするプロミス `myPromise` に対して新しい `unhandledrejection` イベントが作成されます。理由`は数字とすることもできますし、家の住所や火事の程度、緊急連絡先の電話番号など、詳細な情報を記載したオブジェクトでも構いません。


```js
let myRejectionEvent = new PromiseRejectionEvent("unhandledrejection", {
  promise: myPromise,
  reason: "My house is on fire",
});
```

仕様書
---

| Specification |
| --- |
| HTML Standard # unhandled-promise-rejections:dom-event-constructor |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* プロミスの使用
* `Promise`
* `PromiseRejectionEvent`
PromiseRejectionEvent.reason
============================

`PromiseRejectionEvent` の **`reason`** は読み取り専用プロパティで、`Promise.reject()` に渡される理由を提供する任意の JavaScript 値、または `Object` です。理論的にはプロミスが拒否された理由についての情報を提供します。

### 値

プロミスが拒否された理由を理解するために使用することができる情報を提供する値またはオブジェクト。これは、エラーコードからテキスト、リンク、その他含めたいものを持つオブジェクトまで、何らかのものにすることができます。

例
-


```js
window.onunhandledrejection = (e) => {
  console.log(e.reason);
};
```

仕様書
---

| Specification |
| --- |
| HTML Standard # dom-promiserejectionevent-reason |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* `Promise`
* `PromiseRejectionEvent`
* `rejectionhandled`
* `unhandledrejection`
USBConnectionEvent()
====================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
**安全なコンテキスト用:** この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

**Experimental:** **これは実験的な機能です。**  
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

**`USBConnectionEvent()`** コンストラクターは、新しい `USBConnectionEvent` オブジェクトを生成します。このコンストラクターは通常使われず、このオブジェクトは USB デバイスの接続や切断に伴ってブラウザーが生成します。

構文
--


```js
new USBConnectionEvent(type, options)
```

### 引数

`type`

イベントの名前を表す文字列です。大文字と小文字は区別され、ブラウザーは `connect` または `disconnect` に設定します。

`options`

オブジェクトで、*`Event()` で定義されたプロパティに加えて* 以下のプロパティを持つことができます。

`device`

接続中または切断中の USB デバイスを表す `USBDevice` です。


### 返値

新しい `USBConnectionEvent` です。

仕様書
---

| Specification |
| --- |
| WebUSB API # dom-usbconnectionevent-usbconnectionevent |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
USBConnectionEvent.device
=========================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
**安全なコンテキスト用:** この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

**Experimental:** **これは実験的な機能です。**  
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

`USBConnectionEvent` インターフェイスの読み取り専用プロパティ **`device`** は、接続中または切断中のデバイスを表す `USBDevice` オブジェクトを返します。

値
-

`USBDevice` オブジェクトです。

例
-

USB デバイスを接続すると、`connect` イベントが発火します。`event.device` を呼び出すと、接続された `USBDevice` が返ります。


```js
navigator.usb.addEventListener("connect", (event) => {
  console.log(event.device);
});
```

仕様書
---

| Specification |
| --- |
| WebUSB API # dom-usbconnectionevent-device |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
WindowClient: focus() メソッド
==========================

**`focus()`** は `WindowClient` インターフェイスのメソッドで、現在のクライアントにユーザー入力フォーカスを与え、既存の `WindowClient` に解決するプロミス (`Promise`) を返します。

構文
--


```js
focus()
```

### 引数

なし。

### 返値

既存の `WindowClient` に解決するプロミス (`Promise`)。

### 例外

`InvalidAccessError` `DOMException`

アプリのオリジンのウィンドウに一時的な有効化が行われていない場合、この例外でプロミスが拒否されます。

セキュリティ要件
--------

* アプリのオリジンの中で少なくとも 1 つのウィンドウで一時的な有効化が行われている必要があります。
例
-


```js
self.addEventListener("notificationclick", (event) => {
  console.log("On notification click: ", event.notification.tag);
  event.notification.close();

  // これは、クライアントが既に開いているかどうかを確認し、
  // 開いている場合にフォーカスを合わせます
  event.waitUntil(
    clients
      .matchAll({
        type: "window",
      })
      .then((clientList) => {
        for (const client of clientList) {
          if (client.url === "/" && "focus" in client) return client.focus();
        }
        if (clients.openWindow) return clients.openWindow("/");
      }),
  );
});
```

仕様書
---

| Specification |
| --- |
| Service Workers # client-focus |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
WindowClient: focused プロパティ
===========================

**`focused`** は `WindowClient` インターフェイスの読み取り専用プロパティで、現在のクライアントにフォーカスがあるかどうかを示す論理値です。

### 値

論理値です。

例
-


```js
self.addEventListener("notificationclick", (event) => {
  console.log("On notification click: ", event.notification.tag);
  event.notification.close();

  // これは、クライアントが既に開いているかどうかを確認し、
  // 開いている場合にフォーカスを合わせます
  event.waitUntil(
    clients
      .matchAll({
        type: "window",
      })
      .then((clientList) => {
        for (const client of clientList) {
          if (client.url === "/" && "focus" in client) {
            if (!client.focused) return client.focus();
          }
        }

        if (clients.openWindow) return clients.openWindow("/");
      }),
  );
});
```

仕様書
---

| Specification |
| --- |
| Service Workers # client-focused |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
WindowClient: visibilityState プロパティ
===================================

**`visibilityState`** は `WindowClient` インターフェイスの読み取り専用プロパティで、現在のクライアントの可視性を示します。 この値は、`"hidden"`、`"visible"`、`"prerender"` のいずれかです。

値
-

文字列です（値については `Document.visibilityState` を参照）。

例
-


```js
event.waitUntil(
  clients
    .matchAll({
      type: "window",
    })
    .then((clientList) => {
      for (const client of clientList) {
        if (client.url === "/" && "focus" in client) {
          if (client.visibilityState === "hidden") return client.focus();
        }
      }
      if (clients.openWindow) {
        return clients.openWindow("/");
      }
    }),
);
```

仕様書
---

| Specification |
| --- |
| Service Workers # client-visibilitystate |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
WindowClient: navigate() メソッド
=============================

**`navigate()`** は `WindowClient` インターフェイスのメソッドで、指定された URL を制御されたクライアントのページに読み込んでから、既存の `WindowClient` に解決されるプロミス (`Promise`) を返します。

構文
--


```js
navigate(url)
```

### 引数

`url`

移動先の場所。

### 返値

既存の `WindowClient` に解決されるプロミス (`Promise`)。

仕様書
---

| Specification |
| --- |
| Service Workers # client-navigate |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
PeriodicSyncManager: register() メソッド
====================================

**Experimental:** **これは実験的な機能です。**  
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

**`register()`** は `PeriodicSyncManager` インターフェイスのメソッドで、
 指定したタグとオプションでブラウザーに定期的な同期リクエストを登録します。登録が完了すると解決する `Promise` を返します。

構文
--


```js
register(tag, options)
```

### 引数

`tag`

固有の文字列の識別子です。

`options` 省略可

以下のオプションデータを含む `Object` です。

`minInterval`

定期的な同期を行う最小間隔時間をミリ秒単位で指定します。


### 返値

`undefined` で解決する `Promise` を返します。

### 例外

`InvalidStateError` `DOMException`

アクティブなサービスワーカー (`ServiceWorker`) が存在しない場合に返されます。

`NotAllowedError` `DOMException`

バックグラウンド定期同期のその権限が与えられていない場合に返されます。

`InvalidAccessError` `DOMException`

アクティブウィンドウがメインウィンドウでない場合（`auxiliary` や `top-level` の種類でない場合）に返されます。

例
-

以下の非同期関数は、閲覧コンテキストから最小 1 日間隔で定期バックグラウンド同期を登録するものです。


```js
async function registerPeriodicNewsCheck() {
  const registration = await navigator.serviceWorker.ready;
  try {
    await registration.periodicSync.register("fetch-news", {
      minInterval: 24 \* 60 \* 60 \* 1000,
    });
  } catch {
    console.log("Periodic Sync could not be registered!");
  }
}
```

仕様書
---

| Specification |
| --- |
| Web Periodic Background Synchronization # dom-periodicsyncmanager-register |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* Richer offline experiences with the Periodic Background Sync API
* A Periodic Background Sync demo app
PeriodicSyncManager: unregister() メソッド
======================================

**Experimental:** **これは実験的な機能です。**  
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

**`unregister()`** は `PeriodicSyncManager` インターフェイスのメソッドで、
 指定したタグに対応する定期同期のリクエストを登録解除し、登録解除が完了したときに解決する `Promise` を返します。

構文
--


```js
unregister(tag)
```

### 引数

tag

固有のバックグラウンド同期に関する固有の文字列の記述子です。

### 返値

解決された `Promise` です。

### 例外

なし。

例
-

次の例では、定期同期を削除して、バックグラウンドでの記事の同期を停止しています。


```js
navigator.serviceWorker.ready.then((registration) => {
  registration.periodicSync.unregister("get-latest-news");
});
```

仕様書
---

| Specification |
| --- |
| Web Periodic Background Synchronization # dom-periodicsyncmanager-unregister |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* Richer offline experiences with the Periodic Background Sync API
* A Periodic Background Sync demo app
PeriodicSyncManager: getTags() メソッド
===================================

**Experimental:** **これは実験的な機能です。**  
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

**`getTags()`** は `PeriodicSyncManager` インターフェイスのメソッドで、定期的な同期を行うために現在登録されているタグを表す `String` オブジェクトのリストで解決される `Promise` を返します。

構文
--


```js
getTags()
```

### 引数

なし。

### 返値

定期的な同期を行うために現在登録されているタグを表す `String` オブジェクトのリストで解決される `Promise` です。

### 例外

なし。

例
-

次の例では、`getTags()` メソッドを使用して、指定されたタグを持つ定期的な同期タスクが登録されているかどうかを調べています。


```js
navigator.serviceWorker.ready.then((registration) => {
  registration.periodicSync.getTags().then((tags) => {
    if (tags.includes("get-latest-news")) skipDownloadingLatestNewsOnPageLoad();
  });
});
```


`skipDownloadingLatestNewsOnPageLoad()` は開発者が定義した関数です。

仕様書
---

| Specification |
| --- |
| Web Periodic Background Synchronization # dom-periodicsyncmanager-gettags |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* Richer offline experiences with the Periodic Background Sync API
* A Periodic Background Sync demo app
BaseAudioContext.createAnalyser()
=================================

`createAnalyser()` は `BaseAudioContext` インターフェイスのメソッドで、 `AnalyserNode` を作成します。これは音声の時間と周波数データを公開し、データの可視化を行います。

**メモ:** `AnalyserNode()` コンストラクターが `AnalyserNode` を生成するのに推奨される方法です。 AudioNode の作成を参照してください。

**メモ:** このノードの詳しい説明は、 `AnalyserNode` のページを参照してください。

構文
--


```js
createAnalyser();
```

### 引数

なし。

### 返値

`AnalyserNode` です。

例
-

次の例では、 AudioContext を使用して Analyser ノードを作成し、 requestAnimationFrame() を使用してタイムドメインのデータを繰り返し収集し、現在の音声入力の「オシロスコープ形式」の出力を描画する基本的な使用方法を示しています。より完全な応用例や情報については、 Voice-change-O-matic のデモをご覧ください（関連コードは、 app.js 128-205 行目をご覧ください）。


```js
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var analyser = audioCtx.createAnalyser();

  ...

analyser.fftSize = 2048;
var bufferLength = analyser.frequencyBinCount;
var dataArray = new Uint8Array(bufferLength);
analyser.getByteTimeDomainData(dataArray);

// 現在の音のオシロスコープのように描く

function draw() {

      drawVisual = requestAnimationFrame(draw);

      analyser.getByteTimeDomainData(dataArray);

      canvasCtx.fillStyle = 'rgb(200, 200, 200)';
      canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);

      canvasCtx.lineWidth = 2;
      canvasCtx.strokeStyle = 'rgb(0, 0, 0)';

      canvasCtx.beginPath();

      var sliceWidth = WIDTH \* 1.0 / bufferLength;
      var x = 0;

      for(var i = 0; i < bufferLength; i++) {

        var v = dataArray[i] / 128.0;
        var y = v \* HEIGHT/2;

        if(i === 0) {
          canvasCtx.moveTo(x, y);
        } else {
          canvasCtx.lineTo(x, y);
        }

        x += sliceWidth;
      }

      canvasCtx.lineTo(canvas.width, canvas.height/2);
      canvasCtx.stroke();
    };

    draw();
```

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-baseaudiocontext-createanalyser |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* ウェブオーディオ API の使用
BaseAudioContext.createChannelMerger()
======================================

`createChannelMerger()` は `BaseAudioContext` インターフェイスのメソッドで、 `ChannelMergerNode` を作成します。これは複数の音声ストリームのチャンネルを一つの音声ストリームに結合します。

**メモ:** `ChannelMergerNode()` (en-US) コンストラクターは `ChannelMergerNode` を作成するための推奨される方法です。 AudioNode の作成を参照してください。

構文
--


```js
createChannelMerger(numberOfInputs);
```

### 引数

numberOfInputs

出力ストリームに含まれる、入力オーディオストリームのチャンネル数です。この引数が指定されていない場合の既定値は 6 です。

### 返値

`ChannelMergerNode` です。

例
-

次の例では、ステレオトラック（例えば音楽）を分離し、左チャンネルと右チャンネルを別々に処理する方法を示しています。これを使うには、 `AudioNode.connect(AudioNode)` メソッドの第 2、第 3 引数を使って、接続元のチャンネルのインデックスと接続先のチャンネルのインデックスの両方を指定することが必要です。


```js
var ac = new AudioContext();
ac.decodeAudioData(someStereoBuffer, function (data) {
  var source = ac.createBufferSource();
  source.buffer = data;
  var splitter = ac.createChannelSplitter(2);
  source.connect(splitter);
  var merger = ac.createChannelMerger(2);

  // 左チャンネルのボリュームのみ小さくする
  var gainNode = ac.createGain();
  gainNode.gain.setValueAtTime(0.5, ac.currentTime);
  splitter.connect(gainNode, 0);

  // スプリッターをマージャーの 2 番目の入力に接続すると、チャンネルが効果的に交換され、
  // ステレオイメージが反転します。
  gainNode.connect(merger, 0, 1);
  splitter.connect(merger, 1, 0);

  var dest = ac.createMediaStreamDestination();

  // ChannelMergerNode を使っているので、ステレオの MediaStream が
  // できました。これでウェブオーディオグラフを WebRTC や MediaRecorder などに
  // パイプするのに使えます。
  merger.connect(dest);
});
```

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-baseaudiocontext-createchannelmerger |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* ウェブオーディオ API の使用
BaseAudioContext.createBufferSource()
=====================================

`createBufferSource()` は `BaseAudioContext` インターフェイスのメソッドで、新しい `AudioBufferSourceNode` を作成するために使用します。これは `AudioBuffer` オブジェクトに含まれる音声データを再生するために使用されます。 `AudioBuffer` は `BaseAudioContext.createBuffer` で生成さされたり、音声トラックのデコードに成功したときに `BaseAudioContext.decodeAudioData` から返されたりします。

**メモ:** `AudioBufferSourceNode()` コンストラクターは、 `AudioBufferSourceNode` を作成するための推奨される方法です。 AudioNode の作成を参照してください。

構文
--


```js
createBufferSource();
```

### 引数

なし。

### 返値

`AudioBufferSourceNode` です。

例
-

この例では、 2 秒間のバッファーを作成してホワイトノイズで満たし、 `AudioBufferSourceNode` で再生しています。コメントでは、何が起こっているのかを簡単に説明しています。

**メモ:** コードをライブで実行したり、ソースを閲覧したりすることもできます。


```js
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var button = document.querySelector("button");
var pre = document.querySelector("pre");
var myScript = document.querySelector("script");

pre.innerHTML = myScript.innerHTML;

// ステレオ
var channels = 2;
// AudioContext のサンプリングレートで 2 秒間の
// 空のステレオバッファーを生成する
var frameCount = audioCtx.sampleRate \* 2.0;

var myArrayBuffer = audioCtx.createBuffer(
  channels,
  frameCount,
  audioCtx.sampleRate,
);

button.onclick = function () {
  // バッファにホワイトノイズを書き込む
  // -1.0 から 1.0 の間の乱数の値
  for (var channel = 0; channel < channels; channel++) {
    // 実際のデータの配列を得る
    var nowBuffering = myArrayBuffer.getChannelData(channel);
    for (var i = 0; i < frameCount; i++) {
      // Math.random() は [0; 1.0] である
      // 音声は [-1.0; 1.0] である必要がある
      nowBuffering[i] = Math.random() \* 2 - 1;
    }
  }

  // AudioBufferSourceNode を得る
  // これは AudioBuffer を再生するときに使う AudioNode である
  var source = audioCtx.createBufferSource();
  // AudioBufferSourceNode にバッファーを設定する
  source.buffer = myArrayBuffer;
  // AudioBufferSourceNode を出力先に接続すると
  // 音声が聞こえるようになる
  source.connect(audioCtx.destination);
  // 音源の再生を始める
  source.start();
};
```

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-baseaudiocontext-createbuffersource |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* ウェブオーディオ API の使用
BaseAudioContext.destination
============================

`destination` は `BaseAudioContext` のプロパティで、このコンテキストのすべての音声の最終的な出力先を表す `AudioDestinationNode` を返します。これは、端末のスピーカーのような、オーディオレンダリング機器と考えることができます。

値
-

`AudioDestinationNode` です。

例
-

**メモ:** 完全な実装の例は、 MDN GitHub リポジトリーの voice-change-o-matic などを参照してください。


```js
var AudioContext = window.AudioContext || window.webkitAudioContext;
var audioCtx = new AudioContext();
// 古い webkit/blink のブラウザーでは接頭辞が必要です

var oscillatorNode = audioCtx.createOscillator();
var gainNode = audioCtx.createGain();

oscillatorNode.connect(gainNode);
gainNode.connect(audioCtx.destination);
```

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-baseaudiocontext-destination |

ブラウザーの互換性
---------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

関連情報
----

* ウェブオーディオ API の使用