Obtener la clave de un objeto JavaScript

1. Obtener la clave de un objeto javascript con el método Object.keys()
2. Obtener claves de un objeto javascript con el método Object.entries(obj)
3. Obtener la clave de un objeto javascript usando el bucle for

Un objeto javascript es una colección de pares clave-valor. Necesitamos una clave para obtener su valor de un objeto javascript. Los pares clave-valor se utilizan ampliamente en las comunicaciones cliente-servidor y en la programación de JavaScript. Somos conscientes de la recuperación de un valor de un objeto JSON siempre que tengamos su clave. Pero, ¿y si no tenemos el nombre de la clave? ¿Cómo obtenemos su valor del objeto Javsscript? Veamos algunas formas en las que podemos obtener las claves de un objeto javascript.

Obtener la clave de un objeto javascript con el método Object.keys()

La función Object.keys() devuelve un array que contiene las claves del objeto javascript. Pasamos el objeto javascript como parámetro a la función Object.keys(). el array de salida contiene las claves en el mismo orden en que están en el objeto javascript original. Si pasamos un array a Object.keys(), devolverá los índices del array como salida. Y el objeto de parámetro es con índices, entonces el Object.keys() devolverá un array de esos índices. Consulte el siguiente código para comprender el uso y el comportamiento de la función 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));

Producción :

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

Si las claves son números, la función Object.keys() devolverá un array de las teclas numéricas en orden ordenado. El fruitObj2 tiene las teclas numeradas 0, 4, 2, 3. Pero cuando aplicamos la función Object.keys(), devuelve las claves como ["0", "2", "3", "4"] que está en un orden ordenado. El valor-clave seguirá teniendo la misma asignación de valor que tenía para el objeto javascript original. Por ejemplo, fruitsObj2 contiene 4:" Naranja " y 2: "Mango", pero Object.keys(fruitsObj2) devolvió su orden como "2", "4". Si estuviéramos en console.log sus valores en las teclas 2 y 4, obtenemos los valores correctos como salida. Por lo tanto, la función no ha modificado nada en la asignación real de clave-valor, incluso si Object.keys devuelve las claves numéricas de un array o un objeto en orden ordenado. Consulte el siguiente código.

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

Producción :

Mango
Orange

Obtener claves de un objeto javascript con el método Object.entries(obj)

El método Object.entries(obj) es diverso y más flexible que la función Object.keys(). Divide todo el objeto en pequeñas matrices. Cada matriz consta de pares clave-valor con el formato [clave, valor]. Usando Object.keys(), obtenemos solo las claves de un objeto, pero usando Object.entries(obj), podemos obtener todas las entradas en un objeto, incluyendo las claves y sus valores . Object.entries(obj) no es un método de uso común. En la mayoría de los escenarios, necesitaremos obtener las claves de un objeto. Los valores correspondientes se pueden obtener fácilmente con la ayuda de claves.

Sintaxis

Object.entries(object)

Parámetros

Al igual que el método Object.keys(), el Object.entries(obj) acepta el objeto javascript como parámetro.

Regreso

Object.entries(obj) devuelve los pares clave-valor destruidos en matrices. El tipo de retorno será un array de matrices, cada submatriz contiene dos elementos: la clave y el valor. Algo como [[clave1, valor1], [clave2, valor2], [clave3, valor3] ...]. La función conserva el orden de los atributos del objeto. En la implementación detrás de escena, los pares clave-valor se forman iterando sobre las propiedades del objeto. Consulte el siguiente código para comprender mejor el comportamiento de la función Object.entries(). Usamos JSON.stringify() para obtener una versión de cadena legible por humanos de los valores generados por la función.

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

Producción :

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

Podemos usar Object.entries() de otra manera. Podemos iterar sobre el objeto javascript y registrar las claves de atributo y sus valores. El enfoque es como se muestra en el siguiente fragmento de código.

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

Producción :

id: 1
name: mango
color: yellow

Si estamos interesados ​​en obtener la clave solo de la función Object.entries(), podemos registrar la clave y descartar la parte del valor.

Obtener la clave de un objeto javascript usando el bucle for

¿Podemos usar un simple bucle for para obtener las claves de un objeto? No es una característica comúnmente conocida de un bucle for. Podemos iterar a través de cualquier objeto javascript como lo hacemos con los arrays usando la combinación for-in. Itera a través de cada parámetro con la i (el iterador) sosteniendo la clave del objeto y el object[i] sosteniendo el valor correspondiente a la clave en el objeto. Veamos el siguiente código para comprender mejor el concepto.

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
}

Producción :

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]);
}

Producción :

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