Como transformar array em string separada por vírgula em JavaScript

Neste artigo você vai aprender a como transformar array em string separada por vírgula em JavaScript, com o uso de apenas uma função!

Fala programador(a), beleza? Bora aprender mais sobre arrays, strings e JavaScript!

Basicamente toda estrutura de array são de itens separados por vírgula, certo?

Podemos precisar de todos eles em apenas uma string, para listar tags por exemplo

E isso pode ser facilmente com o método join, que tem como propósito unir uma lista

Basta apenas escolher um separador e passar a lista, no nosso caso o separador de itens é uma vírgula

Veja um exemplo do código necessário:

const arr = ["My", "List", "Full", "Of", "Items"]

const myString = arr.join(", ")

console.log(myString) // "My, List, Full, Of, Items"

console.log(typeof myString) // string

No exemplo acima temos a execução do método split em um array chamado arr

Passamos como separador uma vírgula e um espaço, aqui é livre você pode passar o que precisar

Como resultado temos uma string separada por vírgula, o tipo foi checado na última linha

E é apenas isso que precisamos fazer! 🙂

Conclusão

Neste artigo você viu como transformar array em string separada por vírgula em JavaScript

Utilizamos o método split, que devemos executar em um array e como argumento precisamos passar o separador da nova string gerada

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias!Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias. O link acima contém um cupom de desconto para os cursos!

E se eu quiser outro separador?

A vírgula é só o mais comum, mas o join aceita qualquer coisa que você passar como separador

Quer juntar com hífen, com barra, com pipe ou até com uma quebra de linha? é só trocar o argumento

console.log(arr.join(" – ")) // "My – List – Full – Of – Items"

console.log(arr.join("/")) // "My/List/Full/Of/Items"

console.log(arr.join("")) // "MyListFullOfItems"

Se você passar uma string vazia, os itens grudam sem nada no meio

E se você não passar separador nenhum e chamar só arr.join(), o padrão já é a vírgula (sem espaço)

Como fazer o contrário: string separada por vírgula de volta pra array

Muita gente cai aqui querendo também o caminho inverso, transformar aquela string de volta em array

Pra isso existe o método split, que faz o oposto do join

Você passa o separador e ele quebra a string numa lista

const myString = "My, List, Full, Of, Items"

const arr = myString.split(", ")

console.log(typeof arr) // object (array)

Guarde essa dupla: join junta o array numa string, split quebra a string num array

O join muda o array original?

Não muda

O join só lê a lista e devolve uma string nova, o array continua igualzinho depois

const myString = arr.join(", ")

Então pode usar sem medo de bagunçar seus dados