Creo que cada alumno de JavaScript comprenderá varios tipos de datos básicos de JS. Las matrices son combinaciones de datos. Este es un concepto muy básico y simple. No tiene mucho contenido, y no es difícil aprenderlo bien. Pero lo importante en este artículo no es la matriz que generalmente vemos, sino el ArrayBuffer.
Muchas de las cosas que escribí se resumen deliberadamente porque quieren completar ciertas funciones específicas. ¡Pueden ser considerados como memorandos, y lo mismo es cierto para este artículo! He estado estudiando el conocimiento relacionado con la API de audio web y la comunicación de voz hace algún tiempo. El contenido se centra en el flujo de transmisiones de audio entre varios nodos de AudioContext. Ahora necesito entender qué tipo de formato de datos es el audio a la transmisión, por lo que la investigación en ArrayBuffer es particularmente importante.
Modelo de pila de matriz en la memoria
Adquisición de Array
Cómo generar una matriz en JavaScript:
La copia del código es la siguiente:
[Element0, Element1, ..., Elemn]
nueva matriz (Element0, Element1, ..., elementn)
nueva matriz (ArrayLength)
Defínelo directamente o cree una matriz a través del constructor, por supuesto, también puede usar otros medios:
La copia del código es la siguiente:
"array" .split ("");
"matriz" .match (/a | r/g);
Espera, hay muchas maneras. Pero me temo que muchas personas no están muy claras sobre qué tipo de estructura está dentro de la matriz.
Modelo de pila
En la matriz podemos poner muchos datos de diferentes tipos de datos, como:
La copia del código es la siguiente:
var arr = [21, "li jing", nueva fecha (), function () {} ,, null];
La matriz anterior contiene números, cadenas, objetos, funciones, indefinidos y nulos a la vez. Podemos describir la interfaz de datos anterior de manera concreta:
La copia del código es la siguiente:
Pila
+------------------------------------------------------------------------------------------------------------------------------
| 21 | +---------------------------+
+ ----------+ | |
| "Li Jing" | | |
+ ----------+ | + ---------+ |
| [referir] | -----------> | Objeto | |
+ ----------+ | + ---------+ |
| [referir] | ------------------>+ ---------+ |
+ ----------+ | | Función | |
| Undefinado | | + ---------+ |
+ ----------+ | |
| NULL | +-------------------------++
+ -----------+ creado por Barret Lee
Los tipos de datos de JavaScript se dividen en dos tipos, uno es el tipo de valor y el otro es el tipo de referencia. Los tipos de referencia comunes incluyen objeto y matriz. En el modelo de almacenamiento de la matriz, si los datos de tipo de valor son como el número y la cadena, los datos se empujarán directamente a la pila, mientras que el tipo de referencia solo se impulsará a un índice del valor. El concepto de lenguaje C es solo guardar el puntero de los datos, y estos datos se almacenan en un cierto bloque del montón. La pila no es independiente, y la pila también se puede almacenar en la pila.
Bien, eso es todo para la explicación de la matriz. Hablemos sobre el conocimiento relevante de ArrayBuffer en detalle.
Arraybuffer
¿Cuál es la web? ¿Cuál es el problema más básico que la web necesita discutir? Creo que hay dos puntos: uno es datos y el otro es la transmisión de datos. En cuanto a la visualización de datos, es complicado y esto debería ser algo en la capa superior de la web. El ArrayBuffer que se discutirá en este artículo es el tipo de datos más básico, y ni siquiera se puede llamar tipo de datos. Es fácil de leer y escribir de otras maneras.
Definición de puntos oficiales:
ArrayBuffer es un tipo de datos que se utiliza para representar un búfer genérico de datos binarios de longitud fija. No puedes manipular directamente el contenido de un ArrayBuffer; En su lugar, crea un objeto ArrayBufferview que representa el búfer en un formato específico, y usalo para leer y escribir el contenido del búfer.
El búfer original que representa datos binarios, que se utiliza para almacenar datos de varios tipos de matrices. El ArrayBuffer no se puede leer o escribir directamente, pero se puede pasar a una matriz escrita o objeto DataView según sea necesario para interpretar el búfer original.
Es un búfer en bruto de datos binarios. Aunque JavaScript es un lenguaje de tipo débil, tiene limitaciones en el tipo y el tamaño de los datos. Necesitamos leer el contenido del búfer de manera ordenada (escríbalo) a través de una determinada estructura de datos.
Creación de búfer original
El constructor ArrayBuffer puede crear un búfer en bruto:
La copia del código es la siguiente:
var buffer = new ArrayBuffer (30);
Desde la consola Chrome puedes ver:
La instancia del búfer tiene un atributo de longitud de bytel, que se usa para obtener el tamaño del búfer, un método de corte que solo es compatible con IE11+ e iOS6+, que se usa para interceptar la longitud del búfer.
La copia del código es la siguiente:
ArrayBuffer Slice (
comienzo de larga duración
Opcional de extremo largo sin firmar
);
Puedes probar esta demostración:
La copia del código es la siguiente:
var buffer = new ArrayBuffer (12);
var x = nuevo int32Array (búfer);
x [1] = 1234;
var slice = buffer.slice (4);
var y = new Int32Array (Slice);
console.log (x [1]);
console.log (y [0]);
x [1] = 6789;
console.log (x [1]);
console.log (y [0]);
Matrices basadas en datos
Los tipos de matriz mecanografiados representan varias vistas de los objetos ArrayBuffer indexables y manipulados. Todos los tipos de matriz tienen longitudes fijas.
La copia del código es la siguiente:
Tamaño de nombre (en bytes) Descripción
Int8Array 1 Integer firmado de 8 bits de 8 bits
Uint8array 1 Integer Unsigned de 8 bits
INT16Array 2 Complemento de 16 bits de 16 bits Integer firmado
UINT16Array 2 Integer Unsigned de 16 bits
Int32array 4 complemento de 32 bits dos firmado entero firmado
UINT32Array 4 32 bits Unsigned entero
Float32Array 4 Número de punto flotante IEEE de 32 bits
Float64Array 8 Número de punto flotante IEEE de 64 bits
Int es un entero, Uint es un plástico sin firmar y Float es un tipo de punto flotante. Estos son los conceptos básicos en el lenguaje C, por lo que no los explicaré en detalle. Dado que estas estructuras vistas son similares, este artículo solo explica el tipo Float32Array, y los lectores pueden aprender de él uno por uno.
Float32Array es muy similar a la matriz, excepto que cada elemento es un punto flotante de 32 bits (4 bytes). Float32Array una vez creado, su tamaño no se puede modificar.
Podemos crear un Float32Array directamente:
La copia del código es la siguiente:
var x = nuevo float32Array (2);
x [0] = 17;
console.log (x [0]); // 17
console.log (x [1]); // 0
console.log (x.length); // 2
Debe haber un concepto de que todavía sea una matriz, pero cada elemento en la matriz es un tipo de datos flotante de 32 bits, por ejemplo:
La copia del código es la siguiente:
var x = new float32Array ([17, -45.3]);
console.log (x [0]); // 17
console.log (x [1]); // -45.299999923706055
console.log (x.length); // 2
Asignamos el valor de una matriz directamente a x, el objeto Float32Array, y luego se convertirá en un número de punto flotante de 32 bits antes del almacenamiento.
Dado que cada elemento de esta matriz de clase es del mismo tipo, en el modelo de pila, todos serán empujados a la pila. Por lo tanto, la matriz de datos data es un tipo de valor, ¡y no es un tipo de referencia! Esto debe tenerse en cuenta y también se puede reflejar en los siguientes ejemplos:
La copia del código es la siguiente:
var x = new float32Array ([17, -45.3]);
var y = nuevo float32Array (x);
console.log (x [0]); // 17
console.log (x [1]); //-45.29999923706055
console.log (x.length); // 2
x [0] = -2;
console.log (y [0]); // 17, el valor de y no ha cambiado
Copie el valor de x a y, modifique x [0], y [0] y no hay cambios.
Además del método anterior, también podemos crear una matriz datos de otras maneras:
La copia del código es la siguiente:
var buffer = new ArrayBuffer (12);
var x = nuevo float32Array (buffer, 0, 2);
var y = nuevo float32Array (búfer, 4, 1);
x [1] = 7;
console.log (y [0]); // 7
Explique por qué 7 se devuelve aquí.
La copia del código es la siguiente:
ArrayBuffer (12)
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
| 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | | | | | |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
/ /
X (Float32Array)
Compensación: 0
Bytelength: 4
Longitud: 2
ArrayBuffer (12)
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
| 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | | | | | |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
/ /
Y
Creado por Barret Lee
¿Todavía tiene alguna pregunta después de leer la ilustración anterior? No creo que necesite seguir explicando. La unidad de ArrayBuffer puede considerarse 1, mientras que la unidad de Float32Array es 4.
Objeto DataView
El objeto DataView opera datos más meticulosamente, pero no creo que sea interesante. Las diversas matrices basadas en datos mencionadas anteriormente pueden satisfacer básicamente la aplicación, por lo que la mencionaré aquí, un ejemplo simple:
La copia del código es la siguiente:
var buffer = new ArrayBuffer (12);
var x = nuevo DataView (buffer, 0);
X.SetInt8 (0, 22);
X.SetFloat32 (1, Math.pi);
console.log (x.getInt8 (0)); // 22
console.log (x.getfloat32 (1)); // 3.1415927410125732
Si está interesado, puede mudarse a http://www.javascripture.com/dataview para obtener información detallada.
ArrayBuffer en XHR2
ArrayBuffer es particularmente ampliamente utilizado. Ya sea WebSocket, WebAudio, AJAX, etc., siempre que el proceso frontal Big Data o que mejore el rendimiento del procesamiento de datos, ArrayBuffer debe ser indispensable.
XHR2 no es nuevo. Es posible que haya utilizado funciones relevantes, pero no sabe que esto es lo que es XHR2. Lo más importante es XHR.ResponseSetype, que se utiliza para establecer el formato de datos de la respuesta. Los parámetros opcionales son: "Texto", "ArrayBuffer", "Blob" o "Documento". Tenga en cuenta que configurar (o ignorar) xhr.ResponseType = '' establecerá la respuesta a "texto" de forma predeterminada. Hay una relación correspondiente como esta:
La copia del código es la siguiente:
Respuesta de solicitud
texto domstring
arraybuffer arraybuffer
gota
documento de documento
Toma una castaña:
La copia del código es la siguiente:
var xhr = new xmlhttprequest ();
xhr.open ('get', '/path/to/image.png', true);
xhr.ResponseType = 'ArrayBuffer';
xhr.onload = function (e) {
// this.Response == uint8array.buffer
var uint8Array = new Uint8Array (this.Response);
};
xhr.send ();
Establecimos la propiedad en ArrayBuffer en XHR.ESSponseSetype, ¡para que podamos usar una matriz basada en datos para aceptar los datos que obtenemos!
resumen
Este artículo presenta principalmente cómo la matriz se almacena en el modelo de pila, y también describe en detalle el tipo de datos binarios del ArrayBuffer, el búfer original. En el desarrollo web, los datos y el almacenamiento de datos son una parte importante, ¡espero llamar la atención!
Puede haber errores en la narración de este artículo, ¡corrígelos más!