Quando devo usar o `return` em es6 Arrow Functions?

As novas funções da seta es6 dizem que o return é implícito sob algumas circunstâncias:

A expressão também é o valor de retorno implícito dessa function.

Em que casos eu preciso usar o return com funções de seta es6?

    Jackson respondeu parcialmente a isso em uma pergunta semelhante:

    Retorno implícito, mas somente se não houver bloqueio.

    • Isso resultará em erros quando um one-liner se expande para várias linhas e o programador se esquece de adicionar um return .
    • O retorno implícito é sintaticamente ambíguo. (name) => {id: name} retorna o object {id: name} … certo? Errado. Ele retorna undefined . Essas chaves são um bloco explícito. id: é um label.

    Eu adicionaria a isso a definição de um bloco :

    Uma instrução block (ou instrução composta em outros idiomas) é usada para agrupar zero ou mais instruções. O bloco é delimitado por um par de chaves.

    Exemplos :

     // returns: undefined // explanation: an empty block with an implicit return ((name) => {})() // returns: 'Hi Jess' // explanation: no block means implicit return ((name) => 'Hi ' + name)('Jess') // returns: undefined // explanation: explicit return required inside block, but is missing. ((name) => {'Hi ' + name})('Jess') // returns: 'Hi Jess' // explanation: explicit return in block exists ((name) => {return 'Hi ' + name})('Jess') // returns: undefined // explanation: a block containing a single label. No explicit return. // more: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label ((name) => {id: name})('Jess') // returns: {id: 'Jess'} // explanation: implicit return of expression ( ) which evaluates to an object ((name) => ({id: name}))('Jess') // returns: {id: 'Jess'} // explanation: explicit return inside block returns object ((name) => {return {id: name}})('Jess') 

    Eu entendo esta regra de ouro …

    Para funções que são efetivamente transformadas (manipulações de argumentos de uma linha), o retorno é implícito.

    Candidatos são:

     // square-root value => Math.sqrt(value) // sum (a,b) => a+b 

    Para outras operações (mais de uma linha que requerem um bloco, o retorno tem que ser explícito

    As funções de seta permitem que você tenha um retorno implícito: os valores são retornados sem a necessidade de usar a palavra-chave return .

    Ele funciona quando há uma instrução on-line no corpo da function:

     const myFunction = () => 'test' console.log(myFunction()) //'test' 

    Há outro caso aqui.

    Ao escrever um componente funcional no React, você pode usar parênteses para agrupar o JSX retornado implicitamente.

     const FunctionalComponent = () => ( 
    );