Descubra qué son las matrices escritas y cómo utilizarlas
JavaScript Provides 8 Matriz con tipotipos:
Int8Array
una matriz de enteros con signo de 8 bitsInt16Array
una matriz de enteros de 16 bits con signoInt32Array
una matriz de enteros de 32 bits con signoUint8Array
una matriz de enteros sin signo de 8 bitsUint16Array
una matriz de enteros sin signo de 16 bitsUint32Array
una matriz de enteros sin signo de 32 bitsFloat32Array
una matriz de números de coma flotante de 32 bitsFloat64Array
una matriz de números de coma flotante de 64 bits
todos ellos sonArrayBufferView
instancias.
Una matriz con tipo es esencialmente una vista de unArrayBuffer
, donde todos los elementos tienen el mismo tamaño y tipo.
DataView
es otra vista en un ArrayBuffer, pero en este caso los elementos de la matriz pueden tener diferentes tamaños y tipos.
A continuación, se muestra un ejemplo de cómo crear una matriz de enteros con signo de 8 bits:
const a = new Int8Array()
Puede preasignar n bytes:
const bytes = 1024
const a = new Int8Array(bytes)
El uso principal es permitir ver un ArrayBuffer, que por sí solo es opaco (no podemos inspeccionar su contenido).
Así es como lo hacemos:
//we got this `buffer` ArrayBuffer
const a = new Int8Array(buffer)
Esas matrices escritas son similares a matrices, por lo que ahora podemos inspeccionar el contenido del búfer a través de las técnicas habituales de acceso a matrices, y tenemos acceso a muchos métodos y propiedades, incluyendomap()
,reduce()
etcétera.
El caso de uso principal de Typed Arrays es usar conWebGL,Audio webo laAPI de Canvas. Algunas de las funciones de WebGL esperan matrices escritas, ya que son mucho más eficaces que las matrices JavaScript normales.
Una cosa a tener en cuenta es que las matrices escritas no nos permiten controlar laendianidad:usa el orden de bytes de la plataforma. En general, esto funciona bien, porque el caso de uso principal, como dijimos, es usar la matriz localmente, usando una de las API multimedia. Además, la mayoría de las computadoras de consumo usan little endian ya que Intel usa esa convención. Pero, si transfiere los datos de un Typed Array en un sistema que usa big endian, es posible que los datos estén mal codificados y, por lo tanto, no sean válidos.
En caso de que necesite este tipo de control sobre la endianidad, utiliceDataViewen lugar de.
Descarga mi gratisManual para principiantes de JavaScript
Más tutoriales de navegador:
- Algunos trucos útiles disponibles en HTML5
- Cómo hice que un sitio web basado en CMS funcionara sin conexión
- La guía completa de aplicaciones web progresivas
- La API de Fetch
- La guía Push API
- La API de mensajería de canal
- Tutorial para trabajadores de servicios
- La guía de la API de caché
- La guía de la API de notificaciones
- Sumérjase en IndexedDB
- La API de selectores: querySelector y querySelectorAll
- Cargue JavaScript de forma eficiente con diferir y asincrónico
- El modelo de objetos de documento (DOM)
- La API de almacenamiento web: almacenamiento local y almacenamiento de sesiones
- Descubra cómo funcionan las cookies HTTP
- La API de historia
- El formato de imagen WebP
- XMLHttpRequest (XHR)
- Un tutorial detallado de SVG
- ¿Qué son las URL de datos?
- Hoja de ruta para aprender la plataforma web
- CORS, intercambio de recursos de origen cruzado
- Trabajadores web
- La guía requestAnimationFrame ()
- Que es el Doctype
- Trabajar con la consola de DevTools y la API de la consola
- La API de síntesis de voz
- Cómo esperar el evento DOM Ready en JavaScript simple
- Cómo agregar una clase a un elemento DOM
- Cómo recorrer los elementos DOM de querySelectorAll
- Cómo eliminar una clase de un elemento DOM
- Cómo comprobar si un elemento DOM tiene una clase
- Cómo cambiar un valor de nodo DOM
- Cómo agregar un evento de clic a una lista de elementos DOM devueltos por querySelectorAll
- WebRTC, la API web en tiempo real
- Cómo obtener la posición de desplazamiento de un elemento en JavaScript
- Cómo reemplazar un elemento DOM
- Cómo aceptar solo imágenes en un campo de archivo de entrada
- ¿Por qué utilizar una versión de vista previa de un navegador?
- El objeto Blob
- El objeto de archivo
- El objeto FileReader
- El objeto FileList
- ArrayBuffer
- ArrayBufferView
- El objeto URL
- Matrices escritas
- El objeto DataView
- La API BroadcastChannel
- La API de Streams
- El objeto FormData
- El objeto del navegador
- Cómo utilizar la API de geolocalización
- Cómo utilizar getUserMedia ()
- Cómo utilizar la API de arrastrar y soltar
- Cómo trabajar con el desplazamiento en páginas web
- Manejo de formularios en JavaScript
- Eventos de teclado
- Eventos del mouse
- Toque eventos
- Cómo eliminar a todos los hijos de un elemento DOM
- Cómo crear un atributo HTML usando Vanilla Javascript
- ¿Cómo verificar si una casilla de verificación está marcada usando JavaScript?
- Cómo copiar al portapapeles usando JavaScript
- Cómo deshabilitar un botón usando JavaScript
- Cómo hacer que una página sea editable en el navegador
- Cómo obtener valores de cadena de consulta en JavaScript con URLSearchParams
- Cómo eliminar todo el CSS de una página a la vez
- Cómo utilizar insertAdjectedHTML
- Safari, avisa antes de salir
- Cómo agregar una imagen al DOM usando JavaScript
- Cómo restablecer un formulario
- Cómo utilizar las fuentes de Google