introducir
El modo de peso mosca (peso mosca) ejecuta la tecnología para compartir para soportar efectivamente una gran cantidad de objetos de grano fino, evitando la sobrecarga de una gran cantidad de clases pequeñas con el mismo contenido (como el consumo de memoria) y permitiendo a todos compartir una clase (metaclase).
El patrón de la enciclopedia puede evitar una gran cantidad de sobrecarga de clases muy similares. En la programación, a veces es necesario producir una gran cantidad de instancias de clase de grano fino para representar datos. Si puede encontrar que estas instancias tienen básicamente la misma sobrecarga, excepto por algunos parámetros, puede reducir significativamente el número de clases que deben ser instanciadas. Si esos parámetros se pueden mover fuera de la instancia de clase y los pasan cuando se llama al método, el número de instancias individuales puede reducirse enormemente al compartir.
Entonces, ¿qué pasa si aplica el modo Enciclopedia en JavaScript? Hay dos formas. El primero es aplicarlo a la capa de datos, principalmente a una gran cantidad de objetos similares en la memoria; El segundo es aplicarlo a la capa DOM, que se puede usar en el gerente de eventos centrales para evitar agregar manijas de eventos a cada elemento infantil en el contenedor principal.
Disfruta de la capa de datos
Hay dos conceptos importantes en el peso mosca: estado interno intrínseco y de estado externo extrínseco. El estado interno se gestiona a través de métodos internos en el objeto, y la información externa se puede eliminar o guardar externamente.
Para decirlo sin rodeos, primero es pellizcar un modelo original y luego producir modelos específicos con diferentes características de acuerdo con diferentes ocasiones y entornos. Obviamente, se deben generar diferentes objetos nuevos aquí, por lo que el modo de fábrica a menudo aparece en el modo de peso mosca. El estado interno del peso mosca se usa para compartir. Flyweight Factory es responsable de mantener una piscina de peso mosca (grupo de modos) para almacenar objetos con estado interno.
Use el modo de disfrute
Demostremos que si el sistema usa una biblioteca de clase para administrar todos los libros, los metadatos de cada libro se establecen tentativamente en el siguiente contenido:
La copia del código es la siguiente:
IDENTIFICACIÓN
Título
Autor
Género
Recuento de páginas
ID de editor
ISBN
También necesitamos definir el tiempo y el prestatario de cada libro, así como la fecha de devolución y si está disponible:
La copia del código es la siguiente:
Date de verificar
miembro de la salida
dura
disponibilidad
Debido a que el objeto del libro está configurado en el siguiente código, tenga en cuenta que el código aún no ha sido optimizado:
La copia del código es la siguiente:
var book = function (id, título, autor, género, pageCount, PublisherId, ISBN, DateutDate, Recomplante, duraTurnDate, disponibilidad) {
this.id = id;
this.title = title;
this.author = autor;
this.genre = género;
this.pageCount = pageCount;
this.PublisherId = PublisherId;
this.isbn = isbn;
this.eckeckoutdate = checkoutDate;
this.checkout miembro = miembro de checkout;
this.duereturndate = duraTurnDate;
this.AVailability = disponibilidad;
};
Book.prototype = {
getTitle: function () {
devolver esto.title;
},
getAuthor: function () {
devolver esto. Autor;
},
getisbn: function () {
devolver esto.isbn;
},
/*Otros métodos GET no se mostrarán aquí*/
// Actualizar el estado de préstamo
updateCheckoutStatus: function (bookid, newStatus, checkoutDate, miembro de registro, newreturnDate) {
this.id = bookid;
this.availability = newStatus;
this.eckeckoutdate = checkoutDate;
this.checkout miembro = miembro de checkout;
this.duereturndate = newreturnDate;
},
//renovar
ExtendCheckoutPeriod: function (bookID, newReturnDate) {
this.id = bookid;
this.duereturndate = newreturnDate;
},
// ¿ESPIRA?
ispastdue: function (bookID) {
var currentDate = new Date ();
return currentDate.getTime ()> date.parse (this.duereturndate);
}
};
El programa puede estar bien al principio, pero a medida que pasa el tiempo, los libros pueden aumentar en grandes cantidades, y cada tipo de libro tiene diferentes versiones y cantidades, encontrará que el sistema se está volviendo cada vez más lento. Se pueden imaginar miles de objetos de libros en la memoria, y necesitamos usar el modo Enciclopedia para optimizar.
Podemos dividir los datos en dos tipos de datos internos y externos. Los datos relacionados con los objetos de libro (título, autor, etc.) pueden atribuirse a propiedades internas, mientras que (miembro de pago, duraTurndate, etc.) se pueden atribuir a propiedades externas. De esta manera, el siguiente código puede compartir el mismo objeto en el mismo libro, porque no importa quién toma el libro, siempre y cuando el libro sea el mismo libro, la información básica es la misma:
La copia del código es la siguiente:
/*Código de optimización del modo Xienyuan*/
var book = function (título, autor, género, pageCount, PublisherId, ISBN) {
this.title = title;
this.author = autor;
this.genre = género;
this.pageCount = pageCount;
this.PublisherId = PublisherId;
this.isbn = isbn;
};
Definición de la fábrica base
Definamos una fábrica básica para verificar si el objeto del libro se creó antes, regrese si lo existe, y recrearlo y almacenarlo para que pueda continuar accediendo más tarde, lo que asegura que solo creemos un objeto para cada libro:
La copia del código es la siguiente:
/* Libro de fábrica Singleton*/
var bookFactory = (function () {
var existingbooks = {};
devolver{
CreateBook: Function (Título, Autor, Género, PageCount, PublisherId, ISBN) {
/*Buscar si crear antes*/
var existente EXISTBOOK = EXISTBOOKS [ISBN];
if (existentebook) {
devolver el libro existente;
}demás{
/ * Si no, crea uno y guarda */
Var Book = nuevo libro (título, autor, género, pageCount, PublisherId, ISBN);
EXISTBOOKS [ISBN] = LIBRO;
libro de regreso;
}
}
}
});
Administrar el estado externo
El estado externo es relativamente simple. Excepto por el libro que encapsulamos, todo lo demás debe administrarse aquí:
La copia del código es la siguiente:
/*BookRecordManager Singleton para la gestión de préstamos*/
var bookRecordManager = (function () {
var bookRecordDatabase = {};
devolver{
/*Agregar un registro de préstamo de libro*/
addBookRecord: función (ID, título, autor, género, pageCount, PublisherID, ISBN, DateDate, miembro de pago, duraTurnDate, disponibilidad) {
Var Book = BookFactory.CreateBook (título, autor, género, pageCount, PublisherID, ISBN);
bookRecordDatabase [id] = {
miembro de la pago: miembro de pago,
Date de control: checkoutDate,
duraTurndate: duraTurndate,
Disponibilidad: disponibilidad,
Libro: libro;
};
},
updateCheckoutStatus: function (bookid, newStatus, checkoutDate, miembro de registro, newreturnDate) {
var registro = bookRecordDatabase [bookID];
registro.availability = newStatus;
registro.eckeckoutdate = checkoutDate;
registro.checkout miembro = miembro de checkout;
Record.duerTurnDate = newreturnDate;
},
ExtendCheckoutPeriod: function (bookID, newReturnDate) {
bookRecordDatabase [bookid] .duereturndate = newreturnDate;
},
ispastdue: function (bookID) {
var currentDate = new Date ();
return currentDate.gettime ()> date.parse (bookRecordDatabase [bookid] .duereturndate);
}
};
});
De esta manera, hemos guardado la misma información del mismo libro en un objeto Bookmanager y hemos guardado solo una copia; En comparación con el código anterior, podemos encontrar que ahorra mucha memoria.
Disfruta del modo Yuan y DOM
No diré mucho sobre el incidente de DOM aquí. Creo que todos ya lo saben. Demos dos ejemplos.
Ejemplo 1: Gestión de eventos centralizados
Por ejemplo, si necesitamos monitorear su evento de clic para muchos elementos o estructuras similares (como menús o LIS múltiples en UL), entonces necesitamos unir eventos para cada elemento. Si hay muy, muchos elementos, entonces se puede imaginar el rendimiento. Combinado con el conocimiento de las burbujas, si se activa algún elemento infantil, el evento burbujee al elemento anterior después de que se active el disparador. Por lo tanto, utilizando esta función, podemos usar el modo Enciclopedia, podemos monitorear los eventos de eventos en los elementos principales de estos elementos similares, y luego juzgar qué elemento infantil tiene un evento activado y luego realizar operaciones adicionales.
Aquí combinamos el método BIND/Desvind de JQuery para dar un ejemplo.
HTML:
La copia del código es la siguiente:
<div id = "contenedor">
<div href = "#"> Más información (dirección)
<span>
Aquí hay más información
</span> </div>
<div href = "#"> Más información (mapa)
<span>
<iframe src = "http://www.map-generator.net/extmap.php?name=london&address=london%2c%20england&width=500...gt;" </iframe>
</span>
</div>
</div>
JavaScript:
La copia del código es la siguiente:
statemanager = {
volar: function () {
var self = this;
$ ('#contenedor'). Unbind (). Bind ("Haga clic", función (e) {
Var Target = $ (E.originalTarget || E.Srcelement);
// Determinar qué elemento infantil es
if (target.is ("div.toggle")) {
self.handleclick (objetivo);
}
});
},
handleclick: function (elem) {
elem.find ('span'). toggle ('lento');
}
});
Ejemplo 2: Aplicar el modo Enciclopedia para mejorar el rendimiento
Otro ejemplo todavía está relacionado con jQuery. En general, usamos objetos de elementos en la función de devolución de llamada de eventos. A menudo usamos la forma de $ (esto). De hecho, crea repetidamente un nuevo objeto porque esto en la función de devolución de llamada ya es el elemento DOM en sí. Debemos usar el siguiente código:
La copia del código es la siguiente:
$ ('div'). bind ('click', function () {
console.log ('Usted hizo clic:' + $ (this) .attr ('id'));
});
// El código anterior debe evitarse y evitar generar objetos jQuery nuevamente en el elemento DOM, porque puede usar directamente el elemento DOM en sí.
$ ('div'). bind ('click', function () {
console.log ('Usted hizo clic:' + this.id);
});
De hecho, si tenemos que usar la forma de $ (esto), también podemos implementar nuestra propia versión del patrón de instancia única, por ejemplo, podemos implementar una función como jQuery.signle (esto) para devolver el elemento DOM en sí mismo:
La copia del código es la siguiente:
jQuery.single = (function (o) {
Var Collection = jQuery ([1]);
Función de retorno (elemento) {
// poner elementos en la colección
colección [0] = elemento;
// Regreso a la colección
colección de regreso;
};
});
Cómo usar:
La copia del código es la siguiente:
$ ('div'). bind ('click', function () {
var html = jQuery.single (this) .next (). html ();
console.log (html);
});
De esta manera, el elemento DOM en sí mismo se devuelve tal como es, y el objeto jQuery no se crea.
Resumir
El modo de peso mosca es un modo que mejora la eficiencia y el rendimiento del programa, lo que acelerará en gran medida la velocidad de ejecución del programa. Hay muchos escenarios de aplicación: por ejemplo, si desea leer una serie de cuerdas de una base de datos, muchas de estas cuerdas se repiten, entonces podemos almacenar estas cuerdas en la piscina de peso mosca (piscina).
Si una aplicación usa una gran cantidad de objetos, y estos grandes números de objetos causan un gran almacenamiento, debe considerar usar el modo Enciclopedia; y la mayoría de los estados de objetos pueden ser externos. Si se elimina el estado externo del objeto, muchos grupos de objetos pueden reemplazarse con relativamente pocos objetos compartidos. En este momento, puede considerar usar el modo Enciclopedia.