Resize ArrayBuffer

2020-06-12 05:05发布

问题:

If I want to create an arraybuffer, I write: var buff = new ArrayBuffer(size)

But how is it possible to resize an existing buffer? I mean, adding some more bytes at the end of the buffer.

回答1:

var buff = new ArrayBuffer(32);
buff[31] = 43;
var newBuff = new ArrayBuffer(buff.byteLength*2);

for (var i=0;i<buff.byteLength;i++){
    newBuff[i] = buff[i];
}

buff = newBuff;

I've done it in C++ like this. Just made a bigger array and copy the contents over and then return the larger array and set it as the original.



回答2:

No set on the ArrayBuffer itself. There is set on the TypedArray though. Use like this:

var oldBuffer = new ArrayBuffer(20);

var newBuffer = new ArrayBuffer(40);
new Uint8Array(newBuffer).set(oldBuffer);


回答3:

The way to do that would be ArrayBuffer.transfer(oldBuffer, newByteLength), like so:

var buffA = new ArrayBuffer(30);
var buffB = ArrayBuffer.transfer(buffA, 40);

// buffA is now an empty array buffer (`buffA.byteLength === 0`)
// whereas buffB is a new buffer that starts with a's contents
// and ends with 10 bytes that are 0s.

// Much faster than manually copying. You could even just do:

var buffA = new ArrayBuffer(30);
buffA = ArrayBuffer.transfer(buffA, 40);

// Or as a prototype method

ArrayBuffer.prototype.resize = function(newByteLength) {
    return ArrayBuffer.transfer(this, newByteLength);
}

var buffA = new ArrayBuffer(30);
buffA = buffA.resize(40);

However (as of October 2017) there is 0% browser support (not even Node.js support) and is not even drafted yet.


Until this is available, you can use the polyfill given on the page, which copies 8 bytes at a time, so is relatively quick for large arrays (Though it does not empty the given array, which is impossible to do).

Here is a modified version using TypeArray.prototype.set instead of for loops:

if (!ArrayBuffer.transfer) {
  ArrayBuffer.transfer = function(oldBuffer, newByteLength) {
    var srcBuffer = Object(oldBuffer);
    var destBuffer = new ArrayBuffer(newByteLength);
    if (!(srcBuffer instanceof ArrayBuffer) || !(destBuffer instanceof ArrayBuffer)) {
      throw new TypeError('Source and destination must be ArrayBuffer instances');
    }
    var copylen = Math.min(srcBuffer.byteLength, destBuffer.byteLength);

    /* Copy 8 bytes at a time */
    var length = Math.trunc(copylen / 64);
    (new Float64Array(destBuffer, 0, length))
      .set(new Float64Array(srcBuffer, 0, length));

    /* Copy the remaining 0 to 7 bytes, 1 byte at a time */
    var offset = length * 64;
    length = copylen - offset;
    (new Uint8Array(srcBuffer, offset, length))
      .set(new Uint8Array(destBuffer, offset, length));

    return destBuffer;
  };
}


回答4:

You can't.

From the MDN :

The ArrayBuffer is a data type that is used to represent a generic, fixed-length binary data buffer.

I don't know what you try to do but obviously you don't use them how they're meant to be used.

This page is a good starting point to learn how to use typed arrays in JavaScript.



回答5:

What you are looking for is the "set" method. After creating a new, larger array, simply call the set function and copy over the older content.