Viewing: zh.javascript.info

Web

JavaScript

ArrayBufferUint8ArrayDataViewBlobFile

JavaScript

ArrayBuffer

let buffer = new ArrayBuffer(16); //  16  buffer
alert(buffer.byteLength); // 16

16 0

ArrayBuffer Array

buffer[index]

ArrayBuffer

ArrayBuffer

ArrayBuffer

Uint8Array ArrayBuffer 0 255 8 8
Uint16Array 2 0 65535 16
Uint32Array 4 0 4294967295 32
Float64Array 8 5.0x10-324 1.8x10308

16 ArrayBuffer 16 8 2 4 4 2 8

[]

ArrayBuffer

view

let buffer = new ArrayBuffer(16); //  16  buffer

let view = new Uint32Array(buffer); //  buffer  32 

alert(Uint32Array.BYTES_PER_ELEMENT); //  4 

alert(view.length); // 4 4 
alert(view.byteLength); // 16

// 
view[0] = 123456;

// 
for(let num of view) {
  alert(num); // 123456 000 4 
}

TypedArray

Uint8ArrayUint32Array TypedArray

TypedArray ArrayBuffer Int8ArrayUint8Array

new TypedArray new Int8Arraynew Uint8Array

Int8Array Float64Array

          new TypedArray(buffer, [byteOffset], [length]);
new TypedArray(object);
new TypedArray(typedArray);
new TypedArray(length);
new TypedArray();
        

ArrayBuffer

byteOffset 0 length buffer buffer

Array

let arr = new Uint8Array([0, 1, 2, 3]);
alert( arr.length ); // 4
alert( arr[1] ); // 1 4  8

TypedArray

let arr16 = new Uint16Array([1, 1000]);
let arr8 = new Uint8Array(arr16);
alert( arr8[0] ); // 1
alert( arr8[1] ); // 232 1000 1000  8

length length TypedArray.BYTES_PER_ELEMENT

let arr = new Uint16Array(4); //  4 
alert( Uint16Array.BYTES_PER_ELEMENT ); //  2 
alert( arr.byteLength ); // 8

TypedArray ArrayBuffer ArrayBuffer ArrayBuffer ArrayBuffer

ArrayBuffer TypedArray

arr.buffer ArrayBuffer
arr.byteLength ArrayBuffer

          let arr8 = new Uint8Array([0, 1, 2, 3]);

// 
let arr16 = new Uint16Array(arr8.buffer);
        

Uint8ArrayUint16ArrayUint32Array 816 32
- Uint8ClampedArray 8
Int8ArrayInt16ArrayInt32Array
Float32ArrayFloat64Array 32 64

Int8Array JavaScript int int8

Int8Array ArrayBuffer

256 Uint8Array256 1000000009 Uint8Array 8 0 255

[]

257 1000000019 8 1

[]

let uint8array = new Uint8Array(16);

let num = 256;
alert(num.toString(2)); // 100000000

uint8array[0] = 256;
uint8array[1] = 257;

alert(uint8array[0]); // 0
alert(uint8array[1]); // 1

Uint8ClampedArray 255 255 0

TypedArray

TypedArray Array

iteratemapslicefind reduce

splice bufferbuffer
concat

arr.set(fromArr, [offset]) offset 0 fromArr arr
arr.subarray([begin, end]) begin end slice

DataView

DataView ArrayBuffer offset

i arr[i]
DataView .getUint8(i) .getUint16(i)

new DataView(buffer, [byteOffset], [byteLength])

buffer ArrayBufferDataView buffer
byteOffset 0
byteLength buffer

buffer

// 4  255
let buffer = new Uint8Array([255, 255, 255, 255]).buffer;

let dataView = new DataView(buffer);

//  0  8 
alert( dataView.getUint8(0) ); // 255

//  0  16  2  65535
alert( dataView.getUint16(0) ); // 65535 16 

//  0  32 
alert( dataView.getUint32(0) ); // 4294967295 32 

dataView.setUint32(0, 0); //  4  0 0

bufferDataView 16 32 DataView

ArrayBuffer

TypedArray
- Uint8ArrayUint16ArrayUint32Array 8 16 32
- Uint8ClampedArray 8
- Int8ArrayInt16ArrayInt32Array
- Float32ArrayFloat64Array 32 64
DataView getUint8(offset)

ArrayBuffer common denominator .buffer

ArrayBufferView
BufferSource ArrayBuffer ArrayBufferView

BufferSource ArrayBuffer

[]

Uint8Array concat(arrays)

          function concat(arrays) {
  // sum of individual array lengths
  let totalLength = arrays.reduce((acc, value) => acc + value.length, 0);

  let result = new Uint8Array(totalLength);

  if (!arrays.length) return result;

  // for each array - copy it over result
  // next array is copied right after the previous one
  let length = 0;
  for(let array of arrays) {
    result.set(array, length);
    length += array.length;
  }

  return result;
}
        