Utilice siempre las mismas convenciones de codificación para todo su JavaScript proyectos.
Las convenciones de codificación son pautas de estilo para la programación. Normalmente cubren:
Reglas de denominación y declaración de variables y funciones.
Reglas para el uso de espacios en blanco, sangrías y comentarios.
Prácticas y principios de programación.
Convenciones de codificación calidad segura:
Mejorar la legibilidad del código
Facilite el mantenimiento del código
Las convenciones de codificación pueden ser reglas documentadas que deben seguir los equipos o simplemente ser su práctica de codificación individual.
Esta página describe las convenciones generales del código JavaScript utilizadas por W3Schools.
También deberías leer el siguiente capítulo, "Mejores prácticas", y aprender cómo evitar errores de codificación.
En W3schools utilizamos camelCase para los nombres de identificadores (variables y funciones).
Todos los nombres comienzan con una letra.
Al final de esta página, encontrará una discusión más amplia sobre los nombres. normas.
firstName = "John";
lastName = "Doe";
price = 19.90;
tax = 0.20;
fullPrice = price + (price * tax);Coloque siempre espacios alrededor de los operadores (=+ - */) y después de las comas:
let x = y + z;
const myArray = ["Volvo", "Saab",
"Fiat"];Utilice siempre 2 espacios para sangría de bloques de código:
function toCelsius(fahrenheit) {
return (5 / 9) * (fahrenheit - 32);
}No utilice pestañas (tabuladores) para realizar sangrías. Cada editor interpreta las pestañas de forma diferente.
Reglas generales para declaraciones simples:
Termine siempre una declaración simple con un punto y coma.
const cars = ["Volvo", "Saab",
"Fiat"];
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor:
"blue"
};Reglas generales para declaraciones complejas (compuestas):
Coloque el corchete de apertura al final de la primera línea.
Utilice un espacio antes del soporte de apertura.
Coloque el corchete de cierre en una nueva línea, sin espacios iniciales.
No termine una declaración compleja con un punto y coma.
function toCelsius(fahrenheit) {
return (5 / 9) * (fahrenheit - 32);
}for (let i = 0; i < 5; i++) {
x += i;
}if (time < 20) {
greeting = "Good day";
} else {
greeting = "Good evening";
}Reglas generales para definiciones de objetos:
Coloque el corchete de apertura en la misma línea que el nombre del objeto.
Utilice dos puntos más un espacio entre cada propiedad y su valor.
Utilice comillas alrededor de valores de cadena, no de valores numéricos.
No agregue una coma después del último par propiedad-valor.
Coloque el corchete de cierre en una nueva línea, sin espacios protagonistas.
Termine siempre la definición de un objeto con un punto y coma.
Los objetos cortos se pueden escribir comprimidos, en una línea, usando solo espacios. entre propiedades, así:
Para facilitar la lectura, evite líneas de más de 80 caracteres.
Si una declaración de JavaScript no cabe en una línea, el mejor lugar para dividirla es, está después de un operador o una coma.
document.getElementById("demo").innerHTML =
"Hello Dolly.";Pruébelo usted mismo →
<!DOCTYPE html>
<html>
<body>
<h2>My Web Page</h2>
<p>The best place to break a code line is after an operator or a comma.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
"Hello Dolly.";
</script>
</body>
</html>
Utilice siempre la misma convención de nomenclatura para todo su código. Por ejemplo:
Nombres de variables y funciones escritos como camelCase
Variables globales escritas en MAYÚSCULAS (Nosotros no, pero es bastante común)
Constantes (como PI) escritas en MAYÚSCULAS
¿Debería utilizar hyp-hens, camelCase o ¿under_scores en nombres de variables?
Ésta es una pregunta que los programadores suelen discutir. La respuesta depende de quién preguntar:
Guiones en HTML y CSS:
Los atributos HTML5 pueden comenzar con datos (cantidad de datos, precio de datos).
CSS usa guiones en los nombres de propiedades (tamaño de fuente).
Los guiones pueden confundirse con intentos de resta. No se permiten guiones en los nombres de JavaScript.
Guiones bajos:
Muchos programadores prefieren utilizar guiones bajos (fecha_de_nacimiento), especialmente en SQL. bases de datos.
Los guiones bajos se utilizan a menudo en la documentación PHP.
Caso Pascal:
Los programadores de C suelen preferir PascalCase.
caso camello:
camelCase es utilizado por el propio JavaScript, por jQuery y otros JavaScript bibliotecas.
No empiece los nombres con el signo $. Te pondrá en conflicto con muchos nombres de bibliotecas de JavaScript.
Utilice una sintaxis simple para cargar scripts externos (el atributo de tipo no es necesario):
<script src="myscript.js"></script>Una consecuencia del uso de estilos HTML "desordenados" puede provocar errores de JavaScript.
Estas dos declaraciones de JavaScript producirán resultados diferentes:
const obj = getElementById("Demo")
const obj = getElementById("demo")Si es posible, utilice la misma convención de nomenclatura (que JavaScript) en HTML.
Visita la Guía de estilo HTML.
Los archivos HTML deben tener una extensión .html (se permite .htm). <p>Los archivos CSS deben tener una extensión .css.
Los archivos JavaScript deben tener una extensión .js.
La mayoría de los servidores web (Apache, Unix) distinguen entre mayúsculas y minúsculas en los nombres de archivos:
No se puede acceder a london.jpg como London.jpg.
Otros servidores web (Microsoft, IIS) no distinguen entre mayúsculas y minúsculas:
Se puede acceder a london.jpg como London.jpg o london.jpg.
Si utiliza una combinación de mayúsculas y minúsculas, debe ser extremadamente coherente.
Si pasa de un servidor que no distingue entre mayúsculas y minúsculas a un servidor que sí lo es, incluso los más pequeños Los errores pueden dañar su sitio web.
Para evitar estos problemas, utilice siempre nombres de archivos en minúsculas (si es posible).
Las computadoras no utilizan convenciones de codificación. La mayoría de las reglas tienen Poco impacto en la ejecución de los programas.
La sangría y los espacios adicionales no son significativos en escrituras pequeñas.
Para el código en desarrollo, se debe preferir la legibilidad. Mayor producción Los guiones deben minimizarse.