Prácticas recomendadas de JavaScript
Evitar variables globales, evitar new
, evitar ==
, evitareval()
Evite las variables globales
Minimice el uso de variables globales.
Esto incluye todos los tipos de datos, objetos y funciones.
Las variables y funciones globales pueden ser sobrescritas por otros scripts.
Use variables locales en su lugar y aprenda a usar los cierres .
Declarar siempre variables locales
Todas las variables utilizadas en una función deben declararse como variables locales .
Las variables locales deben declararse con la var
palabra clave o la let
palabra clave, o la const
palabra clave, de lo contrario se convertirán en variables globales.
El modo estricto no permite variables no declaradas.
Declaraciones en la parte superior
Es una buena práctica de codificación colocar todas las declaraciones en la parte superior de cada secuencia de comandos o función.
Esta voluntad:
- Dar código más limpio
- Proporcionar un solo lugar para buscar variables locales
- Hacer que sea más fácil evitar variables globales no deseadas (implícitas)
- Reduzca la posibilidad de nuevas declaraciones no deseadas
// Declare at the beginning
let firstName, lastName, price, discount, fullPrice;
// Use later
firstName = "John";
lastName = "Doe";
price = 19.90;
discount = 0.10;
fullPrice = price - discount;
Esto también se aplica a las variables de bucle:
for (let i = 0; i < 5; i++)
{
Inicializar variables
Es una buena práctica de codificación inicializar las variables cuando las declara.
Esta voluntad:
- Dar código más limpio
- Proporcionar un solo lugar para inicializar variables
- Evitar valores indefinidos
// Declare and initiate at the beginning
let firstName = "",
let lastName = "",
let price = 0,
let discount = 0,
let fullPrice = 0,
const myArray = [],
const myObject = {};
La inicialización de variables proporciona una idea del uso previsto (y el tipo de datos previsto).
Declarar objetos con const
Declarar objetos con const evitará cualquier cambio accidental de tipo:
Ejemplo
let car = {type:"Fiat", model:"500", color:"white"};
car = "Fiat"; // Changes object to string
const car = {type:"Fiat", model:"500", color:"white"};
car = "Fiat"; // Not possible
Declarar matrices con const
Declarar arreglos con const evitará cualquier cambio accidental de tipo:
Ejemplo
let cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Changes array to number
const cars = ["Saab", "Volvo", "BMW"];
cars = 3; // Not possible
No use un nuevo objeto ()
- Usar
""
en lugar denew String()
- Usar
0
en lugar denew Number()
- Usar
false
en lugar denew Boolean()
- Usar
{}
en lugar denew Object()
- Usar
[]
en lugar denew Array()
- Usar
/()/
en lugar denew RegExp()
- Usar
function (){}
en lugar denew Function()
Ejemplo
let x1 = ""; // new primitive string
let x2 = 0; // new primitive number
let x3 = false; // new primitive boolean
const x4 = {}; // new object
const x5 = []; // new array object
const x6 = /()/; // new regexp object
const x7 = function(){}; // new function object
Cuidado con las conversiones automáticas de tipo
JavaScript está mal escrito.
Una variable puede contener todos los tipos de datos.
Una variable puede cambiar su tipo de datos:
Ejemplo
let x = "Hello"; // typeof x is a string
x = 5; // changes typeof x to a number
Tenga en cuenta que los números se pueden convertir accidentalmente en cadenas o NaN
(No es un número).
Al realizar operaciones matemáticas, JavaScript puede convertir números en cadenas:
Ejemplo
let x = 5 + 7; // x.valueOf() is 12, typeof x is a number
let x = 5 + "7"; // x.valueOf() is 57, typeof x is a string
let x = "5" + 7; // x.valueOf() is 57, typeof x is a string
let x = 5 - 7; // x.valueOf() is -2, typeof x is a number
let x = 5 - "7"; // x.valueOf() is -2, typeof x is a number
let x = "5" - 7; // x.valueOf() is -2, typeof x is a number
let x = 5 - "x"; // x.valueOf() is NaN, typeof x is a number
Restar una cadena de una cadena no genera un error pero devuelve NaN
(no un número):
Ejemplo
"Hello" - "Dolly" // returns NaN
Usar === Comparación
El ==
operador de comparación siempre convierte (a tipos coincidentes) antes de la comparación.
El ===
operador fuerza la comparación de valores y tipo:
Ejemplo
0 == ""; // true
1 == "1"; // true
1 == true; // true
0 === ""; // false
1 === "1"; // false
1 === true;
// false
Usar valores predeterminados de parámetros
Si se llama a una función con un argumento faltante, el valor del argumento faltante se establece en
undefined
.
Los valores indefinidos pueden romper su código. Es un buen hábito asignar valores predeterminados a los argumentos.
Ejemplo
function myFunction(x, y) {
if (y === undefined) {
y = 0;
}
}
ECMAScript 2015 permite parámetros predeterminados en la definición de la función:
function (a=1, b=1) { /*function code*/ }
Lea más sobre parámetros y argumentos de funciones en Parámetros de funciones
Finalice sus cambios con valores predeterminados
Siempre termine sus switch
declaraciones con un default
. Incluso si crees que no hay necesidad de ello.
Ejemplo
switch (new Date().getDay()) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
break;
case 2:
day = "Tuesday";
break;
case 3:
day = "Wednesday";
break;
case 4:
day = "Thursday";
break;
case 5:
day = "Friday";
break;
case 6:
day = "Saturday";
break;
default:
day =
"Unknown";
}
Evite números, cadenas y booleanos como objetos
Siempre trate los números, las cadenas o los valores booleanos como valores primitivos. No como objetos.
Declarar estos tipos como objetos ralentiza la velocidad de ejecución y produce efectos secundarios desagradables:
Ejemplo
let x = "John";
let y = new String("John");
(x === y) // is false because x is a string and y is an object.
O incluso peor:
Ejemplo
let x = new String("John");
let y = new String("John");
(x == y) // is false because you cannot compare objects.
Evite usar eval()
La eval()
función se utiliza para ejecutar texto como código. En casi todos los casos, no debería ser necesario usarlo.
Debido a que permite ejecutar código arbitrario, también representa un problema de seguridad.