Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

.map() + Arrow Function

Referente ao curso JavaScript: conhecendo o Browser e padrões de projeto, no capítulo Temos o modelo, mas e a view? e atividade Dominando o map

por André Bisewski
| 148.2k xp | 96 posts
Dev Front-end

Boa noite!

Estou com dúvida referente aos ' {} ' da arrow function pelo menos quando usado junto ao ' .map() '.

Pois no exercicio 10 (Imprimindo com o map) eu tinha feito da seguinte forma:

let funcionariosTable = funcionarios.map(funcionario => {
        `
          <tr>
            <td>${funcionario.nome}</td>
            <td>${funcionario.endereco}</td>
            <td>${funcionario.salario}</td>
          </tr>
        `
      });
let funcionariosTableConcat = funcionariosTable.join('');
let tbody = document.querySelector("#body");
tbody.innerHTML = funcionariosTableConcat;

E não tinha dado certo. Mas foi só tirar os ' {} ' que funcionou.

Já no exercício 11 (Dominando o map). Eu tinha feito da seguinte forma:

let numeros = [1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 121];
let dobro = numeros.map(num =>
    return num * 2;
);
console.log(dobro);

E não tinha dado certo. Mas foi só adicionar as ' {} ' que funcionou.

Quando deve adicionar ' {} ' e quando não?

1 resposta
solução!
por Gabriel Leite
| 3485k xp | 5398 posts
Instrutor

Boa noite, André! Como vai?

Se vc tirar os parênteses o return fica implícito! Mas, se usar eles, então será obrigado a escrever o return!

Exemplo prático:

let funcionariosTable = funcionarios.map(funcionario => {
        return `
          <tr>
            <td>${funcionario.nome}</td>
            <td>${funcionario.endereco}</td>
            <td>${funcionario.salario}</td>
          </tr>
        `;
});

É o mesmo que:

let funcionariosTable = funcionarios.map(funcionario =>
        `
          <tr>
            <td>${funcionario.nome}</td>
            <td>${funcionario.endereco}</td>
            <td>${funcionario.salario}</td>
          </tr>
        `
);

E, por fim:

let numeros = [1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 121];
let dobro = numeros.map(num => num * 2);

É o mesmo que:

let numeros = [1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 121];
let dobro = numeros.map(num => {
     return num * 2;
});

Conseguiu pegar?

Grande abraço e bons estudos!