JavaScript

Criar propriedade em objeto por variável em JavaScript

10 de julho de 2022

Criar propriedade em objeto por variável em JavaScript

Neste artigo você vai aprender a como criar propriedade em objeto por variável em JavaScript, utilizando uma estratégia super simples

Criar propriedade em objeto por variável capa

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

Em JS temos a notação de ponto para criar novas propriedades em objetos

O problema é que ela não funciona muito bem com variáveis, pois cria simplesmente a nova propriedade com algum valor que nós determinamos

Então como alterar o nome de uma propriedade baseado em uma variável?

Geralmente temos uma string armazenada e queremos que ela seja o nome da variável

Tendo esse efeito de propriedade dinâmica

Neste caso temos que utilizar a notação de colchetes, que funciona da mesma maneira que a de ponto

Mas no dá essa funcionalidade a mais, veja este exemplo:

const x = "name"
const y = "Matheus"

const obj = {}

obj[x] = y

console.log(obj.name) // Matheus

Aqui criamos tanto a propriedade quanto o valor com variáveis, mas os dois são opcionais

No objeto após a utilização da notação de colchetes, temos a propriedade name com o valor de Matheus

Ambas oriundas de variáveis, e não de simples strings que nós precisamos digitar

Isso adiciona dinamicidade ao projeto, permitindo qualquer valor como propriedade, legal né? 🙂

Conclusão

Neste artigo você viu como criar propriedade em objeto por variável em JavaScript

Utilizamos a notação de colchete, que nos permite inserir valores dinâmicos

Basta então passar a variável alvo, e teremos a nova propriedade criada

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

Subscribe
Notify of
guest
2 Comentários
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Pequeno desenvolvedor web

Excelente dicas

Battisti

valeu!

2
0
Would love your thoughts, please comment.x