introducción:
Este capítulo no explica en profundidad algunos principios subyacentes de JS, como este puntero, alcance y prototipo. Implica algunos de ellos que conducen a simplificar el código y mejorar la eficiencia de la ejecución durante el desarrollo, o pueden usarse como un método empírico. La longitud no es larga, y los pequeños pasos le permiten leer todo el artículo y experimentar la alegría de la programación.
Obtenga números aleatorios dentro de dos intervalos
La copia del código es la siguiente:
función getrandomnum (min, max) {// Obtener números aleatorios dentro de dos intervalos
// @南南南南南南 sugiere que el primer parámetro es mayor que el segundo parámetro, por lo que agregar un juicio es más confiable
if (min> max)
Max = [min, min = max] [0]; // intercambia rápidamente dos valores variables
rango var = max - min + 1;
var rand = Math.random ();
return min + math.floor (rango rand *);
};
Devolver un parámetro positivo/negativo al azar
La copia del código es la siguiente:
función getRandomxy (num) {// Devuelve un parámetro positivo/negativo aleatorio
num = nuevo número (num);
if (math.random () <= 0.5)
num = -num;
num de devolución;
}
SetInterval () o setTimeOut () Temporizador de la función Pase el parámetro
La copia del código es la siguiente:
var s = 'Soy un parámetro';
función fn (args) {
console.log (args);
}
var a = setInterval (fn (s), 100); // Error xxxxx xxxxxx
var b = setInterval (function () {// correcto, llame a la función cronometrada con la función anónima
fn (s);
}, 100);
setInterval () o setTimeOut () Temporizador llamado recursivamente
La copia del código es la siguiente:
var s = verdadero;
función fn2 (a, b) {// paso 3
if (s) {
ClearInterval (a);
ClearInterval (b);
}
};
función fn (a) {// paso 2
var b = setInterval (function () {
fn2 (a, b) // pasar en dos temporizadores
}, 200)
};
var a = setInterval (function () {// paso 1
fn (a); // b representa el temporizador en sí, que se puede pasar en los parámetros del asiento
}, 100);
Convertir la cadena al número
La copia del código es la siguiente:
// No hay necesidad de nuevo número (String) ni número (String) simplemente reste los ceros de la cadena
var str = '100'; // str: cadena
var num = str - 0; // num: número
Juicio de valor nulo
La copia del código es la siguiente:
var s = ''; // cadena vacía
If (! S) // La cadena vacía se convierte en falso booleano de forma predeterminada, y se puede escribir directamente en la declaración de juicio
if (s! = null) // string vacío! = nulo
if (s! = undefined) // La cadena vacía también es! = Undefined
Es decir, el método del navegador parseint ()
La copia del código es la siguiente:
// La siguiente conversión es 0 en IE, y otros navegadores son 1. Esto está relacionado con la explicación del navegador IE de los dígitos.
var inum = parseInt (01);
// Entonces, la escritura compatible es
var num = parseInt (nuevo número (01));
Firebug Convenientemente depurar código JS
La copia del código es la siguiente:
// Firebug tiene un objeto de consola incorporado, que proporciona métodos incorporados para mostrar información
/**
* 1: console.log (), que se puede usar en lugar de alerta () o document.write (), admite la producción de marcas de posición, caracteres (%s), enteros (%d o%i), números de puntos flotantes (%f) y objetos (%O). Por ejemplo: console.log (" %d de año %d mes %d día", 2011, 3, 26)
* 2: Si hay demasiada información, puede mostrarla en grupos. Los métodos utilizados son console.group () y console.groupend ()
* 3: console.dir () puede mostrar todas las propiedades y métodos de un objeto
* 4: console.dirxml () se usa para mostrar el código HTML/XML contenido en un nodo de una página web
* 5: console.assert () afirmar, utilizado para determinar si una expresión o variable es verdadera
* 6: console.trace () se usa para rastrear la pista de llamadas de la función
* 7: console.time () y console.timeend () se utilizan para mostrar el tiempo de ejecución del código
* 8: El análisis de rendimiento (Profiler) es analizar el tiempo de ejecución de cada parte del programa para descubrir el cuello de botella. El método utilizado es console.profile () .... fn .... console.profileend ()
*/
Toma rápidamente los milisegundos actuales
La copia del código es la siguiente:
// t == El valor actual del milisegundo del sistema, razón: se llamará al operador de signo +, y se llamará al método de fecha de valor () de la fecha.
var t = +nueva fecha ();
Tomar rápidamente los bits enteros decimales
La copia del código es la siguiente:
// x == 2, los siguientes valores x son 2, y los números negativos también se pueden convertir
var x = 2.00023 | 0;
// x = '2.00023' | 0;
Intercambio de dos valores variables (sin cantidad intermedia)
La copia del código es la siguiente:
var a = 1;
var b = 2;
a = [b, b = a] [0]
alerta (a+'_'+b) // Los valores del resultado 2_1, A y B se han cambiado.
Lógico o '||' operador
La copia del código es la siguiente:
// b no es nulo: a = b, b es nulo: a = 1.
var a = b || 1;
// El uso más común es pasar los parámetros para un método de complemento y obtener elementos de destino del evento: Event = Event || ventana. Evento
// IE tiene un objeto Window.Event, pero FF no.
Solo el objeto del método tiene propiedades prototipo
La copia del código es la siguiente:
// El método tiene la propiedad Prototype Prototype Object, mientras que los datos originales no tienen esta propiedad, como VAR A = 1, A no tiene una propiedad prototipo
función persona () {} // constructor humano
Persona.prototype.run = function () {alert ('ejecutar ...'); } // método de ejecución de prototipo
Persona.run (); // error
var p1 = nueva persona (); // El método de ejecución del prototipo se asignará a P1 solo cuando se use el nuevo operador.
p1.run (); // correr...
Rápidamente consigue el día de la semana
La copia del código es la siguiente:
// La hora actual del sistema de cálculo es la semana
var Week = "Today es: Semana" + "Día uno, dos, tres, cuatro, cinco, seis" .Charat (New Date (). GetDay ());
Sesgo de cierre
La copia del código es la siguiente:
/**
* Cierre: cualquier cuerpo del método JS puede llamarse un cierre, no solo ocurre si una función en línea se refiere a un cierto parámetro o propiedad de una función externa.
* Tiene un alcance independiente, en el que pueden existir varias subconjuntos (es decir, métodos de métodos anidados), y finalmente el alcance de cierre es el alcance del método más externo.
* Contiene los parámetros del método de sí mismo y los parámetros del método de todas las funciones integradas. Por lo tanto, cuando una función incrustada tiene una referencia externamente, el alcance de la referencia es el alcance del método (de nivel superior) donde se encuentra la función de referencia.
*/
función a (x) {
función b () {
alerta (x); // Parámetros de función externa de referencia
}
regreso B;
}
var run = a ('run ...');
// Debido a la expansión del alcance, las variables de la función externa A se pueden hacer referencia y mostrar
correr(); // alerta (): ejecutar ..
Obtener la cadena de parámetros de dirección y actualizar cronometrado
La copia del código es la siguiente:
// ¿obtener un signo de interrogación? El siguiente contenido incluye el signo de interrogación
var x = window.location.search
// Obtener el contenido detrás del número de alarma #, incluido el número #
var y = window.location.hash
// La actualización automática de la página web se puede lograr con el temporizador
Window.location.Reload ();
Nulo e indefinido
La copia del código es la siguiente:
/**
* El tipo indefinido tiene solo un valor, es decir, indefinido. Cuando la variable declarada no se ha inicializado, el valor predeterminado de la variable no está definido.
* El tipo nulo también tiene solo un valor, es decir, nulo. NULL se usa para representar un objeto que aún no ha existido, y a menudo se usa para representar una función que intenta devolver un objeto que no existe.
* Ecmascript cree que undefinado se deriva de NULL, por lo que se definen como iguales.
* Pero, si en algunos casos debemos distinguir entre estos dos valores, ¿qué debemos hacer? Los siguientes dos métodos se pueden usar
* Al emitir juicios, es mejor usar el juicio de tipo '===' al juzgar si el objeto tiene un valor según las necesidades.
*/
var a;
alerta (a === nulo); // falso, porque a no es un objeto vacío
alerta (a === indefinido); // Verdadero, porque a no se inicializa, el valor está indefinido
// Introducir
alerta (nulo == Undefined); // Verdadero, porque el operador '==' realizará la conversión de tipo,
// Similarmente
alerta (1 == '1'); // verdadero
alerta (0 == falso); // Verdadero, False se convierte al tipo de número 0
Agregar dinámicamente parámetros al método
La copia del código es la siguiente:
// El método A tiene un parámetro más 2
función a (x) {
var arg = array.prototype.push.call (argumentos, 2);
alerta (argumentos [0]+'__'+argumentos [1]);
}
Personalizar el estilo de borde seleccionado
La copia del código es la siguiente:
<!-Copie a la página para probar el efecto, puede personalizar el estilo a voluntad->
<span style = "border: 1px sólido rojo; posición: absoluto; desbordamiento: oculto;" >
<select style = "margin: -2px;">
<Opción> Seleccionar estilo de borde personalizado </opción>
<opción> 222 </ppection>
<Cection> 333 </opción>
</select>
</span>
La paleta de colores más fácil
La copia del código es la siguiente:
<!-JS para extraer su valor de valor y establecer cualquier color en cualquier objeto->
<Entrada tipo = color />
Funciones, objetos es una matriz?
La copia del código es la siguiente:
var anobject = {}; // un objeto
anobject.aproperty = "propiedad del objeto"; // una propiedad del objeto
anobject.amethod = function () {alert ("método de objeto")}; // Un método del objeto
// Centrarse en lo siguiente:
alerta (anobject ["apropiado"]); // Puede acceder al atributo como una matriz con el nombre del atributo como subíndice
anobject ["amethod"] (); // Puede llamar a un método como una matriz con el nombre del método como subíndice
para (var s en anobject) // transfiere todas las propiedades y métodos del objeto para el procesamiento iterativo
alerta (s + "es a" + typeof (anobject [s]));
// es lo mismo para el tipo de objeto de función:
var afunción = function () {}; // una función
Afunction.APROperty = "Propiedad de la función"; // una propiedad de la función
Afunction.amethod = function () {alert ("método de función")}; // Un método de función
// Centrarse en lo siguiente:
alerta (Afunción ["Apracio"]); // puede acceder a las propiedades como la matriz con el nombre del atributo como subíndice
afunción ["amethod"] (); // Puede llamar a un método utilizando el nombre del método como subíndice cuando una función se usa como subíndice para una matriz
para (var s en afunción) // iterar todas las propiedades y métodos de la función transversal para el procesamiento iterativo
alerta (s + "es a" + typeof (afunción [s]));
La copia del código es la siguiente:
/**
* Sí, se puede acceder y procesar objetos y funciones como matrices, utilizando nombres de atributos o nombres de métodos como subíndices.
* Entonces, ¿debería considerarse una matriz o un objeto? Sabemos que las matrices deben considerarse estructuras de datos lineales. Las estructuras de datos lineales generalmente tienen ciertas reglas, que son adecuadas para operaciones de iteración de lotes unificados, etc., que es un poco como las olas.
* Los objetos son estructuras de datos discretas que son adecuadas para describir cosas dispersas y personalizadas, un poco como partículas.
* Por lo tanto, también podemos preguntar: ¿son los objetos en ondas o partículas de JavaScript? Si hay una teoría cuántica de objetos, entonces la respuesta debe ser: ¡dualidad de partículas de onda!
* Por lo tanto, las funciones y objetos en JavaScript tienen las características de los objetos y las matrices. La matriz aquí se llama "diccionario", una colección de pares de valor de nombre que se pueden estirar y condensarse arbitrariamente. De hecho, la implementación interna de objeto y función es una estructura de diccionario, pero esta estructura de diccionario muestra una apariencia rica a través de una gramática rigurosa y exquisita. Así como la mecánica cuántica utiliza partículas para explicar y lidiar con los problemas en algunos lugares, mientras que las olas para explicar y lidiar con los problemas en otros. También puede optar libremente usar objetos o matrices para explicar y lidiar con problemas cuando sea necesario. Mientras sea bueno para comprender estas maravillosas características de JavaScript, puede escribir mucho código conciso y potente.
*/
Hacer clic en un área en blanco puede activar un elemento para cerrar/ocultar
La copia del código es la siguiente:
/**
* A veces la página tiene un menú desplegable o algo, lo que requiere que el usuario lo oculte al hacer clic en un espacio en blanco o haciendo clic en otros elementos.
* Se puede activar un evento global de clic en el documento
* @param {objeto} "Objeto de destino"
*/
$ (documento) .click (function (e) {
$ ("Objeto objetivo"). Hide ();
});
/**
* Pero una desventaja es que cuando haces clic en el elemento y quieres que lo muestre
* Si no evita que el evento burbujee al objeto de documento global haciendo clic en el tiempo, el método anterior se ejecutará
*/
$ ("Objeto de destino"). Click (función (evento) {
evento = evento || Window.event;
event.stopPropagation (); // Al hacer clic en el objeto de destino, evite que el evento burbujee a tiempo
$ ("Objeto objetivo"). Toggle ();
});
Los anteriores son algunos métodos JavaScript de uso común resumidos por mí. Espero que te guste.