JavaScript gets the key and value in an array object

Scene reappearance

In the project development of the backend management system, it is very important to process the data returned by the backend interface. Sometimes the returned value isjson formatAt this time, we need to obtain the value through keys. Therefore, this article takes this as the main line and introduces in detail three methods to obtain the key values ​​of the keys and value objects in the array object.

Method 1: use()methodGet the key of a javascript object
Method 2:use(obj)methodGet the key of a javascript object
Method 3:usefor loopGet the key of a javascript object

Three ways to get key values ​​in array objects

javascriptObjects are collections of key-value pairs. We need a key to get its value from the javascript object. Key-value pairs are widely used in client-server communication and JavaScript programming. We know to retrieve a value from a JSON object as long as we have its key. But what if we don't have a key name?

1、()
() functionReturns an array containing the javascript object keys.
We pass the javascript object as an argument to the () function.
The output array contains the same order as they were in the original javascript object.
If we pass the array to (), it will return the array index as output.
And the parameter object has indexes, then () will return an array of these indexes.

var fruitsArr1 = ["Apple", "Orange", "Mango", "Banana"];



var fruitsObj2 = { 0: "Apple", 4: "Orange", 2: "Mango", 3: "Banana"};



var fruitsObj3 = { "id": "1", "name": "mango", "color": "yellow"};



(Object.keys(fruitsArr1));



(Object.keys(fruitsObj2));



(Object.keys(fruitsObj3));

AI writing code

["0", "1", "2", "3"]



["0", "2", "3", "4"]



["id", "name", "color"]

AI writing code

 

If the key is a number, the () function returns the array of numeric keys in sort order.
fruitsObj2 has keys numbered 0, 4, 2, 3. But when we apply the () function, the keys it returns are ["0", "2", "3", "4"], sorted in order. The key value will still maintain the same value map as the original javascript object.
For example, fruitsObj2 contains 4: "Orange" and 2: "Mango", but (fruitsObj2) returns their order as "2", "4".
If we are their values ​​on keys 2 and 4, we get the correct value as output.
Therefore, the function does not modify anything in the actual key-value map, even if the numeric keys of the array or object are returned in sort order.

(fruitsObj2[2]);



(fruitsObj2[4]);

AI writing code

Mango



Orange

AI writing code

2、(obj)
(obj) methods are diverse and more flexible than () functions.
It splits the entire object into small arrays. Each array consists of key-value pairs in the form of [key, value].
With (), we only get the keys of one object, but with (obj), we get all entries in an object, including keys and their values.
(obj) is not a common method. In most cases, we need to get the key from the object. With keys, you can easily get the corresponding value.

Syntax: (object)
Parameters: Same as () method, (obj) accepts javascript object as parameter.
Return value:
(obj) Returns a key-value pair destructed into an array.
The return type will be an array of arrays, each subarray contains two elements: keys and values.
Similar to [[key1, value1], [key2, value2], [key3, value3] … ].This function preserves the order of object properties. In the behind-the-scenes implementation, key-value pairs are formed by iterating over object properties. We use()to get the readable string version of the function output value.

var fruitsObj3 = { "id": "1", "name": "mango", "color": "yellow"};




console.log(JSON.stringify(Object.entries(fruitsObj3)));

AI writing code

We can use it in another way(). Iterate through the javascript object and record the property key and its value.

for (const [key, value] of Object.entries(fruitsObj3)) {



  console.log(`${key}: ${value}`);



}

AI writing code

3. For loop [commonly used]

We can traverse any javascript object like we would traverse the array using for-in combination. It iterates over each parameter, where i (the iterator) saves the object's key, and object[i] saves the value corresponding to the key in the object.

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




}

AI writing code

 

var a = { "id": "1", "name": "mango", "color": {"name": "yellow", "appearance": "bright"}};




for(let i in a){



  console.log(i);



  console.log(a[i]);



}

AI writing code