Sintaxis para la función de flecha asíncrona

499

Puedo marcar una función de JavaScript como "async" (es decir, devolver una promesa) con la asyncpalabra clave. Me gusta esto:

async function foo() {
  // do something
}

¿Cuál es la sintaxis equivalente para las funciones de flecha?

BonsaiOak
fuente
2
Vale la pena señalar que al menos Firefox y Babel te permiten hacer eso
Jaromanda X
15
var foo = async () => await Promise.resolve('ha');- funciona bien
Jaromanda X
2
decir it doesn't workeso no tiene sentido ... ¿estás recibiendo un error? tal vez estás haciendo algo mal, sin el código que "no funciona" y una descripción significativa de cómo no funciona, solo puedes adivinar que estás haciendo algo mal (o usando un navegador antiguo)
Jaromanda X
1
bien puede ser @Pointy, pero funciona de forma nativa en Firefox y Chrome y node.js actuales (7.7.4)
Jaromanda X
1
La especificación ES2017 tiene una sección sobre definiciones de función de flecha asíncrona @Pointy.
Heretic Monkey

Respuestas:

845

Las funciones de flecha asíncronas se ven así:

const foo = async () => {
  // do something
}

Las funciones de flecha asíncronas se ven así para un solo argumento que se le pasa:

const foo = async evt => {
  // do something with evt
}

Las funciones de flecha asíncronas se ven así para múltiples argumentos pasados:

const foo = async (evt, callback) => {
  // do something with evt
  // return response with callback
}

La forma anónima también funciona:

const foo = async function() {
  // do something
}

Una declaración de función asíncrona se ve así:

async function foo() {
  // do something
}

Uso de la función asíncrona en una devolución de llamada :

const foo = event.onCall(async () => {
  // do something
})
BonsaiOak
fuente
11
El OP parece estar buscando una función de flecha con nombre, asíncrona, que es la sintaxis que no muestra.
jfriend00
48
En realidad, const foo = async () => {}crea una función asíncrona con nombre llamada foo. Es completamente posible hacer funciones con nombre de esta manera (simplemente sin izar). En ES2016 +, la asignación de una función anónima a una variable la nombra después de la variable si se declara allí.
Benjamin Gruenbaum
55
@BenjaminGruenbaum Por favor, no lo llame función nombrada. En js, una función anónima con nombre es una sintaxis muy específica foo = function bar () {}que se creó para reemplazar arguments.calleeal escribir funciones anónimas recursivas. Lo que tienes allí es una variable llamada fooque es una referencia a una función.
slebetman
18
@slebetman desde ES2015 cuando hace const foo = async () => {}el nombre de la función se establece en foo- ecma-international.org/ecma-262/6.0/… y ecma-international.org/ecma-262/6.0/… - vea la discusión en esdiscuss.org / tema / ...
Benjamin Gruenbaum
1
@FarisRayhan Es como con otras constantes, la referencia de la variable somefunctionno se puede cambiar después de que se establece. (Señala su función asincrónica anónima.)
Qwerty
129

Esta es la forma más simple de asignar una expresión deasync función de flecha a una variable con nombre :

const foo = async () => {
  // do something
}

(Tenga en cuenta que esto no es estrictamente equivalente a async function foo() { }. Además de las diferencias entre la functionpalabra clave y una expresión de flecha , la función en esta respuesta no está "elevada al principio" ).

Edoardo L'Astorina
fuente
11
Tenga en cuenta que una expresión de función con nombre es una sintaxis muy específica en javascript. Esta NO es una expresión de función con nombre. Usar las palabras correctas es importante para evitar confusión más adelante cuando una frase puede evolucionar para significar dos cosas. Para su información, una expresión de función con nombre es: foo = function myName () {}. El nombre es myNamey se especifica que solo existe dentro de la función anónima y no está definido en ningún lado. Su propósito es reemplazar arguments.calleeal escribir funciones anónimas recursivas.
slebetman
1
Estaba a punto de disputarte @slebetman sobre tecnicismo, ya que esta es una expresión de función (flecha) y terminas con una función con nombre (es decir foo.name === 'foo'). Pero solo porque está en el inicializador de una const* declaración *, lo que significa que no es del todo correcto llamar a esto una "expresión de función de flecha asíncrona con nombre". También tiene razón en que el nombre de una expresión de función nombrada solo está vinculado dentro de su propio cuerpo, pero también se almacena en la namepropiedad de la función , lo cual es bueno para la depuración (y es más a menudo la razón por la que los nombraría).
Vaz
3
Para decirlo de otra manera, no existe una "expresión de función de flecha con nombre", pero puede convertirse en "nombre" al ser parte de una declaración const o let (no estoy seguro acerca de var debido al izado), en el sentido de tener un nombre fn.nameademás de tener un enlace en alcance (la variable).
Vaz
41

Función de flecha asíncrona invocada inmediatamente:

(async () => {
    console.log(await asyncFunction());
})();

Expresión de función asincrónica invocada inmediatamente:

(async function () {
    console.log(await asyncFunction());
})();
Miguel
fuente
18

Sintaxis de la función de flecha asíncrona con parámetros

const myFunction = async (a, b, c) => {
   // Code here
}
codemirror
fuente
17

Ejemplo básico

folder = async () => {
    let fold = await getFold();
    //await localStorage.save('folder');
    return fold;
  };
Chaurasia
fuente
13

También puedes hacer:

 YourAsyncFunctionName = async (value) => {

    /* Code goes here */

}
Justin E. Samuels
fuente
44
con un parámetro no necesitas paréntesis. YourAsyncFunctionName = async value => {/ * El código va aquí * /}
Takács Zsolt