JavaScript ArrayBuffer.prototype.detached

Last Updated : 01 Apr, 2024

In JavaScript, the ArrayBuffer.prototype.detached property indicates whether an ArrayBuffer instance has been transferred (detached) from its current context. This is especially important for web workers when dealing with large binary data for communication.

Syntax

const isDetached = arrayBufferInstance.detached;

const buffer = new ArrayBuffer(16);  // Create an ArrayBuffer
const isDetached = buffer.detached;  // Check if buffer is detached
console.log(isDetached);  // Output: false

arrayBufferInstance: It is an existing ArrayBuffer object.
isDetached: It is a boolean value that represents the detached state.

Return Value

It will return true if detached otherwise false.

Example 1: The below example checks the detached state with property check.

JavaScript

function transferBufferToWorker(buffer) {
    // Simulate transferring the buffer to a worker
    return buffer;
    // This does not transfer the buffer in reality
}

const originalBuffer =
    new ArrayBuffer(10);
const transferredBuffer =
    transferBufferToWorker(originalBuffer);

// Property check to determine 
// if the buffer has been detached
if (transferredBuffer.byteLength === 0) {
    console.log("The buffer has been transferred and is detached.");
} else {
    console.log("The buffer remains in the current context.");
}

Output

The buffer remains in the current context.

Example 2: The below example ensure a detached state by the use of a utility function.

JavaScript

function transferBufferToWorker(buffer) {
    // Simulate transferring the buffer to a worker
    return buffer;
    // This does not transfer the buffer in reality
}

// Utility function to check if the buffer is detached
function isBufferDetached(buffer) {
    try {
        // Attempt to create a new view on the buffer
        new Uint8Array(buffer);
        // Buffer is not detached
        return false;
    } catch (error) {
        // Buffer is detached
        return true;
    }
}

const originalBuffer = new ArrayBuffer(10);
const transferredBuffer = transferBufferToWorker(originalBuffer);

// Check if the buffer is detached 
// using the utility function
if (isBufferDetached(transferredBuffer)) {
    console.log("The buffer has been transferred and is detached.");
} else {
    console.log("The buffer remains in the current context.");
}

Output

The buffer remains in the current context.

Browser Support

Chrome 114
Edge 114
Firefox 122
Opera 100
Safari 17.4

JavaScript ArrayBuffer.prototype.detached

pankajbind

Improve

Article Tags :

JavaScript ArrayBuffer.prototype.detached

Syntax

Return Value

Browser Support

Similar Reads

Thank You!

What kind of Experience do you want to share?