¿Cómo escribo una función de flecha con nombre en ES2015?

Tengo una función que estoy tratando de convertir a la nueva sintaxis de flecha en ES6 . Es una función con nombre:

function sayHello(name) {
    console.log(name + ' says hello');
}

¿Hay alguna manera de darle un nombre sin una declaración var:

var sayHello = (name) => {
    console.log(name + ' says hello');
}

Obviamente, solo puedo usar esta función después de haberla definido. Algo como lo siguiente:

sayHello = (name) => {
        console.log(name + ' says hello');
    }

¿Hay una nueva forma de hacer esto en ES6 ?

¿Cómo escribo una función de flecha con nombre en ES2015?

Lo hace de la manera que descartó en su pregunta: lo coloca en el lado derecho de una asignación o inicializador de propiedad donde el motor de JavaScript puede usar razonablemente la variable o el nombre de la propiedad como nombre. No hay otra forma de hacerlo, pero hacerlo es correcto y está completamente cubierto por la especificación.

Por especificación, esta función tiene un nombre verdadero sayHello:

var sayHello = name => {
    console.log(name + ' says hello');
};

Esto se define en Operadores de asignación> Semántica de tiempo de ejecución: evaluación donde llama a la SetFunctionNameoperación abstracta (esa llamada se encuentra actualmente en el paso 1.e.iii).

De manera similar, Runtime Semantics: PropertyDefinitionEvaluation llama SetFunctionNamey, por lo tanto, le da a esta función un nombre verdadero:

let o = {
    sayHello: name => {
        console.log(`${name} says hello`);
    }
};

Los motores modernos ya establecen el nombre interno de la función para declaraciones como esa; Edge todavía tiene el bit que lo hace disponible como nameen la instancia de la función detrás de un indicador de tiempo de ejecución.

Por ejemplo, en Chrome o Firefox, abra la consola web y luego ejecute este fragmento:

"use strict";
let foo = () => { throw new Error(); };
console.log("foo.name is: " + foo.name);
try {
  foo();
} catch (e) {
  console.log(e.stack);
}

En Chrome 51 y superior y Firefox 53 y superior (y Edge 13 y superior con una marca experimental), cuando ejecute eso, verá:

foo.name es: foo
Error
    en foo (http://stacksnippets.net/js:14:23)
    en http://stacksnippets.net/js:17:3

Tenga en cuenta la foo.name is: fooy Error...at foo.

En Chrome 50 y versiones anteriores, Firefox 52 y versiones anteriores, y Edge sin la marca experimental, verás esto porque no tienen la Function#namepropiedad (todavía):

foo.name es: 
Error
    en foo (http://stacksnippets.net/js:14:23)
    en http://stacksnippets.net/js:17:3

Tenga en cuenta que el nombre no se encuentra en foo.name is:, pero se muestra en el seguimiento de la pila. Es solo que realmente implementando la name propiedad en la función era de menor prioridad que otras características de ES2015; Chrome y Firefox lo tienen ahora; Edge lo tiene detrás de una bandera, presumiblemente ya no estará detrás de la bandera por mucho tiempo.

Obviamente, solo puedo usar esta función después de haberla definido

Correcto. No hay sintaxis de declaración de función para las funciones de flecha, solo la sintaxis de expresión de función , y no hay una flecha equivalente al nombre en una expresión de función con nombre de estilo antiguo ( var f = function foo() { };). Entonces no hay equivalente a:

console.log(function fact(n) {
    if (n < 0) {
        throw new Error("Not defined for negative numbers");
    }
    return n == 0 ? 1 : n * fact(n - 1);
}(5)); // 120

Tienes que dividirlo en dos expresiones (argumentaría que deberías hacerlo de todos modos ) :

let fact = n => {
    if (n < 0) {
      throw new Error("Not defined for negative numbers.");
    }
    return n == 0 ? 1 : n * fact(n - 1);
};
console.log(fact(5));

Por supuesto, si tiene que poner esto donde se requiere una sola expresión, siempre puede ... usar una función de flecha:

console.log((() => {
    let fact = n => {
        if (n < 0) {
            throw new Error("Not defined for negative numbers.");
        }
        return n == 0 ? 1 : n * fact(n - 1);
    };
    return fact(5);
})()); // 120

No digo que sea bonito, pero funciona si necesitas absolutamente un contenedor de expresión.

No. La sintaxis de la flecha es una forma abreviada de funciones anónimas. Las funciones anónimas son, bueno, anónimas.

Las funciones con nombre se definen con la functionpalabra clave.

Si por "nombre", quiere decir que desea .nameestablecer la propiedad de su función de flecha, tiene suerte.

Si se define una función de flecha en el lado derecho de una expresión de asignación, el motor tomará el nombre en el lado izquierdo y lo usará para establecer la función de flecha .name, por ejemplo

var sayHello = (name) => {
    console.log(name + ' says hello');
}

sayHello.name //=== 'sayHello'

Habiendo dicho eso, su pregunta parece ser más "¿puedo obtener una función de flecha para izar?". Me temo que la respuesta a esa pregunta es un gran "no".

Parece que esto será posible con ES7: https://babeljs.io/blog/2015/06/07/react-on-es6-plus#arrow-functions

El ejemplo dado es:

class PostInfo extends React.Component {
  handleOptionsButtonClick = (e) => {
    this.setState({showOptionsModal: true});
  }
}

El cuerpo de las funciones de flecha de ES6 comparte el mismo léxico que el código que las rodea, lo que nos da el resultado deseado debido a la forma en que se definen los inicializadores de propiedades de ES7.

Tenga en cuenta que para que esto funcione con babel, necesitaba habilitar la sintaxis más experimental de la etapa 0 de ES7. En mi archivo webpack.config.js actualicé el cargador de babel así:

{test: /\.js$/, exclude: /node_modules/, loader: 'babel?stage=0'},

En realidad, parece que una forma de nombrar las funciones de flecha (al menos a partir de Chrome 77 ...) es hacer esto:

"use strict";
let fn_names = {};
fn_names.foo = () => { throw new Error(); };
console.log("foo.name is: " + foo.name);
try {
  foo();
} catch (e) {
  console.log(e.stack);
}

para escribir una función de flecha con nombre, puedes usar el siguiente ejemplo, donde tengo una clase llamada LoginClass y dentro de esta clase escribí una flecha llamada función , llamada successAuth clase LoginClass {

    constructor() {

    }

    successAuth = (dataArgs)=> { //named arow function

    }

}

ESTO ES ES6

Sí, creo que lo que buscas es algo como esto:

const foo = (depth) => {console.log("hi i'm Adele")}
foo -> // the function itself
foo() -> // "hi i'm Adele"

Puede omitir la parte de la función y la parte de la flecha para crear funciones. Ejemplo:

 class YourClassNameHere{

   constructor(age) {
     this.age = age;
   }

   foo() {
     return "This is a function with name Foo";
   }

   bar() {
     return "This is a function with name bar";
   }

 }

let myVar = new YourClassNameHere(50);
myVar.foo();