. Advertisement .
..3..
. Advertisement .
..4..
Today we will discuss how to get array of values from array of objects in Javascript. If you still have not found the answer to this problem, you can consider referring to the methods we give below. Now let’s start reading the article.
What should we do to get array of values from array of objects in Javascript?
Method 1: Use the map() method
To get array of values from array of objects in Javascript, the first way we suggest to you is using the map() method. When using JavaScript, the map() method constructs an array by invoking a particular function on each element of the parent array. It is a method without mutation.
Syntax:
array.map(function(currentValue, index, arr), thisValue)
Parameters:
function() (required): A function that must be executed for each array element.
currentValue (required): The value of the current element.
Index (Optional): The index of the current element.
Arr (Optional): The current element’s array.
thisValue (Optional): Undefined as the default value. A parameter that the function accepts and uses as its value.
Return value:
An array: the output of a function for each element of an array.Example:
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript Array map() Method
</title>
</head>
<body>
<div id="root"></div>
<!-- Script to use Array map() Method -->
<script>
var el = document.getElementById('root');
var arr = [2, 5, 6, 3, 8, 9];
var newArr = arr.map(function(val, index){
return {key:index, value:val*val};
})
console.log(newArr)
el.innerHTML = JSON.stringify(newArr);
</script>
</body>
</html>
Result:
(6) [{...}, {...}, {...}, {...}, {...}, {...}]
0: {key: 0, value: 4}
1: {key: 1, value: 25}
2: {key: 2, value: 36}
3: {key: 3, value: 9}
4: {key: 4, value: 64}
5: {key: 5, value: 81}
length: 6
_proto_: Array(0)
Method 2: Use filter() method
The filter () method is the next method besides the map () method. Using only the elements of the input array that satisfy the test the supplied function uses, it generates a shallow copy of a section of the input array.
Syntax:
array.filter(callback(element, index, arr), thisValue)
Parameters:
Callback: This parameter stores the function invoked for each array entry.
Element: The value of the components presently being processed is stored in the parameters.
Index: This optional parameter contains the array’s currentValue element’s index, starting at 0.
Arr: This optional parameter contains the entire array that Array.every is called on.
thisValue: This optional parameter stores the context that will be utilized when the callback function is executed.
Return value:
Only those elements in the new array that fulfill the arg function’s condition are included in this method’s new array.
Example:
var totn_array = [ 1, -5, 10, -15, 0 ];
function greater_than_zero(totn_element) {
return totn_element > 0;
}
window.console.log(totn_array.filter(greater_than_zero));
output to the web browser console log:
[1, 10]
Summary
We hope the methods mentioned above can help you get array of values from array of objects in Javascript. Did you find this article helpful? Leave your comments below the comment section. Thank you for reading!
Read more:
Leave a comment