JavaScript TypedArray의 byteOffset 속성 완벽 정리

TypedArray 객체의 byteOffset 속성은 해당 타입 배열이 기반이 되는 ArrayBuffer 내에서 시작 위치까지의 거리를 바이트 단위로 나타냅니다.

쉽게 말해, 버퍼 전체를 사용해 타입 배열을 생성하면 byteOffset은 0이 되지만, 특정 위치부터 뷰(view)를 생성한 경우에는 그 시작 지점의 바이트 값이 반환됩니다.

문법(Syntax)

byteOffset은 메서드가 아닌 속성이므로 호출 없이 그대로 참조하면 됩니다.

typedArray.byteOffset;

예제(Example)

<html>
<head>
    <title>JavaScript Example</title>
</head>
<body>
    <script type="text/javascript">
        var buffer = new ArrayBuffer(156);
        var float32 = new Float32Array(buffer);
        document.write(float32.byteOffset);
    </script>
</body>
</html>

출력 결과(Output)

위 예제에서는 ArrayBuffer(156) 전체를 사용하여 Float32Array를 생성했기 때문에 배열이 버퍼의 맨 앞에서 시작하며, 따라서 byteOffset 값은 0이 출력됩니다.

오프셋을 지정한 경우

반면, 생성자에 두 번째 인수로 시작 위치를 전달하면 해당 오프셋 값이 반환됩니다.

var buffer = new ArrayBuffer(156);
var float32 = new Float32Array(buffer, 8);

console.log(float32.byteOffset); // 8

이처럼 byteOffset 속성을 활용하면 하나의 ArrayBuffer를 여러 타입 배열이 공유할 때, 각 배열이 버퍼의 어느 지점부터 데이터를 읽고 쓰는지 정확히 파악할 수 있습니다.