recursal/MDN huggingface dataset:
WritableStream: abort() メソッド
============================

**`abort()`** は `WritableStream` インターフェイスのメソッドで、ストリーミングを中止し、プロデューサーがストリームに正常に書き込むことができなくなり、キューに入れられた書き込みが破棄されてすぐにエラー状態に移行することを通知します。

構文
--


```js
abort(reason)
```

### 引数

`reason`

人間が読むことのできる文字列で、中止した理由を提供します。

### 返値

`Promise` です。 `reason` 引数で指定された値で履行されます。

### 例外

`TypeError`

中止しようとしているストリームは `WritableStream` ではないか、ロックされています。

例
-


```js
const writableStream = new WritableStream(
  {
    write(chunk) {
      // ...
    },
    close() {
      // ...
    },
    abort(err) {
      // ...
    },
  },
  queuingStrategy,
);

// ...

// 必要に応じて、後でストリームを中止します
writableStream.abort();
```

仕様書
---

| Specification |
| --- |
| Streams Standard # ref-for-ws-abort③ |

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

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

**`getWriter()`** は `WritableStream` インターフェイスのメソッドで、`WritableStreamDefaultWriter` の新しいインスタンスを返し、そのインスタンスにストリームをロックします。
 ストリームがロックされている間、このライターが解放されるまで他のライターを取得することはできません。

構文
--


```js
getWriter()
```

### 引数

なし。

### 返値

`WritableStreamDefaultWriter` オブジェクトのインスタンス。

### 例外

`TypeError`

ライターを作成しようとしているストリームが `WritableStream` ではない場合。

例
-

次の例は、このインターフェイスのいくつかの機能を示しています。 カスタムのシンクと API 提供のキューイング戦略を使用した `WritableStream` の作成を示しています。 次に、`sendMessage()` という関数を呼び出し、新しく作成したストリームと文字列を渡します。 この関数内で、`WritableStreamDefaultWriter` のインスタンスを返すストリームの `getWriter()` メソッドを呼び出します。 `forEach()` 呼び出しを使用して、文字列の各チャンクをストリームに書き込みます。 最後に、`write()` および `close()` は、チャンクとストリームの成功または失敗に対処するためのプロミスを返します。


```js
const list = document.querySelector("ul");

function sendMessage(message, writableStream) {
  // defaultWriter は WritableStreamDefaultWriter 型です
  const defaultWriter = writableStream.getWriter();
  const encoder = new TextEncoder();
  const encoded = encoder.encode(message, { stream: true });
  encoded.forEach((chunk) => {
    defaultWriter.ready
      .then(() => defaultWriter.write(chunk))
      .then(() => {
        console.log("Chunk written to sink.");
      })
      .catch((err) => {
        console.log("Chunk error:", err);
      });
  });
  // ライターを閉じる前にすべてのチャンクが
  // 確実に書き込まれるように、ready を再度呼び出します。
  defaultWriter.ready
    .then(() => {
      defaultWriter.close();
    })
    .then(() => {
      console.log("All chunks written");
    })
    .catch((err) => {
      console.log("Stream error:", err);
    });
}

const decoder = new TextDecoder("utf-8");
const queuingStrategy = new CountQueuingStrategy({ highWaterMark: 1 });
let result = "";
const writableStream = new WritableStream(
  {
    // シンクの実装
    write(chunk) {
      return new Promise((resolve, reject) => {
        const buffer = new ArrayBuffer(1);
        const view = new Uint8Array(buffer);
        view[0] = chunk;
        const decoded = decoder.decode(view, { stream: true });
        const listItem = document.createElement("li");
        listItem.textContent = `Chunk decoded: ${decoded}`;
        list.appendChild(listItem);
        result += decoded;
        resolve();
      });
    },
    close() {
      const listItem = document.createElement("li");
      listItem.textContent = `[MESSAGE RECEIVED] ${result}`;
      list.appendChild(listItem);
    },
    abort(err) {
      console.log("Sink error:", err);
    },
  },
  queuingStrategy,
);

sendMessage("Hello, world.", writableStream);
```


完全なコードは、単純なライターの例にあります。

仕様書
---

| Specification |
| --- |
| Streams Standard # ref-for-ws-get-writer① |

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

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

**`locked`** は `WritableStream` インターフェイスの読み取り専用プロパティは、 `WritableStream` がライターにロックされているかどうかを示す論理値を返します。

### 値

論理値で、書き込み可能なストリームがロックされているかどうかを示します。

例
-


```js
const writableStream = new WritableStream(
  {
    write(chunk) {
      // ...
    },
    close() {
      // ...
    },
    abort(err) {
      // ...
    },
  },
  queuingStrategy,
);

// ...

const writer = writableStream.getWriter();

writableStream.locked;
// ストリームがライターにロックされているため、true を返します
```

仕様書
---

| Specification |
| --- |
| Streams Standard # ref-for-ws-locked② |

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

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

**`root`** は `FileSystem` インターフェイスの読み取り専用プロパティで、ファイルシステムのルートディレクトリーを表す `FileSystemDirectoryEntry` オブジェクトです。ファイルとディレクトリー項目 API で使用されます。

値
-

`FileSystemDirectoryEntry` で、ファイルシステムのルートディレクトリーを表します。

例
-


```js
// tbd
```

仕様書
---

| Specification |
| --- |
| File and Directory Entries API # dom-filesystem-root |

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

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

関連情報
----

* ファイルとディレクトリー項目 API
* ファイルとディレクトリー項目 API の紹介
* `FileSystem`
FileSystem.name
===============

**`name`** は `FileSystem` インターフェイスの読み取り専用プロパティで、ファイルシステムの名前を示します。この文字列は、現在ファイルとディレクトリー項目 API で公開されているすべてのファイルシステムの間で一意です。

値
-

このファイルシステムの名前を表す文字列です。

例
-


```js
// tbd
```

仕様書
---

| Specification |
| --- |
| File and Directory Entries API # dom-filesystem-name |

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

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

関連情報
----

* ファイルとディレクトリー項目 API
* ファイルとディレクトリー項目 API の紹介
* `FileSystem`
WebSocket サーバーを JavaScript (Deno) で書く
=====================================

この例では、 Deno を使用して WebSocket API サーバーを作成する方法を、付随するウェブページと共に示します。

Deno は JavaScript ランタイムで、 TypeScript のコンパイルとオンザフライでのキャッシュに対応しています。 Deno はフォーマッター、リンター、テストランナーなどを持ち、また多くのウェブ API も実装しています。ウェブ標準に準拠するために、 Deno 固有の API はすべて `Deno` 名前空間の下に実装されています。

Deno のウェブサイトでは、 Deno のインストール方法を提供しています。

執筆時点での Deno のバージョンは `1.36` です。

コード
---

コードはサーバー用とクライアント用の 2 つのファイルに格納します。

### サーバー

`main.js` ファイルを作成します。このファイルにはクライアントに HTML を提供する単純な HTTP サーバーのコードを格納します。


```js
Deno.serve({
  port: 80,
  handler: async (request) => {
    // If the request is a websocket upgrade,
    // we need to use the Deno.upgradeWebSocket helper
    if (request.headers.get("upgrade") === "websocket") {
      const { socket, response } = Deno.upgradeWebSocket(request);

      socket.onopen = () => {
        console.log("CONNECTED");
      };
      socket.onmessage = (event) => {
        console.log(`RECEIVED: ${event.data}`);
        socket.send("pong");
      };
      socket.onclose = () => console.log("DISCONNECTED");
      socket.onerror = (error) => console.error("ERROR:", error);

      return response;
    } else {
      // If the request is a normal HTTP request,
      // we serve the client HTML file.
      const file = await Deno.open("./index.html", { read: true });
      return new Response(file.readable);
    }
  },
});
```


`Deno.upgradeWebSocket()` は接続をウェブソケット接続にアップグレードします。これはプロトコルアップグレードメカニズム (en-US)で詳しく説明されています。

`Deno.serve()` は、 `Deno.listen()` と `Deno.serveHttp()` を基盤に使用し、 HTTP サーバーを簡単に設定するための上位インターフェイスです。これがなければ、コードは次のように見ていくことになります。


```js
for await (const conn of Deno.listen({ port: 80 })) {
  for await (const { request, respondWith } of Deno.serveHttp(conn)) {
    respondWith(handler(request));
  }
}
```

### クライアント

`index.html` ファイルを作成します。このファイルには、接続が確立してから 5 秒ごとにサーバーに ping を送信するスクリプトがあります。


```html
<!doctype html>
<h2>WebSocket Test</h2>
<p>Sends a ping every five seconds</p>
<div id="output"></div>
<script>
 const wsUri = "ws://127.0.0.1/";
 const output = document.querySelector("#output");
 const websocket = new WebSocket(wsUri);
 let pingInterval;

 function writeToScreen(message) {
 output.insertAdjacentHTML("afterbegin", `<p>${message}</p>`);
 }

 function sendMessage(message) {
 writeToScreen(`SENT: ${message}`);
 websocket.send(message);
 }

 websocket.onopen = (e) => {
 writeToScreen("CONNECTED");
 sendMessage("ping");
 pingInterval = setInterval(() => {
 sendMessage("ping");
 }, 5000);
 };

 websocket.onclose = (e) => {
 writeToScreen("DISCONNECTED");
 clearInterval(pingInterval);
 };

 websocket.onmessage = (e) => {
 writeToScreen(`RECEIVED: ${e.data}`);
 };

 websocket.onerror = (e) => {
 writeToScreen(`ERROR: ${e.data}`);
 };
</script>
```

コードの実行
------

これら 2 つのファイルを用いて、 Deno を使用してアプリを実行します。


```shell
deno run --allow-net=0.0.0.0:80 --allow-read=./index.html main.js
```


Deno では、ホストマシン上でアクセスするための明示的な権限を要求します。

* `--allow-net=0.0.0.0:80` はアプリが localhost を 80 番ポートで使用することを許可します。
* `--allow-read=./index.html` はクライアントが HTML ファイルにアクセスできるようにします。
関連情報
----

* WebSocket サーバーを書く
バイナリーデータの送信と受信
==============

XMLHttpRequest オブジェクトの `responseType` プロパティで、サーバーに期待する応答の種類を変更することができます。設定可能な値は空文字列 (既定), `"arraybuffer"`, `"blob"`, `"document"`, `"json"`, `"text"` です。 `response` プロパティにはエンティティの本体が `responseType` に応じて `ArrayBuffer`, `Blob`, `Document`, `JSON` または文字列で格納されます。要求が不完全であったり成功しなかった場合は `null` になります。

このサンプルでは画像をバイナリーファイルとして読み込み、生のバイト列から 8 ビット符号なし整数値の配列を作成します。なお、これは画像をデコードしてピクセルを読み取ることは行いません。そのためには png デコードライブラリーが必要になるでしょう。


```js
const req = new XMLHttpRequest();
req.open("GET", "/myfile.png", true);
req.responseType = "arraybuffer";

req.onload = (event) => {
  const arrayBuffer = req.response; // Note: not req.responseText
  if (arrayBuffer) {
    const byteArray = new Uint8Array(arrayBuffer);
    byteArray.forEach((element, index) => {
      // do something with each byte in the array
    });
  }
};

req.send(null);
```


`responseType` プロパティに `"blob"` という文字列を設定すると、バイナリーファイルを `Blob` として読み取ることもできます。


```js
const req = new XMLHttpRequest();
req.open("GET", "/myfile.png", true);
req.responseType = "blob";

req.onload = (event) => {
  const blob = req.response;
  // ...
};

req.send();
```

古いブラウザーでのバイナリーデータの受信
--------------------

下に示す `loadBinaryResource()` 関数は、指定した URL からロードしたバイナリーデータを関数の呼び元に返します。


```js
function loadBinaryResource(url) {
  const req = new XMLHttpRequest();
  req.open("GET", url, false);

  // XHR binary charset opt by Marcus Granado 2006 [http://mgran.blogspot.com]
  req.overrideMimeType("text/plain; charset=x-user-defined");
  req.send(null);
  return req.status === 200 ? req.responseText : "";
}
```


マジックは 5 行目で、 MIME タイプを上書きしてブラウザーに強制的に、ユーザー定義の文字セットを使用したプレインテキストとして扱わせます。これにより、ブラウザーはこれを解釈せず、未処理のままバイト列を通します。


```js
const filestream = loadBinaryResource(url);
const abyte = filestream.charCodeAt(x) & 0xff; // throw away high-order byte (f7)
```


上記のサンプルでは、ロードしたバイナリーデータ内のオフセット `x` のバイトを取得します。 `x` の有効範囲は 0 から `filestream.length-1` です。

詳細な説明は downloading binary streams with XMLHttpRequest を見て下さい。

バイナリーデータの送信
-----------

XMLHttpRequest の `send` メソッドが拡張され、 `ArrayBuffer`、`Blob`、`File` オブジェクトを受け付けることでバイナリーデータの送信が容易になりました.

続くサンプルはその場で作ったテキストファイルを `POST` メソッドで "file" をサーバーに送信します。このサンプルはプレインテキストを使っていますが、代わりにデータがバイナリーファイルだとイメージする事も出来ます。


```js
const req = new XMLHttpRequest();
req.open("POST", url, true);
req.onload = (event) => {
  // Uploaded
};

const blob = new Blob(["abc123"], { type: "text/plain" });

req.send(blob);
```

バイナリーデータとして型付き配列を送信
-------------------

同等にバイナリーデータとして JavaScript の型付き配列を送信することもできます。


```js
// Create a new array with fake data (Consecutive numbers (0 - 255), looping back to 0)
const array = new Uint8Array(512).map((v, i) => i);

const xhr = new XMLHttpRequest();
xhr.open("POST", url, false);
xhr.send(array);
```


これは 8 ビット整数の 512 バイトの配列を構築して送信します。勿論、好きな任意のバイナリーデータで使えます。

フォーム送信とファイルアップロード
-----------------

`FormData` を参照してください。
AudioBufferSourceNode.start()
=============================

`start()` は `AudioBufferSourceNode` インターフェイスのメソッドで、
 このメソッドは、バッファーに含まれる音声データの再生を予約したり、すぐに再生を開始したりするために使用されます。

構文
--


```js
start(when)
start(when, offset)
start(when, offset, duration)
```

### 引数

`when` 省略可

音が鳴り始めるべき時刻（秒単位）。 `AudioContext` が使用するのと同じ時間座標系で指定します。もし `when` が (`AudioContext.currentTime` よりも小さいか、 0 であれば、音の再生はすぐに開始されます。**既定値は 0 です。**

`offset` 省略可

音声バッファー内で再生を始めるべき時刻を、 `AudioContext` と同じ時間座標系で秒単位で指定したオフセットです。例えば、 10 秒の音声クリップの半分から再生を始めるには、 `offset` は 5 となります。既定値である 0 は、音声バッファの先頭から再生を始めます。再生される音声の終わりを過ぎたオフセット（音声バッファーの `duration` や `loopEnd` 属性に基づく）は、許容範囲内の最大値に暗黙に収められます。サウンドへのオフセットの計算は、現在の再生速度ではなく、音声バッファー本来のサンプルレートを使用して行われるため、サウンドが通常の 2 倍の速度で再生されている場合でも、 10 秒の音声バッファーの中間の点は 5 となります。

`duration` 省略可

サウンドの再生時間を秒単位で指定します。この引数が指定されなかった場合、サウンドは自然に終了するか、 `stop()` メソッドを使用して停止されるまで再生されます。この引数を使用すると、 `start(when, offset)` を呼び出してから `stop(when+duration)` を使用するのと機能的に同じになります。

### 返値

なし (`undefined`)。

### 例外

`TypeError`

3 つの時間引数のうち 1 つ以上に負の値が指定された場合に発生します。時間物理学の法則を改ざんしようとしないでください。

`InvalidStateError` `DOMException`

`start()` が既に呼び出されていた場合に発生します。この関数は `AudioBufferSourceNode` が生きている間に一度だけ呼び出すことができます。

例
-

最も単純な例は、音声バッファー再生を最初から始めるだけです。この場合、引数を指定する必要はありません。


```js
source.start();
```


次はそれよりも複雑な再生方法です。1 秒待った後、音声バッファーの 3 秒経過した位置から、10 秒間再生します。


```js
source.start(audioCtx.currentTime + 1, 3, 10);
```


**メモ:** `start()` の使い方の完全な例は `AudioContext.decodeAudioData()` を参照してください。コードをすぐに実行することや、ソースコードを閲覧することもできます。

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-audiobuffersourcenode-start |

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

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

関連情報
----

* ウェブオーディオ API の使用
AudioBufferSourceNode()
=======================

**`AudioBufferSourceNode()`** コンストラクターは、新しい `AudioBufferSourceNode` オブジェクトインスタンスを生成します。

構文
--


```js
new AudioBufferSourceNode(context, options)
```

### 引数

`context`

`AudioContext` への参照。

`options` 省略可

以下のオプションです。

`buffer`

再生される `AudioBuffer` のインスタンス。

`detune`

音声ストリームのレンダリング速度を調整するためのセント単位の値。公称範囲は（-∞ から +∞）です。既定では `0` です。

`loop`

 論理値で、音声をループ再生させるかどうかを示します。
 既定値は `false` です。ループが再生中に動的に変更された場合、新しい値は音声の次の処理ブロックに反映されます。


`loopEnd`

オプションで、 loop 属性が `true` である場合にループを終了させる値を秒単位で指定します。既定では `0` です。この値は、ループの中身とは関係ありません。ループを構成するサンプルフレームは、 `loopStart` から `loopEnd`-(1/`sampleRate`) までの値で実行されます。この値は 0 からバッファーの持続時間の間に設定するのが賢明です。もし `loopEnd` が 0 よりも小さければ、ループは 0 で終わり、もし `loopEnd` がバッファーの持続時間よりも大きければ、ループはバッファーの終端で終了します。この属性は、バッファのサンプルレートを掛け、最も近い整数値に丸めることで、バッファー内の正確なサンプルフレームオフセットに変換されます。そのため、この属性の動作は `playbackRate` 引数の値には依存しません。

`loopStart`

オプションで、 loop 属性が `true` の場合にループを始める値を秒単位で指定します。既定では `0` です。0 とバッファーの持続時間の間の値に設定するのが賢明です。もし `loopStart` が 0 よりも小さい場合、ループは 0 から始まります。もし `loopStart` がバッファーの持続時間よりも大きい場合、ループはバッファーの終わりから始まります。この属性は、バッファーのサンプルレートを掛け、最も近い整数値に丸めることで、バッファー内の正確なサンプルフレームオフセットに変換されます。そのため、この属性の動作は `playbackRate` 引数の値には依存しません。

`playbackRate`

音声ストリームをレンダリングする速度を指定します。既定値では `1` です。この引数は k-rate です。離調との複合引数です。公称範囲は（-∞ から +∞）です。

`channelCount`

ノードへの任意の入力への接続をアップミキシングおよびダウンミキシングする際に使用されるチャンネル数を決定するために使用される整数を表します。（詳細は `AudioNode.channelCount` を参照。）使用方法と正確な定義は、 `channelCountMode` の値に依存します。

`channelCountMode`

ノードの入出力間でチャンネルを一致させる方法を記述した列挙型の値を表します。（既定値を含む詳細情報は `AudioNode.channelCountMode` を参照してください。）

`channelInterpretation`

チャンネルの意味を表現する列挙値を記述します。この解釈により、音声のアップミキシングおよびダウンミキシングがどのように行われるかが定義されます。使用可能な値は `"speakers"` または `"discrete"` です。（既定値で記載される詳細な情報は `AudioNode.channelCountMode` を参照してください。）


### 返値

新しい `AudioBufferSourceNode` オブジェクトインスタンスです。

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-audiobuffersourcenode-constructor-audiobuffersourcenode |

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

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

**`playbackRate`** は `AudioBufferSourceNode` インターフェイスのプロパティで、
 このプロパティは、音声資産の再生速度を定義する k-rate `AudioParam` です。

 1.0 の値は、そのサンプリングレートと同じ速度で再生することを示し、 1.0 より小さい値は、よりゆっくりと、1.0 より大きい値は、通常より速く音声を再生することになります。既定値は `1.0` です。
 他の値に設定された場合、`AudioBufferSourceNode` は出力に送る前に音声を再サンプリングします。

値
-

この `value` は、音声の再生レートを元のサンプリングレートに対する十進数の割合で示す浮動小数点型の値です。

44.1 kHz （44,100 サンプル毎秒）でサンプリングされた音声を含むサウンドバッファーを考えてみましょう。いくつかの `playbackRate` の値で何ができるかを見てみましょう。

* `playbackRate` を 1.0 にすると、通常の速度、 44,100 Hz で再生します。
* `playbackRate` を 0.5 にすると、半分の速度、 22,050 Hz で再生します。
* `playbackRate` を 2.0 は音声の再生レートを倍にして 88,200 Hz で再生します。
例
-

この例では、 `AudioContext.decodeAudioData()` 関数を使用して音声トラックをデコードし、 `AudioBufferSourceNode` に入れています。音声の再生と停止にはボタンが指定され、`playbackRate`、`loopStart`、`loopEnd` のプロパティをその場で変更するためにスライダーコントロールが使用されます。

**メモ:** 動作する完全な例は、このコードをライブで実行するか、ソースを表示することができます。.


```html
<input
 class="playback-rate-control"
 type="range"
 min="0.25"
 max="3"
 step="0.05"
 value="1" />
<span class="playback-rate-value">1.0</span>
```



```js
function getData() {
  source = audioCtx.createBufferSource();
  request = new XMLHttpRequest();

  request.open("GET", "viper.ogg", true);

  request.responseType = "arraybuffer";

  request.onload = () => {
    const audioData = request.response;

    audioCtx.decodeAudioData(
      audioData,
      (buffer) => {
        myBuffer = buffer;
        source.buffer = myBuffer;
        source.playbackRate.value = playbackControl.value;
        source.connect(audioCtx.destination);
        source.loop = true;
      },

      (e) => console.error(`Error with decoding audio data: ${e.err}`),
    );
  };

  request.send();
}

// wire up buttons to stop and play audio, and range slider control

play.onclick = () => {
  getData();
  source.start(0);
  play.setAttribute("disabled", "disabled");
  playbackControl.removeAttribute("disabled");
};

stop.onclick = () => {
  source.stop(0);
  play.removeAttribute("disabled");
  playbackControl.setAttribute("disabled", "disabled");
};

playbackControl.oninput = () => {
  source.playbackRate.value = playbackControl.value;
  playbackValue.innerHTML = playbackControl.value;
};
```

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-audiobuffersourcenode-playbackrate |

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

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

関連情報
----

* ウェブオーディオ API の使用
* ウェブオーディオ API
AudioBufferSourceNode.detune
============================

**`detune`** は `AudioBufferSourceNode` インターフェイスのプロパティで、k-rate の `AudioParam` 再生時の離調をセント単位で表します。

例えば、 +100 と -100 の値は半音ずつ上下に離調し、 +1200 と -1200 の値は 1 オクターブずつ上下に離調します。

値
-

 A k-rate `AudioParam`
 whose value indicates the detuning of oscillation in cents.

**メモ:** `AudioParam` は読み取り専用の値を返しますが、値は読み取り専用ではありません。

例
-


```js
const audioCtx = new AudioContext();

const channelCount = 2;
const frameCount = audioCtx.sampleRate \* 2.0; // 2 seconds

const myArrayBuffer = audioCtx.createBuffer(
  channelCount,
  frameCount,
  audioCtx.sampleRate,
);

for (let channel = 0; channel < channelCount; channel++) {
  const nowBuffering = myArrayBuffer.getChannelData(channel);
  for (let i = 0; i < frameCount; i++) {
    nowBuffering[i] = Math.random() \* 2 - 1;
  }
}

const source = audioCtx.createBufferSource();
source.buffer = myArrayBuffer;
source.connect(audioCtx.destination);
source.detune.value = 100; // value in cents
source.start();
```

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-audiobuffersourcenode-detune |

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

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

関連情報
----

* ウェブオーディオ API の使用
* ウェブオーディオ API
AudioBufferSourceNode.loopStart
===============================

**`loopStart`** は `AudioBufferSourceNode` インターフェイスのプロパティで、 `AudioBuffer` の中で再生再開を行うべき場所を秒単位で示す浮動小数点数値です。

`loopStart` プロパティの既定値は `0` です。

値
-

浮動小数点数で、再生中に各ループを始めるべき音声バッファーへのオフセットを秒単位で示します。この値は `loop` 引数が `true` のときのみ使用されます。

例
-

この例では、 `AudioContext.decodeAudioData()` 関数を使用して音声トラックをデコードし、 `AudioBufferSourceNode` に入れています。音声の再生と停止にはボタンが指定され、`playbackRate`、`loopStart`、`loopEnd` のプロパティをその場で変更するためにスライダーコントロールが使用されます。

音声が最後まで再生されるとループしますが、 `loopStart` と `loopEnd` を変更することによってループの長さを制御することができます。例えば、それらの値をそれぞれ 20 と 25 に設定すると、音声はトラックの 20 秒から 25 秒の間でループを始めることになります。

**メモ:** 動作する完全な例は、このコードをライブで実行するか、ソースを表示することができます。.


```js
function getData() {
  source = audioCtx.createBufferSource();
  request = new XMLHttpRequest();

  request.open("GET", "viper.ogg", true);
  request.responseType = "arraybuffer";

  request.onload = () => {
    const audioData = request.response;

    audioCtx.decodeAudioData(
      audioData,
      (buffer) => {
        myBuffer = buffer;
        songLength = buffer.duration;
        source.buffer = myBuffer;
        source.playbackRate.value = playbackControl.value;
        source.connect(audioCtx.destination);
        source.loop = true;

        loopstartControl.setAttribute("max", Math.floor(songLength));
        loopendControl.setAttribute("max", Math.floor(songLength));
      },

      (e) => console.error(`Error with decoding audio data: ${e.err}`),
    );
  };

  request.send();
}

// …

loopstartControl.oninput = () => {
  source.loopStart = loopstartControl.value;
  loopstartValue.innerHTML = loopstartControl.value;
};

loopendControl.oninput = () => {
  source.loopEnd = loopendControl.value;
  loopendValue.innerHTML = loopendControl.value;
};
```

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-audiobuffersourcenode-loopstart |

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

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

関連情報
----

* ウェブオーディオ API
* ウェブオーディオ API の使用
AudioBufferSourceNode.buffer
============================

**`buffer`** は `AudioBufferSourceNode` インターフェイスのプロパティで、音声データのソースとして `AudioBuffer` を使用して音声を再生する機能を提供します。

`buffer` プロパティに `null` という値を設定すると、ノードは無音を含む単一のチャンネルを生成します（つまり、すべてのサンプルが 0 になります）。

値
-

ノードが再生する音を表すデータを格納した `AudioBuffer`。

例
-

**メモ:** 動作する完全な例は、このコードをライブ実行またはソースを閲覧してください。


```js
const myArrayBuffer = audioCtx.createBuffer(2, frameCount, audioCtx.sampleRate);

button.onclick = () => {
  // Fill the buffer with white noise;
  //just random values between -1.0 and 1.0
  for (let channel = 0; channel < channels; channel++) {
    // This gives us the actual ArrayBuffer that contains the data
    const nowBuffering = myArrayBuffer.getChannelData(channel);
    for (let i = 0; i < frameCount; i++) {
      // Math.random() is in [0; 1.0]
      // audio needs to be in [-1.0; 1.0]
      nowBuffering[i] = Math.random() \* 2 - 1;
    }
  }

  // Get an AudioBufferSourceNode.
  // This is the AudioNode to use when we want to play an AudioBuffer
  const source = audioCtx.createBufferSource();
  // set the buffer in the AudioBufferSourceNode
  source.buffer = myArrayBuffer;
};
```

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-audiobuffersourcenode-buffer |

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

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

関連情報
----

* ウェブオーディオ API の使用
* ウェブオーディオ API
AudioBufferSourceNode.loop
==========================

`loop` は `AudioBufferSourceNode` のプロパティで、 `AudioBuffer` の末端に達した時に、音声を繰り返し再生するべきかを示す論理値です。

`loop` プロパティの既定値は `false`です。

### 値

論理値で、繰り返しが有効な場合は `true` 、それ以外は `false` です。

ループが有効である場合、 `start()` が呼ばれると音声は開始点として指定された場所から再生されます。 `loopEnd` で指定された場所に達すると、音声は `loopStart` で指定された地点に戻って再生され続けます。

例
-

この例では、 `AudioContext.decodeAudioData()` 関数は音声トラックをデコードし `AudioBufferSourceNode` に追加するために使用されています。再生・停止のためにボタンが配置され、スライダーが `playbackRate` プロパティを逐次変更するために使用されています。音声はループして再生されます。

**メモ:** 実際に動作する例を見る (または、ソースコードを見る)ことができます。


```js
function getData() {
  source = audioCtx.createBufferSource();
  request = new XMLHttpRequest();

  request.open("GET", "viper.ogg", true);

  request.responseType = "arraybuffer";

  request.onload = () => {
    const audioData = request.response;

    audioCtx.decodeAudioData(
      audioData,
      (buffer) => {
        myBuffer = buffer;
        source.buffer = myBuffer;
        source.playbackRate.value = playbackControl.value;
        source.connect(audioCtx.destination);
        source.loop = true;
      },

      (e) => console.error(`Error with decoding audio data: ${e.err}`),
    );
  };

  request.send();
}

// wire up buttons to stop and play audio, and range slider control

play.onclick = () => {
  getData();
  source.start(0);
  play.setAttribute("disabled", "disabled");
  playbackControl.removeAttribute("disabled");
};
```

仕様書
---

| Specification |
| --- |
| Web Audio API # dom-audiobuffersourcenode-loop |

ブラウザーの対応
--------

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

関連情報
----

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