자바스크립트의 ArrayBuffer.isView() 메서드는 전달된 매개변수 값이 ArrayBuffer 뷰(view)인지 아닌지를 판별해 주는 정적 메서드입니다.
여기서 ArrayBuffer 뷰란 TypedArray(Uint8Array, Int16Array 등)나 DataView처럼 ArrayBuffer 내부의 바이너리 데이터를 읽고 쓸 수 있도록 해주는 객체를 의미합니다. 따라서 이 메서드는 인자가 뷰 객체이면 true, 그렇지 않으면 false를 반환합니다.
주요 특징
- ArrayBuffer.isView()는 정적(static) 메서드이므로 ArrayBuffer 인스턴스가 아닌 ArrayBuffer 생성자에서 직접 호출합니다.
- TypedArray 및 DataView 객체에 대해서는 true를 반환합니다.
- ArrayBuffer 자체, 문자열, 숫자 등 일반 값에 대해서는 false를 반환합니다.
예제 코드
다음은 ArrayBuffer.isView() 메서드의 동작을 확인하는 예제입니다 −
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.sample {
font-size: 20px;
font-weight: 500;
}
</style>
</head>
<body>
<h1>JavaScript ArrayBuffer.byteLength property</h1>
<div class="sample"></div>
<button class="Btn">CLICK HERE</button>
<h3>Click on the above button to check the above value is array buffer view or not</h3>
<script>
let fillEle = document.querySelector(".sample");
var buffer = new ArrayBuffer(8);
var view1 = new DataView(buffer);
view1.setInt16(0, 0x2721);
fillEle.innerHTML = view1.getInt16(0).toString(16);
document.querySelector(".Btn").addEventListener("click", () => {
fillEle.innerHTML =
"The view1 is array buffer view: " + ArrayBuffer.isView(view1);
});
</script>
</body>
</html>코드 설명
- 먼저
new ArrayBuffer(8)로 8바이트 크기의 버퍼를 생성합니다. - 이 버퍼 위에
DataView객체인 view1을 만들어 데이터를 조작할 수 있는 뷰를 확보합니다. setInt16()으로 0번째 오프셋에 16진수 값 0x2721을 저장하고,getInt16()으로 값을 읽어 16진수 문자열로 화면에 출력합니다.- 버튼을 클릭하면
ArrayBuffer.isView(view1)의 결과가 화면에 표시됩니다.
실행 결과
페이지를 처음 열면 view1에 저장된 값이 16진수 형태로 표시됩니다.
"CLICK HERE" 버튼을 클릭하면 −
view1은 DataView 객체, 즉 ArrayBuffer 뷰이므로 다음과 같은 결과가 출력됩니다.
The view1 is array buffer view: true
만약 일반 값이나 ArrayBuffer 자체를 인자로 전달했다면 false가 반환되었을 것입니다. 이처럼 ArrayBuffer.isView() 메서드는 어떤 객체가 실제로 ArrayBuffer의 뷰인지 손쉽게 검증할 때 유용하게 활용됩니다.