ReadableStream.ReadableStream()

ReadableStream() 构造函数创建并从给定的处理程序返回一个可读的流对象。

语法

js
new ReadableStream()
new ReadableStream(underlyingSource)
new ReadableStream(underlyingSource, queuingStrategy)

参数

underlyingSource 可选

一个包含定义了构造流行为方法和属性的对象。underlyingSource 包括:

start (controller) 可选

这是一个当对象被构造时立刻调用的方法。此方法的内容由开发人员定义,并应着眼于访问流,并执行其他任何必需的设置流功能。如果这个过程是异步完成的,它可以返回一个 promise,表明成功或失败。传递给这个方法的 controller 是一个 ReadableStreamDefaultControllerReadableByteStreamController,具体取决于 type 属性的值。开发人员可以使用此方法在设立期间控制流。

pull (controller) 可选

这个方法,也是由开发人员定义的,当流的内部队列不满时,会重复调用这个方法,直到队列补满。如果 pull() 返回一个 promise,那么它将不会再被调用,直到 promise 完成;如果 promise 失败,该流将会出现错误。传递给此方法的 controller 参数是 ReadableStreamDefaultControllerReadableByteStreamController,具体取决于 type 属性的值。由于更多的块被获取,这个方法可以被开发人员用来控制流。

cancel (reason) 可选

如果应用程序表示该流将被取消(例如,调用了 ReadableStream.cancel(),则将调用此方法,该方法也由开发人员定义。该方法应该做任何必要的事情来释放对流的访问。 如果这个过程是异步的,它可以返回一个 promise,表明成功或失败。原因参数包含一个 DOMString,它描述了流被取消的原因。

type 可选

该属性控制正在处理的可读类型的流。如果它包含一个设置为 bytes 的值,则传递的控制器对象将是一个 ReadableByteStreamController,能够处理 BYOB(带你自己的缓冲区)/字节流。如果未包含,则传递的控制器将为 ReadableStreamDefaultController

autoAllocateChunkSize 可选

对于字节流,开发人员可以使用正整数值设置 autoAllocateChunkSize 以打开流的自动分配功能。启用此功能后,流实现将自动分配一个具有给定整数大小的 ArrayBuffer,并调用底层源代码,就好像消费者正在使用 BYOB reader 一样。

queuingStrategy 可选

一个可选择定义流的队列策略的对象。这需要两个参数:

highWaterMark

非负整数 - 这定义了在应用背压之前可以包含在内部队列中的块的总数。

size(chunk)

包含参数 chunk 的方法——这表示每个分块使用的大小(以字节为单位)。

备注:你可以自定义 queuingStrategy,或者使用 ByteLengthQueueingStrategyCountQueueingStrategy 的示例作为对象的值。如果 没有提供 queuingStrategy,则默认值与 highWaterMark 为 1 的 CountQueuingStrategy 相同。

返回值

ReadableStream 对象的实例。

异常

RangeError

提供的值既不是 "bytes" 也不是 undefined

示例

在下面的简单示例中,使用构造函数创建了一个自定义的 ReadableStream(完整代码请参见我们的简单随机流示例)。start() 函数每秒生成一个随机的文本字符串并将它排入流中。如果因为任何原因调用 ReadableStream.cancel(),该 cancel() 函数也可以停止生成字符串。

按下按钮,将停止生成字符串,使用 ReadableStreamDefaultController.close() 关闭流,并且将运行另一个函数,从流中读取数据。

js
const stream = new ReadableStream({
  start(controller) {
    interval = setInterval(() => {
      let string = randomChars();

      // Add the string to the stream
      controller.enqueue(string);

      // show it on the screen
      let listItem = document.createElement("li");
      listItem.textContent = string;
      list1.appendChild(listItem);
    }, 1000);

    button.addEventListener("click", function () {
      clearInterval(interval);
      fetchStream();
      controller.close();
    });
  },
  pull(controller) {
    // We don't really need a pull in this example
  },
  cancel() {
    // This is called if the reader cancels,
    // so we should stop generating strings
    clearInterval(interval);
  },
});

规范

Specification
Streams Standard
# ref-for-rs-constructor⑤

浏览器兼容性

BCD tables only load in the browser

参见