Lodash isArrayBuffer in Cross-Frame Contexts
This article provides an overview of how the Lodash library
determines whether a value is an ArrayBuffer when operating
across different frames or realms. It examines why standard prototype
checks fail across distinct execution environments, explains the
underlying mechanism of _.isArrayBuffer, and details which
exact properties—such as Symbol.toStringTag versus
structural memory properties like byteLength—are inspected
during this evaluation.
In JavaScript, handling binary data across separate execution
contexts (such as <iframe> elements or Web Workers)
introduces prototype-sharing limitations. When an
ArrayBuffer is created inside an iframe, its prototype
chain points to that specific iframe's
ArrayBuffer.prototype. Evaluating that object in the parent
frame using buffer instanceof ArrayBuffer resolves to
false because the parent window and the iframe have
distinct global environments and constructor references.
To handle cross-frame data reliably, Lodash's
_.isArrayBuffer bypasses instanceof checks
entirely. Instead of querying structural memory buffer properties like
byteLength, byteOffset, or buffer manipulation
methods like slice, Lodash relies on object classification
via internal object tags. Lodash intentionally avoids duck-typing
properties such as byteLength because custom JavaScript
objects could easily mimic these properties, leading to false
positives.
Internally, _.isArrayBuffer first verifies that the
target value is object-like (meaning
typeof value === 'object' and value !== null).
In environments where Node.js native utility functions are not
available, Lodash delegates the classification to an internal helper,
baseGetTag.
During this check, the primary property queried is
Symbol.toStringTag. If the environment supports ES6
symbols, Lodash inspects whether the object possesses a custom
Symbol.toStringTag property. If a custom tag is present,
Lodash temporarily masks it to prevent spoofing and evaluates the
object's canonical tag using
Object.prototype.toString.call(value).
Through Object.prototype.toString, the JavaScript engine
inspects the object's internal [[ArrayBufferData]] slot
rather than any enumerable memory attributes. If the evaluated tag
matches '[object ArrayBuffer]', Lodash identifies the
object as an authentic buffer, regardless of which frame or window
context allocated the underlying memory.