Gabor Dolla
Estoy usando babel6
y para mi proyecto favorito estoy creando un envoltorio para XMLHttpRequest
para los métodos que puedo usar:
const open = (method, url, something) => {
return this.xhr.open(method, url, something);
}
Pero para la función de flecha de propiedades no funciona. Esto funciona:
get status() { return this.xhr.status; }
Pero no puedo usar la función de flecha:
get status = () => this.xhr.status;
¿Es esto intencional?
apsilleres
Según la gramática ES2015, una propiedad en un objeto literal solo puede ser una de tres cosas:
Definición de propiedad:
- IdentificadorReferencia
- Nombre de la propiedad
:
AsignaciónExpresión- MétodoDefinición
El único de este tipo que permite una conducción get
es MétodoDefinición:
MétodoDefinición :
- Nombre de la propiedad
(
Parámetros formales estrictos)
{
FunciónCuerpo}
- GeneradorMétodo
get
Nombre de la propiedad(
)
{
FunciónCuerpo}
set
Nombre de la propiedad ( PropertySetParameterListPropertySetParameterList)
{
FunciónCuerpo}
Como puedes ver, el get
form sigue una gramática muy limitada que debe ser de la forma
get NAME () { BODY }
La gramática no permite funciones de la forma get NAME = ...
.
-
Gracias por tu ayuda, acepto tu respuesta. ¿Sabe dónde está definido que getter/setter no se puede usar con una asignación? Sólo curioso.
– Gabor Dolla
20 de noviembre de 2015 a las 13:20
-
@GaborDolla Editado para hacer referencia a la gramática literal del objeto en la especificación ECMAScript.
– apsillers
20 de noviembre de 2015 a las 13:31
el guisante rojo
La respuesta aceptada es genial. Es lo mejor si estás dispuesto a usar normal sintaxis de función en lugar de compacta “sintaxis de función de flecha”.
Pero tal vez realmente te gusten las funciones de flecha; tal vez usas la función de flecha por otra razón que una sintaxis de función normal no puede reemplazar; es posible que necesite una solución diferente.
Por ejemplo, noto que OP usa this
es posible que desee unir this
léxicamente; también conocido como “no vinculante de esto”), y las funciones de flecha son buenas para esa vinculación léxica.
Todavía puede usar una función de flecha con un captador a través de la Object.defineProperty
técnica.
{
...
Object.defineProperty(your_obj, 'status', {
get : () => this.xhr.status
});
...
}
Ver menciones de object initialization
técnica (también conocido como get NAME() {...}
) contra el defineProperty
técnica (también conocido como get : ()=>{}
). Hay al menos una diferencia significativa, usando defineProperty
requiere que las variables ya existan:
Definición de un getter en objetos existentes
es decir, con Object.defineProperty
debes asegurarte de que your_obj
(en mi ejemplo) existe y se guarda en una variable (mientras que con un object-initialization
podría devolver un objeto-literal en la inicialización de su objeto: {..., get(){ }, ... }
). Más información sobre Object.defineProperty
específicamente, aquí
Object.defineProperty(...)
parece tener un soporte de navegador comparable al get NAME(){...}
sintaxis; navegadores modernos, IE 9.
-
Inteligente, pero en última instancia es mucho más detallado que solo:
get status() { return this.xhr.status; }
– devuxer
24 de febrero de 2018 a las 1:23
-
@devuxer Estoy de acuerdo en que es demasiado detallado. Pero para que quede claro, su
this
deber ser el objeto en el que tuget status() { ... }
se define. Pero mithis
pudo ser otra cosa, debido a las diferencias de unión léxica, ¿verdad?– El guisante rojo
24 de febrero de 2018 a las 17:54
-
De acuerdo… aunque en la práctica, no me he encontrado con un caso en el que
this
no es lo que quiero en un descriptor de acceso get. (Losthis
Los beneficios vinculantes de las funciones de flecha parecen entrar en juego cuando se pasan funciones, como con los controladores de eventos y las devoluciones de llamada).– devuxer
26 de febrero de 2018 a las 20:37
-
Estoy de acuerdo, con frecuencia uso flechas gruesas + enlaces léxicos
()=>{}
para las devoluciones de llamadas paso a un Promesame gusta$http(...).then((promise_result)=> this...}))
. Si no uso fat-arrow,this
representará el mundoWindow
objeto; no muy útil Pero rara vez (¿nunca?) he usado()=>{}
como la función para “obtener acceso” como dices … al menosthis
dentro deget()
representará el objeto sobre el queget()
se define (que ya es más útil queWindow
; ¡así que no hay necesidad de usar una función de flecha gruesa!)– El guisante rojo
26 de febrero de 2018 a las 20:48
-
los
defineProperty
El enfoque es útil en bucles. En este momento solo lo usé para exponer algunas propiedades de un objeto chiledo del que lo contiene.–Edurne Pascual
17 oct 2020 a las 11:24
No necesita los corchetes ni el retorno; solo puedes decir
(method, url, something) => this.xhr.open(method. url, something)
.– usuario663031
20 de noviembre de 2015 a las 14:06
get
es parte de un literal de objeto o una definición de clase, una asignación de variable no lo es. ¿Por qué crees que deberían funcionar igual?– Bergi
20 de noviembre de 2015 a las 14:22
status => this.xhr.status
(sintaxis c # 7) o tal vezget status() => this.xhr.status
de hecho, habría sido un gran azúcar sintáctico para la legibilidad, pero Javascript no Typescript no lo admite (¿todavía?)– Charles HETIER
28 de mayo de 2019 a las 15:01
Necesito tanto esto en mi vida!!!
– Cristián E.
30 de agosto de 2021 a las 12:34