Fala ai Thiago, tudo bem? Vamos lá:
Então gostaria que alguém pudesse me explicar para que serve e a necessidade de utilizar a referida função nessa parte do código. Obrigado!
O join serve para você transformar um array em string, mas, porque eu faria isso? No seu caso, como você está montando um código HTML através de um array você precisa garantir que o resultado do seu template será uma string.
Por padrão, se você utilizar passar um array para um template string ele vai chamar uma função toString existente em todo array por padrão, exemplo:
`${[1,2,3]}`
O resultado dessa template string seria: "1,2,3".
Repare que cada item do array por padrão é separado com uma vírgula, agora se você testar o mesmo array com o join:
`${[1,2,3].join('')}`
Repare que o resultado é: "123".
Ou seja, a gente transformou nosso array em string, porém, removemos o separador dos itens, isso porque passamos uma string vazia para o join, no caso: .join(''). Essa string vazia seria o separador.
Agora voltando para seu código (código da aula):
<tbody>
${model.negociacoes.map(n => {
return `
<tr>
<td>${DateHelper.dataParaTexto(n.data)}</td>
<td>${n.quantidade}</td>
<td>${n.valor}</td>
<td>${n.volume}</td>
</tr>
`
}).join('')}
</tbody>
Se você remover o join, a template string vai inserir uma vírgula entre cada tr na página. Por isso foi utilizado o join, para que não existe essa vírgula.
Espero ter ajudado.
