¿Cómo hago referencia a una propiedad de objeto JavaScript con un guión?
Estoy usando este script para crear un objeto de estilo de todos los estilos heredados, etc.
var style = css($(this));
alert (style.width);
alert (style.text-align);
Con lo siguiente, la primera alerta funcionará bien, pero la segunda no... -
Supongo que se interpreta como un signo negativo. El depurador dice "error de referencia no detectado". Sin embargo, no puedo ponerlo entre comillas porque no es una cadena. Entonces, ¿cómo uso esta propiedad de objeto?
Mira los comentarios. Verá que para las propiedades CSS, la notación clave no es compatible con varias propiedades. Por lo tanto, utilizar la notación de clave de caso de camello es la forma actual:
obj.style-attr // would become
obj["styleAttr"]
Utilice notación clave en lugar de punto
style["text-align"]
Todas las matrices en JavaScript son objetos y todos los objetos son solo matrices asociativas. Esto significa que puede hacer referencia a un lugar en un objeto tal como lo haría con una clave en una matriz.
arr[0]
o el objeto
obj["method"] == obj.method
Un par de cosas para recordar al acceder a propiedades de esta manera:
se evalúan, así que use cadenas a menos que esté haciendo algo con un contador o usando nombres de métodos dinámicos.
Esto significa que obj[método] le daría un error indefinido mientras que obj["método"] no.
Debe utilizar esta notación si utiliza caracteres que no están permitidos en las variables de JavaScript.
Esta expresión regular lo resume bastante bien:
[a-zA-Z_$][0-9a-zA-Z_$]*
La respuesta a la pregunta original es: coloque el nombre de la propiedad entre comillas y use la indexación de estilo de matriz:
obj['property-with-hyphens'];
Varios han señalado que la propiedad que le interesa es una propiedad CSS. Las propiedades CSS que tienen guiones se convierten automáticamente a mayúsculas y minúsculas. En ese caso debes usar el nombre en caja de camello como:
style.textAlign;
Sin embargo, esta solución sólo funciona para propiedades CSS. Por ejemplo,
obj['a-b'] = 2;
alert(obj.aB); // undefined
alert(obj['a-b']); // 2