introducir
Algunos de los modos que presentamos en este artículo se denominan modo de inicialización y modo de rendimiento, que se utilizan principalmente para la inicialización y la mejora del rendimiento. Algunos modos se han mencionado antes, así que aquí hay solo un resumen.
Funciones que se ejecutan de inmediato
En el cuarto capítulo de esta serie, "Expresiones de funciones llamadas ahora", hemos descrito funciones similares en detalle. Aquí solo daremos dos ejemplos simples para resumir.
La copia del código es la siguiente:
// Después de declarar la función, ejecute la función inmediatamente
(función () {
console.log ('¡Cuidado!');
} ());
// Las funciones declaradas de esta manera también se pueden ejecutar inmediatamente
!función () {
console.log ('¡Cuidado!');
} ();
// El siguiente método también está bien
~ function () { / * código * /} ();
-Function () { / * código * /} ();
+function () { / * código * /} ();
Inicialización de objetos ejecutado inmediatamente
Este patrón significa que cuando se declara un objeto (no una función), uno de los métodos en el objeto se ejecutará inmediatamente para realizar el trabajo de inicialización. Por lo general, este patrón se puede usar en el código ejecutado a la vez.
La copia del código es la siguiente:
({
// Aquí puede definir constantes y establecer otros valores
Maxwidth: 600,
MaxHeight: 400,
// Por supuesto, también puede definir métodos de utilidad
gimmemax: functer () {
devuelve este.maxwidth + "x" + this.maxheight;
},
// Inicialización
init: function () {
console.log (this.gimmemax ());
// más código ...
}
}). init (); // Esto inicia la inicialización
Inicialización de la rama
La inicialización de la rama se refiere a la inicialización de diferentes códigos de acuerdo con diferentes condiciones (escenarios), que es la llamada asignación de declaración condicional. Antes, cuando estábamos haciendo procesamiento de eventos, generalmente usamos códigos como los siguientes:
La copia del código es la siguiente:
var utils = {
AddListener: function (el, type, fn) {
if (typeof window.adDeventListener === 'function') {
el.AdDeventListener (tipo, fn, falso);
} else if (typeof document.attachevent! == 'undefined') {
el.attachevent ('on' + type, fn);
} demás {
El ['on' + type] = fn;
}
},
removelistener: function (el, type, fn) {
}
};
Vamos a mejorarlo. Primero, necesitamos definir dos interfaces, una para el mango de eventos ADD y la otra para eliminar el mango del evento. El código es el siguiente:
La copia del código es la siguiente:
var utils = {
AddListener: NULL,
removelistener: nulo
};
El código de implementación es el siguiente:
La copia del código es la siguiente:
if (typeof window.adDeventListener === 'function') {
utils.addListener = function (el, type, fn) {
el.AdDeventListener (tipo, fn, falso);
};
} else if (typeof document.attachevent! == 'undefined') {// es decir
utils.addListener = function (el, type, fn) {
el.attachevent ('on' + type, fn);
};
utils.removelistener = function (el, type, fn) {
el.detachevent ('on' + type, fn);
};
} else {// Otros navegadores antiguos
utils.addListener = function (el, type, fn) {
El ['on' + type] = fn;
};
utils.removelistener = function (el, type, fn) {
El ['on' + type] = null;
};
}
¿No es muy conveniente de usar? El código es mucho más elegante.
Funciones autodeclarar
En general, el código de función del mismo nombre es reescribir dentro de la función, como:
La copia del código es la siguiente:
var scareme = function () {
alerta ("¡boo!");
Scarme = function () {
alerta ("¡Double boo!");
};
};
Este tipo de código es muy confuso. Primero veamos los resultados de ejecución del ejemplo:
La copia del código es la siguiente:
// 1. Agregue nuevos atributos
Scarme.Property = "correctamente";
// 2. Scareme asigna un nuevo valor
Var brank = Scarme;
// 3. Llame como método
var Spooky = {
Boo: Scarme
};
// llama con nuevo nombre de variable
broma(); // "¡Abucheo!"
broma(); // "¡Abucheo!"
console.log (prank.property); // "adecuadamente"
// llamar usando el método
Spooky.boo (); // "¡Abucheo!"
Spooky.boo (); // "¡Abucheo!"
console.log (Spooky.boo.Property); // "adecuadamente"
A través del resultado de la ejecución, se puede encontrar que asignar la función a una nueva variable (o método interno), el código no ejecuta el código SCARME sobrecargado, y el siguiente ejemplo es exactamente lo contrario:
La copia del código es la siguiente:
// usa funciones autodeclarar
Scarme (); // Doble boo!
Scarme (); // Doble boo!
console.log (Scareme.Property); // indefinido
Al usar este modelo, debe tener mucho cuidado, de lo contrario, el resultado real puede ser diferente del resultado que espera. Por supuesto, también puede usar este especial para hacer algunas operaciones especiales.
Optimización de memoria
Este patrón utiliza principalmente las características de atributo de la función para evitar una gran cantidad de cálculos repetidos. El formulario de código habitual es el siguiente:
La copia del código es la siguiente:
var myFunc = function (param) {
if (! myfunc.cache [param]) {
resultado var = {};
// ... Operación compleja ...
myfunc.cache [param] = resultado;
}
return myFunc.cache [param];
};
// almacenamiento de caché
myfunc.cache = {};
Sin embargo, hay un problema con el código anterior. Si el parámetro aprobado es tostring o algunos métodos comunes similares al objeto, el problema ocurrirá. En este momento, debe utilizar el legendario método de HaswnProperty, el código es el siguiente:
La copia del código es la siguiente:
var myFunc = function (param) {
if (! myfunc.cache.hasownproperty (param)) {
resultado var = {};
// ... Operación compleja ...
myfunc.cache [param] = resultado;
}
return myFunc.cache [param];
};
// almacenamiento de caché
myfunc.cache = {};
O si pasa en múltiples parámetros, puede usar el método Stringify de JSON para producir un valor de CacheKey para el almacenamiento. El código es el siguiente:
La copia del código es la siguiente:
var myFunc = function () {
var cachekey = json.stringify (array.prototype.slice.call (argumentos)),
resultado;
if (! myfunc.cache [cachekey]) {
resultado = {};
// ... Operación compleja ...
myfunc.cache [cachekey] = resultado;
}
devuelve myfunc.cache [cachekey];
};
// almacenamiento de caché
myfunc.cache = {};
O múltiples parámetros, también puede usar la función Arguments.callee:
La copia del código es la siguiente:
var myFunc = function (param) {
var f = argumentos.callee,
resultado;
if (! f.cache [param]) {
resultado = {};
// ... Operación compleja ...
F.Cache [param] = resultado;
}
return f.cache [param];
};
// almacenamiento de caché
myfunc.cache = {};
Resumir
No es necesario resumir, solo mire el código con cuidado