DEV Community

Jose Juarez Junior
Jose Juarez Junior

Posted on

JavaScript | POJO

POJO - Plain Old JavaScript Object

POJO (termo emprestado da linguagem Java) em JavaScript é um um "objeto JavaScript puro", sem mágica, sem herança, sem comportamento espcial. Apenas dados simples. Em JavaScript, um objeto é um armazenamento de dados chave-valor.

Declarando um objeto vazio:

let o1 = {};
let o2 = new Object();
Enter fullscreen mode Exit fullscreen mode

Atribuindo uma propriedade e valor ao objeto criado.

o1.name = "Whiskey";
o1["name"] = "Whiskey";
Enter fullscreen mode Exit fullscreen mode

Criando um objeto com propriedades:

const pet = {
    species: "Dog",
    name: "Antônio",
    age: 3
};
Enter fullscreen mode Exit fullscreen mode

No console do navegador:

typeof pet // retorna 'object'
Enter fullscreen mode Exit fullscreen mode

Com a chave, recuperamos o valor.

pet.name // retorna 'Antônio'

pet["name"] // retorna 'Antônio'
Enter fullscreen mode Exit fullscreen mode

Qual a diferença entre a sintaxe "object.key" e "object["key"]?
A segunda sintaxe permite trabalhar com expressões. Por exemplo:

const key = "species".
Enter fullscreen mode Exit fullscreen mode

No console do navegador:

pet["species"] // Retorna 'Dog'

pet.key // retorna undefined
Enter fullscreen mode Exit fullscreen mode

Propriedades que não existem, são avaliadas como undefined, ao contrário de outras línguas como C# ou Java, por exemplo, que irão lançar uma excessão (erro). Exemplo:

pet["color"] // retorna undefined
Enter fullscreen mode Exit fullscreen mode

Todas os nome de chave serão transformados em strings (stringified em inglês). Exemplo:

pet[1] = "hello";
pet["1"] = "goodbye";
Enter fullscreen mode Exit fullscreen mode

No console do navegador:

pet[1]; // retorna "goodbye"
Enter fullscreen mode Exit fullscreen mode

Isso significa que não importa o que eu digite na chave, ela sempre é transformada em string.

No objeto posso inserir arrays, outros objetos aninhados, funções:

pet.friends = [];
Enter fullscreen mode Exit fullscreen mode

No console do navegador:

> pet
< {species: 'Dog', name: 'Antônio', age: 3, frieds: Array(0)}
Enter fullscreen mode Exit fullscreen mode

Adicionando uma função:

antonio.bark = function() { return "Woof Woof!" };
antonio.bark(); // retorna Woof Woof!
Enter fullscreen mode Exit fullscreen mode

Top comments (0)