1. Contaminación global del espacio de nombres
Siempre envuelva el código en una expresión de función inmediata para formar un módulo independiente.
No recomendado
var x = 10, y = 100; console.log (window.x + '' + window.y);
recomendar
; (function (Window) {'Use Strict'; var x = 10, y = 100; console.log (window.x + '' + window.y);} (ventana));2. Ejecute la función inmediatamente
En la función de ejecución inmediata, si se utilizan variables globales, el cuerpo de la función que ejecuta la función inmediatamente puede llamarse en forma de variables locales cuando se les llama, lo que mejora el rendimiento del programa en cierta medida.
Y debe agregar undefined a los parámetros formales de la función inmediatamente, en la última posición, porque no se puede leer y escribir undefined en ES3. Si el valor de undefined se cambia en la posición global, es posible que su código no obtenga resultados retrasados.
Además, se recomienda agregar semicolones al principio y al final de la función de inmediato para evitar afectar nuestro propio código debido al código irregular de otras personas durante la fusión.
No recomendado
(function () {'use strict'; var x = 10, y = 100, c, elem = $ ('body'); console.log (window.x + '' + window.y); $ (documento) .on ('click', function () {}); if (typeOf c === 'no define') {// su código}} ());recomendar
; (function ($, ventana, documento, indefinido) {'use estricto'; var x = 10, y = 100, c, elem = $ ('body'); console.log (window.x + '' + window.y); $ (document) .on ('click', function () {}); if (typeOf c === '' sinfinado ') { / /su código} (jQuery);3. Modo estricto
El modo ECMAScript 5 estricto se puede activar en todo el script o dentro de un solo método. Corresponde a diferentes contextos de JavaScript y realizará verificaciones de error más estrictas. El modo estricto también asegura que el código JavaScript sea más robusto y se ejecute más rápido.
El modo estricto evita el uso de palabras clave reservadas que probablemente se introduzcan en el futuro.
Debe habilitar el modo estricto en su script, preferiblemente aplicarlo en una función de ejecución inmediata independiente. Evite usarlo en la primera línea de su script que hace que todos sus scripts inicien el modo estricto, lo que puede causar problemas con alguna biblioteca de terceros.
No recomendado
'Use Strict'; (function () {} ());recomendar
(function () {'use estrict';} ());IV. Declaración variable
Para todas las declaraciones variables, debemos especificar var . Si no se especifica var , se informará un error en modo estricto, y las variables dentro del mismo alcance deben declararse con un var tanto como sea posible, y múltiples variables deben separarse por ",".
No recomendado
función myFun () {x = 5; y = 10;}No completamente recomendado
función myFun () {var x = 5; var y = 10;}recomendar
función myFun () {var x = 5, y = 10;}5. Juicio comparativo utilizando el juicio de tipo
Utiliza el operador de comparación exacto === para evitar los problemas causados por el elenco de JavaScript durante el proceso de juicio.
Si usa el operador ===, las dos partes con la comparación deben ser del mismo tipo para ser válidos.
No recomendado
(function (w) {'use strict'; w.console.log ('0' == 0); // true w.console.log ('' == false); // true w.console.log ('1' == true); // true w.console.log (null == Undefined); // true var x = {valuef: function () {return '; w.console.log (x == 'x'); // true} (window.console.log));recomendar
(function (w) {'use strict'; w.console.log ('0' === 0); // false w.console.log ('' '=== false); // false w.console.log (' 1 '=== true); // false w.console.log (null === inventilizado); // false var x = {value: function () {; };6. Operaciones lógicas cuando la asignación variable
Operadores lógicos || y && también se puede usar para devolver los valores booleanos. Si el objeto de operación es un objeto no booleano, cada expresión se juzgará de izquierda a derecha. Según esta operación, siempre hay una expresión que se devuelve al final. Esto se puede usar para simplificar su código al asignar variables.
No recomendado
if (! x) {if (! y) {x = 1; } else {x = y; }}recomendar
x = x || y || 1;
7. Semicolon
Siempre use semicolones porque la anidación de código implícito puede causar problemas indetectables. Por supuesto, debemos eliminar fundamentalmente estos problemas [1].
Los siguientes ejemplos muestran el daño de perder un punto y coma:
// 1.myclass.prototype.mymethod = function () {return 42;} // No hay semicolon aquí (function () {}) (); //2.var x = {'i': 1, 'j': 2} // No hay semicolon aquí // Sé que nunca puede escribir dicho código, pero daré un ejemplo [ffversion, ieversion] [isie] (); // 3.Var Things_to_eat = [Apple, ostras, sprayOncheese] // No hay semicolon aquí-1 == resultantefoperation () || morir();Resultados del error
1. Error de JavaScript: la función que devuelve 42 se llama primero por el parámetro en la segunda función, y luego el número 42 también es "llamado", lo que resulta en un error.
2. Ocho veces recibirá el mensaje de error de 'no hay propiedad en un indefinido', porque la llamada en el entorno real se ve así: xffversion, ioversion ().
3. Die siempre se llama. Debido a que el resultado de MINUS 1 en la matriz es NAN, no es igual a nada (independientemente de si el resultado de la operación devuelve NAN o no). Entonces, el resultado final es que el valor obtenido después de la di () se ejecuta se asignará a las cosas_to_eat.
8. Declaraciones de funciones en bloques de declaración
Nunca declare las funciones dentro de los bloques de declaración, lo cual es ilegal en el modo estricto de ECMAScript 5. Las declaraciones de funciones deben estar en el nivel superior de alcance. Sin embargo, dentro del bloque de instrucciones, la declaración de función se puede convertir en una expresión de función y asignada a una variable.
No recomendado
if (x) {function foo () {}}recomendar
if (x) {var foo = function () {};}9. No use la función EVAL
eval() no solo confunde el contexto sino también peligroso. Siempre habrá otra solución para escribir su código que sea mejor, más claro y seguro que este, así que trate de no usar la función eval .
10. LITERALES DE ARRAZA Y OBJETOS
1. Use literales de matriz y objetos en lugar de constructor de matriz y objeto. Los constructores de matriz pueden cometer errores fácilmente en sus parámetros.
No recomendado
// Longitud de matriz 3Var a1 = nueva matriz (x1, x2, x3); // longitud de matriz 2var a2 = nueva matriz (x1, x2); // Si x1 es un número natural, su longitud será x1 // si x1 no es un número natural, su longitud será 1var A3 = nueva Array (x1); var a4 = nueva Array ();
Debido a esto, si el código pasa de dos a uno, existe una alta posibilidad de que la matriz experimente cambios inesperados de longitud. Para evitar situaciones tan extrañas, siempre use literales de matriz legibles.
recomendar
var a = [x1, x2, x3]; var a2 = [x1, x2]; var a3 = [x1]; var a4 = [];
2. El constructor de objetos no tendrá problemas similares, pero para la legibilidad y la uniformidad, debemos usar literales de objetos.
No recomendado
var o = nuevo objeto (); var o2 = nuevo objeto (); o2.a = 0; o2.b = 1; o2.c = 2; o2 ['key strange'] = 3;
recomendar
var o = {}; var o2 = {a: 0, b: 1, c: 2, 'clave extraña': 3};11. Juicio de condición triple variable (método rápido para IF)
Use el operador ternario para asignar o devolver declaraciones. Use en situaciones relativamente simples y evite usar en situaciones complejas. Nadie quiere usar 10 líneas de operadores ternarios para manejar sus mentes.
No recomendado
if (x === 10) {return 'válido';} else {return 'invalid';}recomendar
return x === 10? 'válido': 'inválido';
12. Para bucle
Durante el proceso de uso para el bucle, la longitud de la matriz es recibida por una variable, que es propicio para mejorar la eficiencia de ejecución del código. En cambio, la longitud de la matriz debe recalcularse cada vez que el bucle desaparece.
No recomendado
para (var i = 0; i <arr.length, i ++) {}recomendar
para (var i = 0, len = arr.length; i <len, i ++) {}13. Operaciones DOM repetidas
Operaciones DOM repetidas, es necesario usar una variable para recibir, en lugar de operar con frecuencia el árbol DOM, que tiene un mal impacto en el rendimiento, el código ordenado y el fácil mantenimiento.
No recomendado
$ ('.. myDiv'). find ('.recomendar
var myDiv = $ ('. MyDiv'); myDiv.find ('. Span1'). Text ('1'); myDiv.Find ('. Cuando jquery .end() está disponible, use .end() debe preferirse.
recomendar
$ ('.. MyDiv'). Find ('. .end (). Find ('. Span3'). Text ('3'); .end (). Find ('. Span4'). Text ('4');14. Especificaciones de comentarios
Al describir los comentarios, se recomienda un estilo de comentarios formateado y unificado. Trate de describir las ideas al escribir comentarios, en lugar de lo que hace el código.
No recomendado
// Obtener la función de orden getOrderById (id) {orden var; // ... orden de retorno;}Las anotaciones del método deben usarse uniformemente con anotaciones de nivel de bloque
recomendar
/** * Obtenga datos detallados de pedido basados en ID de pedido * @param {[número]} ID [ID de pedido] * @return {[orden]} [Detalles de pedido] */function getOrderById (id) {var order; // ... orden de retorno;}Resumir
El resumen de las especificaciones de escritura de código comunes de JavaScript ha terminado básicamente. Este artículo sigue siendo muy completo y tiene cierto valor de referencia para que todos usen o aprendan algunos JavaScript. Espero que sea útil para todos. Si tiene alguna pregunta, puede dejar un mensaje para comunicarse.