typescript - ¿Cuál es el estándar o la mejor práctica con respecto a las comillas en las claves de JavaScript?

He estado revisando varias preguntas como esta para ver si existe una práctica estándar o una mejor práctica sobre si se deben poner comillas en las claves en JavaScript, JSX o TSX. Sin embargo, no he encontrado nada y me gustaría saber (antes de construir un proyecto enorme con malas prácticas) cuál es mejor entre:

obj = {'foo': 'bar'}

y

obj = {foo: 'bar'}

O mejor aún, ¿hay algún documento al que pueda referirme para esto?

Respuesta #1

consulta la Guía de Estilo de JavaScript de Airbnb. Tiene un conjunto estándar de directrices y mejores prácticas.

• 3.6 Solo cite propiedades que sean identificadores no válidos. eslint: quote-props

¿Por qué? En general, lo consideramos subjetivamente más fácil de leer. Mejora el resaltado de sintaxis y también es más fácilmente optimizable por muchos motores de JS.

// bad
const bad = {
  'foo': 3,
  'bar': 4,
  'data-blah': 5,
};

// good
const good = {
  foo: 3,
  bar: 4,
  'data-blah': 5,
};

Respuesta #2

La documentación de ESLint tiene algunas observaciones sobre esto:

En muchos casos, no importa si eliges usar un identificador en lugar de una cadena o viceversa. Aun así, podrías decidir imponer un estilo consistente en tu código.

Sin embargo, hay algunas ocasiones en las que debes usar comillas:

• Si estás usando un motor de JavaScript ECMAScript 3 (como IE8) y quieres usar una palabra clave (como if) como nombre de propiedad. Esta restricción se eliminó en ECMAScript 5.
• Quieres usar un carácter que no sea un identificador en el nombre de tu propiedad, como tener una propiedad con un espacio como "uno dos".

Otro ejemplo donde las comillas sí importan es cuando se usan literales numéricos como claves de propiedad:

var object = { 1e2: 1, 100: 2 };

En mi opinión, es bueno usar comillas cuando sea necesario.