Javascript ArrayBuffer, wofür ist es?

74

Vielleicht ist es spät, oder vielleicht ist es der Grund , aber ich habe gerade die Dokumente für ArrayBuffer gelesen und kann mir keine einzige Sache vorstellen, für die es wirklich nützlich wäre.

Kann mich jemand aufklären?

Gibt es irgendwelche Verwendungszwecke, an die sich jeder erinnern kann, bei denen es sich nicht um Bilder handelt?

javascript mkoryak
quelle
Hmmm, es scheint, als würde node.js dies für IO-bezogenen Code auf niedriger Ebene lieben.
Corbin
4
Aus dem unbewussten Gedächtnis erinnere ich mich, dass solche Dinge verwendet werden, um Binärdaten (wie Binärdaten eines Bildes) zu speichern, um sie zu manipulieren und zu speichern / zu senden. Wenn Sie an einem Anwendungsprogramm arbeiten, wissen Sie, dass Puffer sehr nützlich sind. Und HTML 5 ist jetzt über die Webprogrammierung hinausgegangen ....
Imdad
Ich denke @Imdad ist richtig. Der HTML5-Canvas-Kontext verfügt über eine Methode, getImageDatadie viele Eigenschaften des gezeichneten Bildes zurückgibt, einschließlich einer buffervom Typ aufgerufenenArrayBuffer
Danilo Valente
Eine kleine Verwendung wird beschrieben unter @ developer.mozilla.org/en/JavaScript_typed_arrays
Imdad

Antworten:

61

Grundsätzlich wird ArrayBuffer verwendet, um Binärdaten zu speichern. Dies können beispielsweise die Binärdaten eines Bildes sein.

In anderen Sprachen haben sich Puffer als sehr nützlich erwiesen. Ja, natürlich ist es wenig schwierig zu verstehen / zu verwenden als andere Datentypen.

ArrayBuffer kann verwendet werden, um Daten von JPG-Bildern (RGB-Bytes) abzurufen und daraus ein PNG zu erzeugen, indem Alpha-Bytes (dh RGBA) hinzugefügt werden.

Die Mozilla-Site hat ArrayBuffer hier nur in geringem Umfang verwendet

Arbeiten mit komplexen Datenstrukturen

Durch Kombinieren eines einzelnen Puffers mit mehreren Ansichten unterschiedlicher Typen, beginnend mit unterschiedlichen Offsets im Puffer, können Sie mit Datenobjekten interagieren, die mehrere Datentypen enthalten. Auf diese Weise können Sie beispielsweise mit komplexen Datenstrukturen aus WebGL , Datendateien oder C-Strukturen interagieren , die Sie bei der Verwendung von js-ctypes verwenden müssen .

Betrachten Sie diese C-Struktur:

struct someStruct {  
  unsigned long id;  
  char username[16];  
  float amountDue;  
};

Sie können auf einen Puffer zugreifen, der Daten in diesem Format enthält:

var buffer = new ArrayBuffer(24);  

// ... read the data into the buffer ...  

var idView = new Uint32Array(buffer, 0, 1);  
var usernameView = new Uint8Array(buffer, 4, 16);  
var amountDueView = new Float32Array(buffer, 20, 1);

Dann können Sie beispielsweise auf den fälligen Betrag mit zugreifen amountDueView[0].

Hinweis: Die Ausrichtung der Datenstruktur in einer C-Struktur ist plattformabhängig. Treffen Sie Vorsichtsmaßnahmen und Überlegungen für diese Polsterungsunterschiede.

Imdad
quelle
2
Kann man also davon ausgehen, dass ein ArrayBuffer nicht erforderlich ist, wenn Sie bereits wissen, dass Sie beispielsweise mit reinen vorzeichenlosen 8-Bit-Daten arbeiten, können Sie auch ein Uint8Array erstellen und dieses ausfüllen? Was ist mit Blob und FileReader - sie scheinen auf ArrayBuffer zu funktionieren? Zumindest arbeite ich normalerweise so an Binärdateien in Javascript.
Johncl
Siehe den Link developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays
Imdad
Idview sollte 4 Bytes dauern, nicht 1
Royi Namir
Die Idee ist, dass der Längenparameter die Anzahl der Elemente und nicht die Bytes ist, gemessen am Beispiel. versuche es new Int32Array(Uint8Array.from([1,2,3,4]).buffer,0,1)zu testen.
Aiodintsov
3

Anders als Bilder ist es nützlich, um Netzwerkdatenpakete auf niedriger Ebene, die in Protokollen wie UDP verwendet werden, präzise zu erstellen und zu zerstören.

Jonathan
quelle
2

An ArrayBufferrepräsentiert Binärdaten im RAM. Sie können ein ArrayBufferzum Lesen und Schreiben entweder mit einem typisierten Array oder mit einem "öffnen" DataView.

Typisierte Arrays wie Uint16Arraykönnen den Puffer lesen und schreiben, indem sie ihn als ein einzelnes Array von Ganzzahlen behandeln. Sie lassen dich nicht die Endianness kontrollieren ; Es nutzt die native Endianness der Plattform. Die Verwendung Uint8Arrayist nützlich, um einzelne Bytes zu steuern (dies wird nicht durch Endianness beeinflusst).

DataViewist nicht so einfach, aber es gibt Ihnen viel mehr Kontrolle. Sie haben die volle Kontrolle über Endianness, Integer-Größe und Byte-Index (z. B. können Sie an einem Index auf eine 32-Bit-Integer zugreifen, auch wenn diese nicht durch 32 Bit teilbar ist). Diese Dinge können jedes Mal ausgewählt werden, wenn Sie eine Ganzzahl mit derselben lesen und schreiben DataView.

Dies kann hilfreich sein: https://javascript.info/arraybuffer-binary-arrays

Stumpfe Bananen
quelle