ReadableStream: phương thức tĩnh from()
Khả dụng hạn chế
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Note: This feature is available in Web Workers.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
Phương thức tĩnh ReadableStream.from() trả về ReadableStream từ một đối tượng lặp có thể lặp hoặc không đồng bộ được cung cấp.
Phương thức này có thể được sử dụng để bao bọc các đối tượng có thể lặp lại và không đồng bộ dưới dạng các luồng có thể đọc được, bao gồm mảng, bộ, mảng lời hứa, trình tạo không đồng bộ, luồng ReadableStreams, Node.js readable, v.v.
Cú pháp
ReadableStream.from(anyIterable)
Parameters
anyIterable-
An iterable or async iterable object.
Return value
Exceptions
TypeError-
Thrown if the passed parameter is not an iterable or async iterable (does not define the
[Symbol.iterator]()or[Symbol.asyncIterator]()method). Also thrown if, during iteration, the result of the next step is not an object or is a promise that does not resolve to an object.
Examples
>Convert an async iterator to a ReadableStream
This live example demonstrates how you can convert an async iterable to a ReadableStream, and then how this stream might be consumed.
HTML
The HTML is consists of single <pre> element, which is used for logging.
<pre id="log"></pre>
``__MDNP H20__log()` function to write to the log HTML element. ```js const
logElement = document.getElementById("log"); function log(text) {
logElement.innerText += `${text}\n`; }
It then checks if the static method is supported, and if not, logs the result.
if (!ReadableStream.from) {
log("ReadableStream.from() is not supported");
}
The async iterable is an anonymous generator function that yields the values of 1, 2 and 3 when it is called three times.
This is passed to ReadableStream.from() to create the ReadableStream.
// Define an asynchronous iterator
const asyncIterator = (async function* () {
yield 1;
yield 2;
yield 3;
})();
// Create ReadableStream from iterator
const myReadableStream = ReadableStream.from(asyncIterator);
Using readable streams demonstrates several ways to consume a stream.
The code below uses a for ...await loop, as this method is the simplest.
Each iteration of the loop logs the current chunk from the stream.
consumeStream(myReadableStream);
// Iterate a ReadableStream asynchronously
async function consumeStream(readableStream) {
for await (const chunk of readableStream) {
// Do something with each chunk
// Here we just log the values
log(`chunk: ${chunk`);
}
}
Result
The output of consuming the stream is shown below (if ReadableStream.from() is supported).
Convert an Array to a ReadableStream
This example demonstrates how you can convert an Array to a ReadableStream.
JavaScript
The iterable is just an array of strings that is passed to ReadableStream.from() to create the ReadableStream.
// An Array of vegetable names
const vegetables = ["Carrot", "Broccoli", "Tomato", "Spinach"];
// Create ReadableStream from the Array
const myReadableStream = ReadableStream.from(vegetables);
Chúng tôi sử dụng cách tiếp cận tương tự như trong nhật ký ví dụ trước và để sử dụng luồng, vì vậy điều đó không được hiển thị ở đây.
Kết quả
Đầu ra được hiển thị dưới đây.
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| Streams> # rs-from> |