Convert ArrayBuffer to Uint8Array
To retrieve the contents of an ArrayBuffer as an array of numbers, create a Uint8Array over the buffer. The Uint8Array will have the same length as the buffer and supports array indexing and iteration.
binary/arraybuffer
38 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.
ArrayBuffer to array conversion example
const buf = new ArrayBuffer(64); const uintArr = new Uint8Array(buf); const regularArr = Array.from(uintArr); // regularArr is of type number[]
Uint8Array to regular Array with Array.from()
To convert a Uint8Array instance to a regular Array, use Array.from(). This conversion is likely slower than using the Uint8Array directly.
Blob type option for MIME type
The type of a Blob can be set using the type option in the second parameter to the Blob constructor. By default the type is unset.
ArrayBuffer to Blob conversion example
const buf = new ArrayBuffer(64); const blob = new Blob([buf]);
ArrayBuffer to Blob with MIME type example
const buf = new ArrayBuffer(64); const blob = new Blob([buf], { type: "application/octet-stream" }); blob.type; // => "application/octet-stream"
Example: create Buffer from ArrayBuffer
const arrBuffer = new ArrayBuffer(64); const nodeBuffer = Buffer.from(arrBuffer);
Example: create Buffer viewing portion of ArrayBuffer
const arrBuffer = new ArrayBuffer(64); const nodeBuffer = Buffer.from(arrBuffer, 0, 16); // view first 16 bytes
Buffer.from() with ArrayBuffer
Use the static Buffer.from() method to create a Buffer from an ArrayBuffer. The signature is Buffer.from(arrayBuffer) which returns a Buffer wrapping the entire ArrayBuffer.
Buffer.from() with offset and length
To create a Buffer that views only a portion of the underlying ArrayBuffer, pass the offset and length parameters to Buffer.from(). The signature is Buffer.from(arrayBuffer, offset, length), where offset is the starting byte position and length is the number of bytes to include in the view.
TextDecoder usage example
const buf = new ArrayBuffer(64); const decoder = new TextDecoder(); const str = decoder.decode(buf);
TextDecoder for ArrayBuffer to string conversion
Bun implements the Web-standard TextDecoder class for converting between binary data types and strings. To convert an ArrayBuffer to a string, create a new TextDecoder instance and call its decode method with the ArrayBuffer as the argument.
Create other typed arrays from ArrayBuffer
Other typed arrays can be created from an ArrayBuffer by passing the ArrayBuffer to the respective constructor. Supported typed arrays include: Uint8Array, Uint16Array, Uint32Array, Float32Array, Float64Array, BigInt64Array, and BigUint64Array.
Create Uint8Array from ArrayBuffer
A Uint8Array is a typed array that provides a view over the data in an underlying ArrayBuffer. To create a Uint8Array from an ArrayBuffer, pass the ArrayBuffer to the Uint8Array constructor: const buffer = new ArrayBuffer(64); const arr = new Uint8Array(buffer);
Create typed array view with offset and length
To create a typed array that views only a portion of an underlying ArrayBuffer, pass the offset and length parameters to the typed array constructor. For example, new Uint8Array(buffer, 0, 16) creates a Uint8Array view over the first 16 bytes of the buffer.
Blob.arrayBuffer() method to convert Blob to ArrayBuffer
The Blob class provides an .arrayBuffer() method that returns a promise resolving to an ArrayBuffer containing the Blob's contents. Example: const blob = new Blob(["hello world"]); const buf = await blob.arrayBuffer();
Convert Blob to DataView
To convert a Blob to a DataView, call blob.arrayBuffer() to get an ArrayBuffer, then pass it to the DataView constructor. The arrayBuffer() method is async and returns a Promise. Example: const blob = new Blob(["hello world"]); const arr = new DataView(await blob.arrayBuffer());
Blob.stream() returns ReadableStream
The Blob class provides a .stream() method that returns a ReadableStream. This method can be used to consume the Blob's contents as a stream.
Convert Blob to ReadableStream example
const blob = new Blob(["hello world"]); const stream = blob.stream(); This example creates a new Blob with the string "hello world" and converts it to a ReadableStream using the .stream() method.
Blob to string example
const blob = new Blob(["hello world"]); const str = await blob.text(); // => "hello world" This example shows how to create a Blob with string contents and convert it back to a string using the .text() method.
Blob.text() converts blob contents to string
The Blob class provides a .text() method that returns a promise resolving to a string representation of the blob's contents. To convert a Blob to a string, call await blob.text().
Blob to Uint8Array conversion example using bytes()
To convert a Blob to Uint8Array using the bytes() method: const blob = new Blob(["hello world"]); const arr = await blob.bytes();
Blob.arrayBuffer() reads contents as ArrayBuffer
The Blob class provides a .arrayBuffer() method that reads the contents of a Blob as an ArrayBuffer. This method is asynchronous and returns a promise.
Blob to Uint8Array conversion using arrayBuffer()
Alternatively, read the contents of a Blob into an ArrayBuffer with .arrayBuffer(), then create a Uint8Array from the buffer. Example: const blob = new Blob(["hello world"]); const arr = new Uint8Array(await blob.arrayBuffer());
Blob.bytes() reads contents as Uint8Array
The Blob class provides a .bytes() method that reads the contents of a Blob as a Uint8Array. This method is asynchronous and returns a promise.
Convert Buffer to ArrayBuffer using .buffer property
The Node.js Buffer class has a .buffer property that returns the underlying ArrayBuffer. Access it by calling the buffer property on a Buffer instance.
Buffer to ArrayBuffer conversion example
const nodeBuf = Buffer.alloc(64); const arrBuf = nodeBuf.buffer;
Uint8Array.buffer example with full buffer
To get an ArrayBuffer from a Uint8Array created with new Uint8Array(64), access the buffer property: arr.buffer returns ArrayBuffer(64).
Uint8Array subset view example with byteOffset and byteLength
For a Uint8Array created as new Uint8Array(new ArrayBuffer(64), 16, 32): arr.buffer returns ArrayBuffer(64), arr.byteOffset returns 16, and arr.byteLength returns 32.
Uint8Array as subset view with byteOffset and byteLength
When a Uint8Array is a view over a subset of an ArrayBuffer, the buffer property returns the entire underlying buffer, while byteOffset indicates the starting position of the view and byteLength indicates the length of the view. For example, new Uint8Array(new ArrayBuffer(64), 16, 32) creates a view starting at byte offset 16 with length 32 bytes over a 64-byte ArrayBuffer.
Uint8Array.buffer property returns underlying ArrayBuffer
A Uint8Array is a typed array and a view over data in an underlying ArrayBuffer. The buffer property on a Uint8Array returns that underlying ArrayBuffer.
Uint8Array and DataView share underlying ArrayBuffer
Both Uint8Array and DataView are views over the same underlying ArrayBuffer data. When converting between them, you can reference the same buffer, byteOffset, and byteLength to create a view over the same range of data.
Convert Uint8Array to ReadableStream - chunked streaming
To stream Uint8Array data in smaller chunks, first create a Blob instance from the Uint8Array, then use Blob.stream() to create a ReadableStream. This approach allows specifying a chunk size.
Convert Uint8Array to ReadableStream - naive approach
The naive approach to creating a ReadableStream from a Uint8Array is to use the ReadableStream constructor and enqueue the entire array as a single chunk. For large arrays, this may be undesirable because it doesn't stream the data in smaller chunks. Example: create new ReadableStream with a start function that calls controller.enqueue(arr) and controller.close().
Uint8Array to ReadableStream - chunked example
const arr = new Uint8Array(64); const blob = new Blob([arr]); const stream = blob.stream(1024); This example creates a ReadableStream from a Uint8Array with a chunk size of 1024 bytes.
TextDecoder for Uint8Array to string conversion
Bun implements the Web-standard TextDecoder class for converting binary data types like Uint8Array to strings. Create a TextDecoder instance and call its decode method with the Uint8Array to get a string result.
TextDecoder.decode example for Uint8Array
const arr = new Uint8Array([104, 101, 108, 108, 111]); const decoder = new TextDecoder(); const str = decoder.decode(arr); // => "hello" This example demonstrates converting a Uint8Array of byte values to a string using TextDecoder.
Convert ArrayBuffer to typed array
After reading a file to an ArrayBuffer using .arrayBuffer(), you can create a typed array such as Int8Array by passing the ArrayBuffer to the typed array constructor. The resulting typed array allows indexed access to individual bytes and provides a .length property.