Obtenha a chave de um objeto JavaScript

1. Obtenha a chave de um objeto javascript com o método Object.keys()
2. Obtenha as chaves de um objeto javascript com o método Object.entries(obj)
3. Obtenha a chave de um objeto javascript usando o loop for

Um objeto javascript é uma coleção de pares de valores-chave. Precisamos de uma chave para obter seu valor de um objeto javascript. Os pares de valores-chave são amplamente usados ​​em comunicações cliente-servidor e programação JavaScript. Estamos cientes de que recuperamos um valor de um objeto JSON, desde que tenhamos sua chave. Mas e se não tivermos o nome da chave? Como obtemos seu valor do objeto Javsscript? Vejamos algumas maneiras pelas quais podemos obter as chaves de um objeto javascript.

Obtenha a chave de um objeto javascript com o método Object.keys()

A função Object.keys() retorna um array contendo as chaves do objeto javascript. Passamos o objeto javascript como um parâmetro para a função Object.keys(). A matriz de saída contém as chaves na mesma ordem em que estão no objeto javascript original. Se passarmos um array para Object.keys(), ele retornará os índices do array como saída. E o objeto de parâmetro é com índices, então o Object.keys() retornará um array desses índices. Consulte o código a seguir para entender o uso e o comportamento da função Object.keys().

var fruitsArr1 = ['Apple', 'Orange', 'Mango', 'Banana'];
var fruitsObj2 = {0: 'Apple', 4: 'Orange', 2: 'Mango', 3: 'Banana'};
var fruitsObj3 = {'id': '1', 'name': 'mango', 'color': 'yellow'};
console.log(Object.keys(fruitsArr1));
console.log(Object.keys(fruitsObj2));
console.log(Object.keys(fruitsObj3));

Produção:

["0", "1", "2", "3"]
["0", "2", "3", "4"]
["id", "name", "color"]

Se as chaves forem números, a função Object.keys() retornará um array das chaves numéricas em ordem de classificação. O fruitsObj2 possui as teclas numeradas 0, 4, 2, 3. Mas quando aplicamos a função Object.keys(), ela retorna as chaves como ["0", "2", "3", "4"] que está em uma ordem de classificação. O valor-chave ainda manterá o mesmo mapeamento de valor que tinha para o objeto javascript original. Por exemplo, o fruitsObj2 contém 4: "Orange" e em 2: "Mango", mas Object.keys(fruitsObj2) retornou seu pedido como "2", "4". Se formos console.log seus valores nas teclas 2 e 4, obteremos os valores corretos como saída. Conseqüentemente, a função não modificou nada no mapeamento de valor-chave real, mesmo se Object.keys retornar as chaves numéricas de um array ou um objeto em ordem classificada. Consulte o código a seguir.

console.log(fruitsObj2[2]);
console.log(fruitsObj2[4]);

Produção:

Mango
Orange

Obtenha as chaves de um objeto javascript com o método Object.entries(obj)

O método Object.entries(obj) é diverso e é mais flexível do que a função Object.keys(). Ele divide o objeto inteiro em pequenas matrizes. Cada matriz consiste em pares de valores-chave no formato [chave, valor]. Usando Object.keys(), obtemos apenas as chaves de um objeto, mas usando o Object.entries(obj), podemos obter todas as entradas em um objeto, incluindo as keys e seus valores . Object.entries(obj) não é um método comumente usado. Na maioria dos cenários, precisaremos obter as chaves de um objeto. Os valores correspondentes podem ser obtidos facilmente com a ajuda de keys.

Sintaxe

Object.entries(object)

Parâmetros

Da mesma forma que o método Object.keys(), o Object.entries(obj) aceita o objeto javascript como parâmetro.

Retornar

Object.entries(obj) retorna os pares chave-valor destruídos em matrizes. O tipo de retorno será um array de arrayes, cada submatriz contendo dois elementos: a chave e o valor. Algo como [[chave1, valor1], [chave2, valor2], [chave3, valor3] ...]. A função preserva a ordem dos atributos do objeto. Na implementação nos bastidores, os pares de valores-chave são formados pela iteração das propriedades do objeto. Consulte o código a seguir para entender melhor o comportamento da função Object.entries(). Usamos JSON.stringify() para obter uma versão de string legível por humanos dos valores de saída da função.

var fruitsObj3 = {'id': '1', 'name': 'mango', 'color': 'yellow'};
console.log(JSON.stringify(Object.entries(fruitsObj3)));

Produção:

"[["id","1"],["name","mango"],["color","yellow"]]"

Podemos usar Object.entries() de outra maneira. Podemos iterar sobre o objeto javascript e registrar as chaves de atributo e seus valores. A abordagem é descrita pelo seguinte trecho de código.

for (const [key, value] of Object.entries(fruitsObj3)) {
  console.log(`${key}: ${value}`);
}

Produção:

id: 1
name: mango
color: yellow

Se estivermos interessados ​​em obter a chave sozinha da função Object.entries(), podemos registrar a chave e descartar a parte do valor.

Obtenha a chave de um objeto javascript usando o loop for

Podemos usar um loop for simples para obter as chaves de um objeto? Não é um recurso comumente conhecido de um loop for. Podemos iterar por meio de qualquer objeto javascript como fazemos para arrays usando a combinação for-in. Ele itera por meio de cada parâmetro com o i (o iterador) segurando a chave do objeto e o object[i] segurando o valor correspondente à chave no objeto. Vejamos o código a seguir para entender melhor o conceito.

var obj = {'id': '1', 'name': 'mango', 'color': 'green'};
for (let i in obj) {
  console.log(i);       // key
  console.log(obj[i]);  // value against the key
}

Produção:

id
1
name
mango
color
green

var a = {
  'id': '1',
  'name': 'mango',
  'color': {'name': 'yellow', 'appearance': 'bright'}
};
for (let i in a) {
  console.log(i);
  console.log(a[i]);
}

Produção:

id
1
name
mango
color
{name: "yellow", appearance: "bright"}