¿Cuál es la convención de nomenclatura de nombre de archivo de JavaScript? [cerrado]

283

¿Deberían los archivos llamarse algo-con-guiones.js, camelCased.js u otra cosa?

No encontré la respuesta a esta pregunta aquí .

javascript naming-conventions ripper234
fuente
2
Una buena convención de nomenclatura es nombrar nombres de archivos como vería esa entidad en el código. La MyPluginclase entraría MyPlugin.js. El MenuItemcomponente Reaccionar entrará MenuItem.js. Otros desarrolladores requerirán / importarán 'your-cool-module' y usarán múltiples símbolos, así que asígnele un nombre cool-module.js. -
Dan Dascalescu
1
Esta publicación no está basada en opciones. De hecho es importante. Aquí tienes una guía hecha por Google: google.github.io/styleguide/jsguide.html#file-name . (Guía de estilo de JavaScript de Google)
zwitterion

Respuestas:

184

Una posible convención de nomenclatura es usar algo similar al esquema de nomenclatura que utiliza jQuery. No se adopta universalmente, pero es bastante común.

product-name.plugin-ver.sion.filetype.js

donde el par product-name+ plugintambién puede representar un espacio de nombres y un módulo . Los versiony filetypeson generalmente opcionales.

filetypepuede ser algo relativo a cómo es el contenido del archivo. A menudo se ven son:

  • min para archivos minificados
  • custom para archivos personalizados construidos o modificados

Ejemplos:

  • jquery-1.4.2.min.js
  • jquery.plugin-0.1.js
  • myapp.invoice.js
Bryan Menard
fuente
31
Estoy de acuerdo con lo que dijiste. Pero hay una cosa con la que estoy luchando actualmente: ¿qué pasa si el 'complemento' contiene dos palabras? ¿Separarlos por puntos? jquery.myPlugin-1.0.0.js o jquery.my.plugin-1.0.0.js o jquery.my_plugin-1.0.0.js o jquery.myplugin-1.0.0.js o tal vez incluso jquery.my-plugin- 1.0.0.js? Quizás puedas completar tus ejemplos con eso, ¡gracias!
Mayrs
44
¿Qué pasa con los módulos AMD ? Si usa la versión en nombres de archivo, debe cambiar muchos archivos si cambia el número de versión.
knut
3
@junior, esta es una publicación antigua, pero una búsqueda rápida revela que los complementos jquery no siguen ninguna convención en particular. Parece que (1) juntar las palabras, (2) usar la columna vertebral y (3) usar camelCase se usan con una frecuencia más o menos equivalente.
bholben
Sin olvidar que algunas versiones y sistemas de archivos tienen problemas para reconocer la diferencia entre una palabra en minúsculas y la misma palabra en mayúsculas o camelCase (por ejemplo: "ThisWord" es lo mismo que "thisword" en algunos entornos). Algo a tener en cuenta al usar la convención camelCase.
amypellegrini
@knut no debería cargar a través de nombres de versiones, sino asignar el nombre del módulo a un archivo de versión específico.
Dalore
132

No conozco ninguna convención particular para los archivos javascript, ya que no son realmente únicos en la web en comparación con los archivos css o html o cualquier otro tipo de archivo como ese. Hay algunas cosas "seguras" que puede hacer que hacen que sea menos probable que se encuentre accidentalmente con un problema de plataforma cruzada:

  1. Use todos los nombres de archivo en minúsculas. Hay algunos sistemas operativos que no distinguen entre mayúsculas y minúsculas para los nombres de archivo y el uso de todas las minúsculas evita el uso inadvertido de dos archivos que difieren solo en caso de que no funcionen en algunos sistemas operativos.
  2. No use espacios en el nombre del archivo. Si bien esto técnicamente se puede hacer que funcione, hay muchas razones por las cuales los espacios en los nombres de archivo pueden causar problemas.
  3. Un guión está bien para un separador de palabras. Si desea utilizar algún tipo de separador para varias palabras en lugar de un espacio o camello como en various-scripts.js, un guión es un separador seguro y útil y de uso común.
  4. Piense en usar números de versión en sus nombres de archivo. Cuando desee actualizar sus scripts, planifique los efectos del navegador o el almacenamiento en caché de CDN. La forma más sencilla de usar el almacenamiento en caché a largo plazo (para velocidad y eficiencia), pero las actualizaciones inmediatas y seguras cuando actualiza un archivo JS es incluir un número de versión en el nombre de archivo o ruta implementado (como lo hace jQuery con jquery-1.6.2.js ) y luego topa / cambia ese número de versión cada vez que actualiza / cambia el archivo. Esto garantizará que ninguna página que solicite la versión más nueva reciba la versión anterior de un caché.
jfriend00
fuente
56

No existe una convención oficial universal para nombrar archivos JavaScript.

Hay algunas opciones diferentes:

  • scriptName.js
  • script-name.js
  • script_name.js

son convenciones de nomenclatura válidas, sin embargo , prefiero la convención de nomenclatura sugerida de jQuery (para los complementos de jQuery, aunque funciona para cualquier JS)

  • jquery.pluginname.js

La belleza de esta convención de nomenclatura es que describe explícitamente la contaminación global del espacio de nombres que se agrega.

  • foo.js agrega window.foo
  • foo.bar.js agrega window.foo.bar

Porque omití el control de versiones: debe aparecer después del nombre completo, preferiblemente separado por un guión, con puntos entre las versiones principales y secundarias:

  • foo-1.2.1.js
  • foo-1.2.2.js
  • ...
  • foo-2.1.24.js
zzzzBov
fuente
10
+1 para The beauty to this naming convention is that it explicitly describes the global namespace pollution being added., nunca me di cuenta de eso
Adrien Be
2
Mi única pregunta es qué hacer si tienes un archivo que crea Fooo myFoo, ¿simplemente nombrarías el archivo Foo.jso myFoo.jsrespectivamente?
punto
13

La pregunta en el enlace que diste habla sobre el nombre de las variables de JavaScript, no sobre el nombre de los archivos, así que olvídalo para el contexto en el que haces tu pregunta.

En cuanto a la denominación de archivos, es puramente una cuestión de preferencia y gusto. Prefiero nombrar archivos con guiones porque no tengo que buscar la tecla Mayús, como lo hago cuando trato con nombres de archivos camelCase; y porque no tengo que preocuparme por las diferencias entre los nombres de archivo de Windows y Linux (los nombres de archivo de Windows no distinguen entre mayúsculas y minúsculas, al menos a través de XP).

Entonces, la respuesta, como muchas, es "depende" o "depende de usted".

La única regla que debe seguir es ser coherente en la convención que elija.

Pete Wilson
fuente
66
+1 para el guión vs. razonamiento camelCase.
cellepo
6

En general, prefiero guiones en minúsculas, pero una cosa que aún no se menciona es que a veces es bueno que el nombre del archivo coincida exactamente con el nombre de un solo módulo o función instanciable contenida dentro.

Por ejemplo, tengo un módulo revelador declarado var knockoutUtilityModule = function() {...}dentro de su propio archivo llamado knockoutUtilityModule.js, aunque objetivamente prefiero knockout-utility-module.js.

De manera similar, dado que estoy usando un mecanismo de agrupación para combinar scripts, he decidido definir funciones instanciables (modelos de vista en plantilla, etc.) cada una en su propio archivo, estilo C #, para mantenerlas. Por ejemplo, ProductDescriptorViewModel vive solo dentro de ProductDescriptorViewModel.js (uso mayúsculas para funciones instanciables).

Tom W Hall
fuente