Skip to content

이 페이지는 JavaScript 에서 바이너리 데이터를 작업하는 방법에 대한 소개입니다. Bun 은 바이너리 데이터 작업을 위한 여러 데이터 타입과 유틸리티를 구현하며, 대부분은 웹 표준입니다. Bun 고유의 API 는 별도로 명시합니다.

아래는 목차 역할도 하는 빠른 "치트 시트"입니다. 왼쪽 열의 항목을 클릭하면 해당 섹션으로 이동합니다.

클래스설명
TypedArray바이너리 데이터와 상호작용하기 위한 Array 유사 인터페이스를 제공하는 클래스 패밀리입니다. Uint8Array, Uint16Array, Int8Array 등이 포함됩니다.
Buffer다양한 편의 메서드를 구현하는 Uint8Array 의 서브클래스입니다. 이 표의 다른 요소들과 달리 이는 Node.js API 입니다 (Bun 이 구현함). 브라우저에서는 사용할 수 없습니다.
DataView특정 바이트 오프셋에서 ArrayBuffer 에 일정数量的 바이트를 쓰기 위한 get/set API 를 제공하는 클래스입니다. 주로 바이너리 프로토콜을 읽거나 쓸 때 사용됩니다.
Blob일반적으로 파일을 나타내는 읽기 전용 바이너리 데이터 블롭입니다. MIME type, sizeArrayBuffer, ReadableStream, 문자열로 변환하는 메서드를 가집니다.
File파일을 나타내는 Blob 의 서브클래스입니다. namelastModified 타임스탬프를 가집니다. Node.js v20 에서 실험적으로 지원됩니다.
BunFileBun 전용. 디스크의 지연 로딩 파일을 나타내는 Blob 의 서브클래스입니다. Bun.file(path) 로 생성됩니다.

ArrayBuffer 와 뷰

2009 년까지 JavaScript 에는 바이너리 데이터를 저장하고 조작하기 위한 언어 네이티브 방식이 없었습니다. ECMAScript v5 는 이를 위한 다양한 새로운 메커니즘을 도입했습니다. 가장 기본적인 구성 요소는 ArrayBuffer 로, 메모리의 바이트 시퀀스를 나타내는 간단한 데이터 구조입니다.

ts
// 이 버퍼는 8 바이트를 저장할 수 있습니다
const buf = new ArrayBuffer(8);

이름과 달리 이는 배열이 아니며 예상할 수 있는 배열 메서드와 연산자를 지원하지 않습니다. 실제로 ArrayBuffer 에서 값을 직접 읽거나 쓸 수 있는 방법은 없습니다. 크기를 확인하고 "슬라이스"를 생성하는 것 외에는 할 수 있는 일이 거의 없습니다.

ts
const buf = new ArrayBuffer(8);
buf.byteLength; // => 8

const slice = buf.slice(0, 4); // 새로운 ArrayBuffer 반환
slice.byteLength; // => 4

흥미로운 작업을 하려면 "뷰"라고 하는 구조가 필요합니다. 뷰는 ArrayBuffer 인스턴스를 래핑 하고 기본 데이터를 읽고 조작할 수 있게 해주는 클래스입니다. 뷰에는 타입 배열DataView 의 두 가지 유형이 있습니다.

DataView

DataView 클래스는 ArrayBuffer 의 데이터를 읽고 조작하기 위한 저수준 인터페이스입니다.

아래에서 새로운 DataView 를 생성하고 첫 번째 바이트를 3 으로 설정합니다.

ts
const buf = new ArrayBuffer(4);
// [0b00000000, 0b00000000, 0b00000000, 0b00000000]

const dv = new DataView(buf);
dv.setUint8(0, 3); // 바이트 오프셋 0 에 값 3 쓰기
dv.getUint8(0); // => 3
// [0b00000011, 0b00000000, 0b00000000, 0b00000000]

이제 바이트 오프셋 1Uint16 을 써보겠습니다. 이는 2 바이트가 필요합니다. 값 513 을 사용하는데, 이는 2 * 256 + 1입니다. 바이트로는 00000010 00000001입니다.

ts
dv.setUint16(1, 513);
// [0b00000011, 0b00000010, 0b00000001, 0b00000000]

console.log(dv.getUint16(1)); // => 513

이제 기본 ArrayBuffer 의 처음 3 바이트에 값을 할당했습니다. 두 번째와 세 번째 바이트는 setUint16() 을 사용하여 생성되었지만, 여전히 getUint8() 을 사용하여 각 구성 바이트를 읽을 수 있습니다.

ts
console.log(dv.getUint8(1)); // => 2
console.log(dv.getUint8(2)); // => 1

기본 ArrayBuffer 에서 사용 가능한 공간보다 더 많은 공간이 필요한 값을 쓰려고 하면 오류가 발생합니다. 아래에서는 8 바이트가 필요한 Float64 를 바이트 오프셋 0 에 쓰려고 하지만, 버퍼에는 총 4 바이트만 있습니다.

ts
dv.setFloat64(0, 3.1415);
// ^ RangeError: Out of bounds access

DataView 에서 다음 메서드를 사용할 수 있습니다.

게터세터
getBigInt64()setBigInt64()
getBigUint64()setBigUint64()
getFloat32()setFloat32()
getFloat64()setFloat64()
getInt16()setInt16()
getInt32()setInt32()
getInt8()setInt8()
getUint16()setUint16()
getUint32()setUint32()
getUint8()setUint8()

TypedArray

타입 배열은 ArrayBuffer 의 데이터와 상호작용하기 위한 Array 유사 인터페이스를 제공하는 클래스 패밀리입니다. DataView 가 특정 오프셋에서 다양한 크기의 숫자를 쓸 수 있게 해주는 반면, TypedArray 는 기본 바이트를 고정 크기의 숫자 배열로 해석합니다.

NOTE

이 클래스 패밀리를 공통 슈퍼클래스인 `TypedArray` 로 통칭하는 것이 일반적입니다. 이 클래스는 JavaScript 에 _내부적_ 으로 존재합니다. 직접 인스턴스를 생성할 수 없으며 `TypedArray` 는 전역 범위에 정의되어 있지 않습니다. `interface` 또는 추상 클래스로 생각하세요.
ts
const buffer = new ArrayBuffer(3);
const arr = new Uint8Array(buffer);

// 콘텐츠는 0 으로 초기화됩니다
console.log(arr); // Uint8Array(3) [0, 0, 0]

// 배열처럼 값 할당
arr[0] = 0;
arr[1] = 10;
arr[2] = 255;
arr[3] = 255; // 무효, 범위 밖

ArrayBuffer 가 제네릭 바이트 시퀀스인 반면, 이 타입 배열 클래스들은 바이트를 주어진 바이트 크기의 숫자 배열로 해석합니다. 상단 행에는 원시 바이트가 있고, 이후 행에는 다른 타입 배열 클래스를 사용하여 할 때 이 바이트가 어떻게 해석되는지 표시합니다.

다음 클래스들은 타입 배열이며, ArrayBuffer 의 바이트를 어떻게 해석하는지에 대한 설명입니다.

클래스설명
Uint8Array1 바이트마다 부호 없는 8 비트 정수로 해석됩니다. 범위는 0 에서 255 입니다.
Uint16Array2 바이트마다 부호 없는 16 비트 정수로 해석됩니다. 범위는 0 에서 65535 입니다.
Uint32Array4 바이트마다 부호 없는 32 비트 정수로 해석됩니다. 범위는 0 에서 4294967295 입니다.
Int8Array1 바이트마다 부호 있는 8 비트 정수로 해석됩니다. 범위는 -128 에서 127 입니다.
Int16Array2 바이트마다 부호 있는 16 비트 정수로 해석됩니다. 범위는 -32768 에서 32767 입니다.
Int32Array4 바이트마다 부호 있는 32 비트 정수로 해석됩니다. 범위는 -2147483648 에서 2147483647 입니다.
Float16Array2 바이트마다 16 비트 부동 소수점 숫자로 해석됩니다. 범위는 -6.104e5 에서 6.55e4 입니다.
Float32Array4 바이트마다 32 비트 부동 소수점 숫자로 해석됩니다. 범위는 -3.4e38 에서 3.4e38 입니다.
Float64Array8 바이트마다 64 비트 부동 소수점 숫자로 해석됩니다. 범위는 -1.7e308 에서 1.7e308 입니다.
BigInt64Array8 바이트마다 부호 있는 BigInt 로 해석됩니다. 범위는 -9223372036854775808 에서 9223372036854775807 입니다 (BigInt 는 더 큰 숫자를 나타낼 수 있음).
BigUint64Array8 바이트마다 부호 없는 BigInt 로 해석됩니다. 범위는 0 에서 18446744073709551615 입니다 (BigInt 는 더 큰 숫자를 나타낼 수 있음).
Uint8ClampedArrayUint8Array 와 동일하지만, 요소에 값을 할당할 때 0-255 범위로 자동으로 "클램프"됩니다.

아래 표는 다른 타입 배열 클래스를 사용하여 뷰할 때 ArrayBuffer 의 바이트가 어떻게 해석되는지 보여줍니다.

바이트 0바이트 1바이트 2바이트 3바이트 4바이트 5바이트 6바이트 7
ArrayBuffer0000000000000001000000100000001100000100000001010000011000000111
Uint8Array01234567
Uint16Array256 (1 * 256 + 0)770 (3 * 256 + 2)1284 (5 * 256 + 4)1798 (7 * 256 + 6)
Uint32Array50462976117835012
BigUint64Array506097522914230528n

사전 정의된 ArrayBuffer 에서 타입 배열을 생성하려면:

ts
// ArrayBuffer 에서 타입 배열 생성
const buf = new ArrayBuffer(10);
const arr = new Uint8Array(buf);

arr[0] = 30;
arr[1] = 60;

// 모든 요소는 0 으로 초기화됩니다
console.log(arr); // => Uint8Array(10) [ 30, 60, 0, 0, 0, 0, 0, 0, 0, 0 ];

이 동일한 ArrayBuffer 에서 Uint32Array 를 인스턴스화하려고 하면 오류가 발생합니다.

ts
const buf = new ArrayBuffer(10);
const arr = new Uint32Array(buf);
//          ^  RangeError: ArrayBuffer length minus the byteOffset
//             는 요소 크기의 배수가 아닙니다

Uint32 값은 4 바이트 (16 비트) 가 필요합니다. ArrayBuffer 가 10 바이트 길이이기 때문에 내용을 4 바이트 청크로 깔끔하게 나눌 수 없습니다.

이를 수정하려면 ArrayBuffer 의 특정 "슬라이스"에 대해 타입 배열을 생성할 수 있습니다. 아래 Uint16Array 는 기본 ArrayBuffer 8 바이트만 "뷰"합니다. 이를 위해 byteOffset0 으로, length2 로 지정합니다. 이는 배열이 포함하려는 Uint32 숫자의 개수를 나타냅니다.

ts
// ArrayBuffer 슬라이스에서 타입 배열 생성
const buf = new ArrayBuffer(10);
const arr = new Uint32Array(buf, 0, 2);

/*
  buf    _ _ _ _ _ _ _ _ _ _    10 바이트
  arr   [_______,_______]       2 개의 4 바이트 요소
*/

arr.byteOffset; // 0
arr.length; // 2

ArrayBuffer 인스턴스를 명시적으로 생성할 필요는 없습니다. 타입 배열 생성자에서 길이를 직접 지정할 수 있습니다.

ts
const arr2 = new Uint8Array(5);

// 모든 요소는 0 으로 초기화됩니다
// => Uint8Array(5) [0, 0, 0, 0, 0]

타입 배열은 숫자 배열이나 다른 타입 배열에서도 직접 인스턴스화할 수 있습니다.

ts
// 숫자 배열에서
const arr1 = new Uint8Array([0, 1, 2, 3, 4, 5, 6, 7]);
arr1[0]; // => 0;
arr1[7]; // => 7;

// 다른 타입 배열에서
const arr2 = new Uint8Array(arr);

일반적으로 타입 배열은 일반 배열과 동일한 메서드를 제공하지만 몇 가지 예외가 있습니다. 예를 들어 pushpop 은 타입 배열에서 사용할 수 없습니다. 기본 ArrayBuffer 의 크기 조정이 필요하기 때문입니다.

ts
const arr = new Uint8Array([0, 1, 2, 3, 4, 5, 6, 7]);

// 일반 배열 메서드 지원
arr.filter(n => n > 128); // Uint8Array(1) [255]
arr.map(n => n * 2); // Uint8Array(8) [0, 2, 4, 6, 8, 10, 12, 14]
arr.reduce((acc, n) => acc + n, 0); // 28
arr.forEach(n => console.log(n)); // 0 1 2 3 4 5 6 7
arr.every(n => n < 10); // true
arr.find(n => n > 5); // 6
arr.includes(5); // true
arr.indexOf(5); // 5

타입 배열의 속성과 메서드에 대한 자세한 내용은 MDN 문서 를 참조하세요.

Uint8Array

Uint8Array 는 구체적으로 강조할 가치가 있습니다. 0 에서 255 사이의 8 비트 부호 없는 정수 시퀀스인 고전적인 "바이트 배열"을 나타내기 때문입니다. 이는 JavaScript 에서 가장 흔히 접하는 타입 배열입니다.

Bun 에서, 그리고 향후 다른 JavaScript 엔진에서도 바이트 배열과 base64 또는 16 진수 문자열로 직렬화된 표현 간에 변환하는 메서드를 사용할 수 있습니다.

ts
new Uint8Array([1, 2, 3, 4, 5]).toBase64(); // "AQIDBA=="
Uint8Array.fromBase64("AQIDBA=="); // Uint8Array(4) [1, 2, 3, 4, 5]

new Uint8Array([255, 254, 253, 252, 251]).toHex(); // "fffefdfcfb"
Uint8Array.fromHex("fffefdfcfb"); // Uint8Array(5) [255, 254, 253, 252, 251]

이는 TextEncoder#encode 의 반환 값이며, TextDecoder#decode 의 입력 타입입니다. 이는 문자열과 다양한 바이너리 인코딩 (가장 주목할 것은 "utf-8") 간에 변환하도록 설계된 두 가지 유틸리티 클래스입니다.

ts
const encoder = new TextEncoder();
const bytes = encoder.encode("hello world");
// => Uint8Array(11) [ 104, 101, 108, 108, 111, 32, 119, 111, 114, 108, 100 ]

const decoder = new TextDecoder();
const text = decoder.decode(bytes);
// => hello world

Buffer

Bun 은 Buffer 를 구현합니다. 이는 JavaScript 명세에 타입 배열이 도입되기 전에 만들어진 바이너리 데이터 작업을 위한 Node.js API 입니다. 이후 Uint8Array 의 서브클래스로 재구현되었습니다. Array 유사 및 DataView 유사 메서드를 포함한 다양한 메서드를 제공합니다.

ts
const buf = Buffer.from("hello world");
// => Buffer(11) [ 104, 101, 108, 108, 111, 32, 119, 111, 114, 108, 100 ]

buf.length; // => 11
buf[0]; // => 104, 'h' 의 ascii
buf.writeUInt8(72, 0); // => 'H' 의 ascii

console.log(buf.toString());
// => Hello world

전체 문서는 Node.js 문서 를 참조하세요.

Blob

Blob 은 파일을 나타내는 데 일반적으로 사용되는 웹 API 입니다. Blob 은 처음에는 브라우저에서 구현되었습니다 (JavaScript 자체의 일부인 ArrayBuffer 와 달리). 이제 Node 와 Bun 에서도 지원됩니다.

Blob 인스턴스를 직접 생성하는 것은 일반적이지 않습니다. 대신 외부 소스 (예: 브라우저의 <input type="file"> 요소) 나 라이브러리에서 Blob 인스턴스를 받는 경우가 더 많습니다. 그렇지만 하나 이상의 문자열 또는 바이너리 "블롭 부분"에서 Blob 을 생성할 수 있습니다.

ts
const blob = new Blob(["<html>Hello</html>"], {
  type: "text/html",
});

blob.type; // => text/html
blob.size; // => 19

이러한 부분은 string, ArrayBuffer, TypedArray, DataView 또는 다른 Blob 인스턴스일 수 있습니다. 블롭 부분은 제공된 순서대로 연결됩니다.

ts
const blob = new Blob([
  "<html>",
  new Blob(["<body>"]),
  new Uint8Array([104, 101, 108, 108, 111]), // 바이너리의 "hello"
  "</body></html>",
]);

Blob 의 콘텐츠는 다양한 형식으로 비동기적으로 읽을 수 있습니다.

ts
await blob.text(); // => <html><body>hello</body></html>
await blob.bytes(); // => Uint8Array (콘텐츠 복사)
await blob.arrayBuffer(); // => ArrayBuffer (콘텐츠 복사)
await blob.stream(); // => ReadableStream

BunFile

BunFile 은 디스크의 지연 로딩 파일을 나타내는 데 사용되는 Blob 의 서브클래스입니다. File 과 마찬가지로 namelastModified 속성을 추가합니다. File 과 달리 파일을 메모리에 로드할 필요가 없습니다.

ts
const file = Bun.file("index.txt");
// => BunFile

File

FilenamelastModified 속성을 추가하는 Blob 의 서브클래스입니다. 브라우저에서 <input type="file"> 요소를 통해 업로드된 파일을 나타내는 데 일반적으로 사용됩니다. Node.js 와 Bun 은 File 을 구현합니다.

ts
// 브라우저에서!
// <input type="file" id="file" />

const files = document.getElementById("file").files;
// => File[]
ts
const file = new File(["<html>Hello</html>"], "index.html", {
  type: "text/html",
});

전체 문서는 MDN 문서 를 참조하세요.


스트림

스트림은 바이너리 데이터를 한 번에 모두 메모리에 로드하지 않고 작업하기 위한 중요한 추상화입니다. 파일 읽기 및 쓰기, 네트워크 요청 보내기 및 받기, 대량의 데이터 처리에 일반적으로 사용됩니다.

Bun 은 웹 API ReadableStreamWritableStream 을 구현합니다.

NOTE

Bun 은 또한 `node:stream` 모듈을 구현합니다. 이는 [`Readable`](https://nodejs.org/api/stream.html#stream_readable_streams), [`Writable`](https://nodejs.org/api/stream.html#stream_writable_streams) 및 [`Duplex`](https://nodejs.org/api/stream.html#stream_duplex_and_transform_streams) 를 포함합니다. 전체 문서는 Node.js 문서를 참조 하세요.

간단한 읽기 가능 스트림을 생성하려면:

ts
const stream = new ReadableStream({
  start(controller) {
    controller.enqueue("hello");
    controller.enqueue("world");
    controller.close();
  },
});

이 스트림의 콘텐츠는 for await 구문을 사용하여 청크별로 읽을 수 있습니다.

ts
for await (const chunk of stream) {
  console.log(chunk);
}

// => "hello"
// => "world"

Bun 의 스트림에 대한 더 완전한 논의는 API > 스트림 을 참조하세요.


변환

한 바이너리 형식에서 다른 형식으로 변환하는 것은 일반적인 작업입니다. 이 섹션은 참조용으로 제공됩니다.

ArrayBuffer 에서

ArrayBufferTypedArray 와 같은 다른 바이너리 구조의 기본 데이터를 저장하기 때문에, 아래 스니펫은 ArrayBuffer 에서 다른 형식으로 변환 하는 것이 아닙니다. 대신 기본 데이터에 저장된 데이터를 사용하여 새 인스턴스를 생성 하는 것입니다.

TypedArray

ts
new Uint8Array(buf);

DataView

ts
new DataView(buf);

Buffer

ts
// 전체 ArrayBuffer 에 Buffer 생성
Buffer.from(buf);

// ArrayBuffer 의 슬라이스에 Buffer 생성
Buffer.from(buf, 0, 10);

string 으로

UTF-8 로:

ts
new TextDecoder().decode(buf);

number[]

ts
Array.from(new Uint8Array(buf));

Blob 으로

ts
new Blob([buf], { type: "text/plain" });

ReadableStream 으로

다음 스니펫은 ReadableStream 을 생성하고 전체 ArrayBuffer 를 단일 청크로 인큐합니다.

ts
new ReadableStream({
  start(controller) {
    controller.enqueue(buf);
    controller.close();
  },
});

청킹과 함께">

ArrayBuffer 를 청크로 스트리밍하려면 Uint8Array 뷰를 사용하고 각 청크를 인큐합니다.

ts
const view = new Uint8Array(buf);
const chunkSize = 1024;

new ReadableStream({
  start(controller) {
    for (let i = 0; i < view.length; i += chunkSize) {
      controller.enqueue(view.slice(i, i + chunkSize));
    }
    controller.close();
  },
});

TypedArray 에서

ArrayBuffer

이는 기본 ArrayBuffer 를 가져옵니다. TypedArray 는 기본 버퍼의 슬라이스 뷰일 수 있으므로 크기가 다를 수 있습니다.

ts
arr.buffer;

DataView

TypedArray 와 동일한 바이트 범위에 DataView 를 생성하려면:

ts
new DataView(arr.buffer, arr.byteOffset, arr.byteLength);

Buffer

ts
Buffer.from(arr);

string 으로

UTF-8 로:

ts
new TextDecoder().decode(arr);

number[]

ts
Array.from(arr);

Blob 으로

ts
// arr 이 전체 백킹 TypedArray 의 뷰인 경우에만
new Blob([arr.buffer], { type: "text/plain" });

ReadableStream 으로

ts
new ReadableStream({
  start(controller) {
    controller.enqueue(arr);
    controller.close();
  },
});

청킹과 함께">

ArrayBuffer 를 청크로 스트리밍하려면 TypedArray 를 청크로 나누고 각각을 개별적으로 인큐합니다.

ts
new ReadableStream({
  start(controller) {
    for (let i = 0; i < arr.length; i += chunkSize) {
      controller.enqueue(arr.slice(i, i + chunkSize));
    }
    controller.close();
  },
});

DataView 에서

ArrayBuffer

ts
view.buffer;

TypedArray

DataViewbyteLengthTypedArray 서브클래스의 BYTES_PER_ELEMENT 의 배수인 경우에만 작동합니다.

ts
new Uint8Array(view.buffer, view.byteOffset, view.byteLength);
new Uint16Array(view.buffer, view.byteOffset, view.byteLength / 2);
new Uint32Array(view.buffer, view.byteOffset, view.byteLength / 4);
// 등등...

Buffer

ts
Buffer.from(view.buffer, view.byteOffset, view.byteLength);

string 으로

UTF-8 로:

ts
new TextDecoder().decode(view);

number[]

ts
Array.from(view);

Blob 으로

ts
new Blob([view.buffer], { type: "text/plain" });

ReadableStream 으로

ts
new ReadableStream({
  start(controller) {
    controller.enqueue(view.buffer);
    controller.close();
  },
});

청킹과 함께">

ArrayBuffer 를 청크로 스트리밍하려면 DataView 를 청크로 나누고 각각을 개별적으로 인큐합니다.

ts
new ReadableStream({
  start(controller) {
    for (let i = 0; i < view.byteLength; i += chunkSize) {
      controller.enqueue(view.buffer.slice(i, i + chunkSize));
    }
    controller.close();
  },
});

Buffer 에서

ArrayBuffer

ts
buf.buffer;

TypedArray

ts
new Uint8Array(buf);

DataView

ts
new DataView(buf.buffer, buf.byteOffset, buf.byteLength);

string 으로

UTF-8 로:

ts
buf.toString();

base64 로:

ts
buf.toString("base64");

16 진수로:

ts
buf.toString("hex");

number[]

ts
Array.from(buf);

Blob 으로

ts
new Blob([buf], { type: "text/plain" });

ReadableStream 으로

ts
new ReadableStream({
  start(controller) {
    controller.enqueue(buf);
    controller.close();
  },
});

청킹과 함께">

ArrayBuffer 를 청크로 스트리밍하려면 Buffer 를 청크로 나누고 각각을 개별적으로 인큐합니다.

ts
new ReadableStream({
  start(controller) {
    for (let i = 0; i < buf.length; i += chunkSize) {
      controller.enqueue(buf.slice(i, i + chunkSize));
    }
    controller.close();
  },
});

Blob 에서

ArrayBuffer

Blob 클래스는 이 목적으로 편의 메서드를 제공합니다.

ts
await blob.arrayBuffer();

TypedArray

ts
await blob.bytes();

DataView

ts
new DataView(await blob.arrayBuffer());

Buffer

ts
Buffer.from(await blob.arrayBuffer());

string 으로

UTF-8 로:

ts
await blob.text();

number[]

ts
Array.from(await blob.bytes());

ReadableStream 으로

ts
blob.stream();

ReadableStream 에서

ReadableStream 을 다른 형식으로 변환하기 쉽게 하기 위해 Response 를 편리한 중간 표현으로 사용하는 것이 일반적입니다.

ts
stream; // ReadableStream

const buffer = new Response(stream).arrayBuffer();

그러나 이 방식은 장황하고 불필요하게 전체 성능을 저하시키는 오버헤드를 추가합니다. Bun 은 ReadableStream 을 다양한 바이너리 형식으로 변환하기 위한 최적화된 편의 함수 세트를 구현합니다.

ArrayBuffer

ts
// Response 사용
new Response(stream).arrayBuffer();

// Bun 함수 사용
Bun.readableStreamToArrayBuffer(stream);

Uint8Array

ts
// Response 사용
new Response(stream).bytes();

// Bun 함수 사용
Bun.readableStreamToBytes(stream);

TypedArray

ts
// Response 사용
const buf = await new Response(stream).arrayBuffer();
new Int8Array(buf);

// Bun 함수 사용
new Int8Array(Bun.readableStreamToArrayBuffer(stream));

DataView

ts
// Response 사용
const buf = await new Response(stream).arrayBuffer();
new DataView(buf);

// Bun 함수 사용
new DataView(Bun.readableStreamToArrayBuffer(stream));

Buffer

ts
// Response 사용
const buf = await new Response(stream).arrayBuffer();
Buffer.from(buf);

// Bun 함수 사용
Buffer.from(Bun.readableStreamToArrayBuffer(stream));

string 으로

UTF-8 로:

ts
// Response 사용
await new Response(stream).text();

// Bun 함수 사용
await Bun.readableStreamToText(stream);

number[]

ts
// Response 사용
const arr = await new Response(stream).bytes();
Array.from(arr);

// Bun 함수 사용
Array.from(new Uint8Array(Bun.readableStreamToArrayBuffer(stream)));

Bun 은 ReadableStream 을 청크 배열로 해결하기 위한 유틸리티를 제공합니다. 각 청크는 문자열, 타입 배열 또는 ArrayBuffer 일 수 있습니다.

ts
// Bun 함수 사용
Bun.readableStreamToArray(stream);

Blob 으로

ts
new Response(stream).blob();

ReadableStream 으로

ReadableStream 을 독립적으로 소비할 수 있는 두 개의 스트림으로 분할하려면:

ts
const [a, b] = stream.tee();

Bun by www.bunjs.com.cn 편집