🚀 Nuova versione beta disponibile! Feedback o problemi? Contattaci

Typed Arrays in JavaScript

Codegrind Team•Aug 23 2024

I Typed Arrays in JavaScript sono una potente struttura dati introdotta con ECMAScript 2015 (ES6), progettata per gestire array di dati binari in modo efficiente. Sono particolarmente utili per lavorare con buffer di memoria, manipolare file binari e gestire dati a basso livello, come immagini, audio e altri formati di dati complessi. In questa guida esploreremo cosa sono i Typed Arrays, come funzionano e come utilizzarli per gestire dati binari in JavaScript.

Cos’è un Typed Array?

Un Typed Array è un array che contiene solo un tipo specifico di dati, come numeri interi, numeri in virgola mobile o numeri interi senza segno. Questo è in contrasto con i normali array JavaScript, che possono contenere valori di tipi diversi. I Typed Arrays offrono un accesso diretto alla memoria sottostante, permettendo di gestire i dati binari con un’efficienza simile a quella dei linguaggi di programmazione a basso livello come C o C++.

Tipi di Typed Arrays

Ecco alcuni dei principali Typed Arrays disponibili in JavaScript:

  • Int8Array: Array di numeri interi a 8 bit con segno.
  • Uint8Array: Array di numeri interi a 8 bit senza segno.
  • Int16Array: Array di numeri interi a 16 bit con segno.
  • Uint16Array: Array di numeri interi a 16 bit senza segno.
  • Int32Array: Array di numeri interi a 32 bit con segno.
  • Uint32Array: Array di numeri interi a 32 bit senza segno.
  • Float32Array: Array di numeri in virgola mobile a 32 bit.
  • Float64Array: Array di numeri in virgola mobile a 64 bit.

Creazione di Typed Arrays

Creazione da una Dimensione Specifica

Puoi creare un Typed Array specificando la dimensione (numero di elementi) desiderata. Tutti gli elementi vengono inizialmente impostati a zero.

Esempio

let intArray = new Int16Array(5); // Crea un array di 5 numeri interi a 16 bit
console.log(intArray); // Output: Int16Array(5) [0, 0, 0, 0, 0]

Creazione da un Array Normale

Puoi anche creare un Typed Array partendo da un array JavaScript normale.

Esempio

let normaleArray = [10, 20, 30];
let floatArray = new Float32Array(normaleArray);
console.log(floatArray); // Output: Float32Array(3) [10, 20, 30]

Creazione da un Buffer di Memoria

Un’altra potente caratteristica dei Typed Arrays è la capacità di creare array basati su un buffer di memoria. Questo permette di gestire i dati a un livello molto basso.

Esempio

let buffer = new ArrayBuffer(8); // Crea un buffer di 8 byte
let view = new Int32Array(buffer); // Crea un Int32Array che usa questo buffer

view[0] = 42;
console.log(view[0]); // Output: 42

Accesso e Manipolazione di Dati nei Typed Arrays

I Typed Arrays offrono metodi simili agli array normali per l’accesso e la manipolazione dei dati, come length, set, subarray, e molti altri.

Esempio di Accesso e Modifica

let uint8 = new Uint8Array(4); // Crea un array di 4 byte
uint8[0] = 255;
uint8[1] = 128;
uint8[2] = 64;
uint8[3] = 32;

console.log(uint8); // Output: Uint8Array(4) [255, 128, 64, 32]

Metodi di Manipolazione

  • set(): Permette di copiare valori da un array in un Typed Array.

Esempio

let intArray = new Int16Array(4);
intArray.set([10, 20, 30], 1); // Copia valori a partire dall'indice 1
console.log(intArray); // Output: Int16Array(4) [0, 10, 20, 30]
  • subarray(): Crea una vista su una porzione di un Typed Array.

Esempio

let floatArray = new Float32Array([1.0, 2.0, 3.0, 4.0]);
let subArray = floatArray.subarray(1, 3);
console.log(subArray); // Output: Float32Array(2) [2.0, 3.0]

Uso di ArrayBuffer e DataView

ArrayBuffer

Un ArrayBuffer è un oggetto che rappresenta un blocco di memoria grezza. Non contiene direttamente i dati, ma piuttosto li memorizza in una forma binaria grezza. I Typed Arrays e DataViews vengono utilizzati per leggere e scrivere i dati in un ArrayBuffer.

DataView

DataView è un’interfaccia che permette di leggere e scrivere dati di qualsiasi tipo in un ArrayBuffer, offrendo maggiore flessibilità rispetto ai Typed Arrays.

Esempio di Uso di DataView

let buffer = new ArrayBuffer(4);
let view = new DataView(buffer);

view.setInt8(0, 127);
view.setInt8(1, -128);
view.setUint16(2, 65535);

console.log(view.getInt8(0)); // Output: 127
console.log(view.getInt8(1)); // Output: -128
console.log(view.getUint16(2)); // Output: 65535

Applicazioni Comuni dei Typed Arrays

1. Manipolazione di Dati Binari

I Typed Arrays sono ideali per lavorare con dati binari, come file binari, immagini, audio, e altre risorse multimediali.

2. WebGL

Nelle applicazioni grafiche, come quelle basate su WebGL, i Typed Arrays sono utilizzati per gestire dati come coordinate dei vertici, colori e texture in modo efficiente.

3. Network e File I/O

I Typed Arrays possono essere utilizzati per manipolare pacchetti di rete o per leggere e scrivere file binari, grazie alla loro capacitĂ  di gestire dati binari grezzi.

Best Practices per l’Uso dei Typed Arrays

  • Scegli il Tipo Giusto: Utilizza il Typed Array piĂą adatto ai dati che devi gestire. Ad esempio, usa Uint8Array per dati binari semplici o Float32Array per valori in virgola mobile.
  • Attenzione alla Finezza dei Dati: Quando lavori con buffer di memoria, assicurati di comprendere come vengono memorizzati e recuperati i dati, specialmente con tipi come DataView.
  • Ottimizza l’Allocazione della Memoria: Evita di riallocare buffer e Typed Arrays frequentemente per migliorare le prestazioni.

Conclusione

I Typed Arrays in JavaScript forniscono una potente interfaccia per gestire dati binari in modo efficiente e con prestazioni elevate. Utilizzandoli insieme a ArrayBuffer e DataView, puoi manipolare direttamente la memoria e gestire dati complessi come file, immagini e stream di rete. Comprendere e utilizzare correttamente i Typed Arrays ti permette di sfruttare al massimo le capacitĂ  di JavaScript in contesti che richiedono un controllo dettagliato sui dati binari.