Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Accessing and returning nested array value - JavaScript?
Each value in an array is referred to as an element, and each element has a certain numerical location in the array, which is referred to as its index.
Nested Arrays, a feature of JavaScript, allow us to create arrays inside arrays. One or more arrays can be used as the elements of nested arrays. Although the term may be a little unclear, as we look further, it is actually rather fascinating.
Accessing and returning nested array
In JavaScript, a nested array is described as an Array (Outer array) inside another array (inner array). One or more inner Arrays are possible for an array. These nested arrays (inner arrays) are accessible using the outer array's object name since they fall under the outer array's scope.
Syntax
Following is the syntax for nested array −
var arr=[[values,[nest value…],…]]
To learn more about accessing and returning nested array values in JavaScript, let’s look into the following examples.
Example
In the following example, we are running the script, accessing the nested array, and getting the value from it.
<!DOCTYPE html>
<html>
<body>
<script>
let obj = {
arr1: [
{ car: 'BMW', year: 2018 },
{ car: 'BENZ', model: "Top-End" },
{ car: 'AUDI', engine: "4.0 TFSI" }
],
arr2: [
{
car: 'RX100',
columns: ['AUDI'],
}
]
}
let result = obj.arr1.filter(({car}) => obj.arr2[0].columns.includes(car))
document.write(JSON.stringify(result))
</script>
</body>
</html>
When the script is run, it will produce an output consisting of an array value obtained from the nested array and displayed on the webpage.
Example
Considering the following example, where we are running the script for accessing the nested array and returning the value from it.
<!DOCTYPE html>
<html>
<body style="background-color:#EAFAF1">
<p id="tutorial"></p>
<script>
const array = [
{
"company" : "TutorialsPoint",
"courses": [
{
"Name" : 'HTML',
"Price" : 4500
},
{
"Name" : 'JAVA',
"Price": 5000
}
]
},
{
"Name" :"PYTHON",
"Price": 3500
}
];
let value;
outer: for (const element of array) {
for (const course of element.courses || []) {
if (course.Price === 4500) {
value = course.Name;
break outer;
}
}
}
document.getElementById("tutorial").innerHTML=value;
</script>
</body>
</html>
On running the above script, the output window will pop up, displaying the value obtained from the nested array displayed on the webpage.
Example
Run the script listed below to see how the value is being accessed and returned from the nested array.
<!DOCTYPE html>
<html>
<body style="background-color:#E8DAEF ">
<p id="tutorial"></p>
<script>
var numbers = [100, 1345, 80, 75, 1000,[35, 55, 67,43,51,78]];
var insideInnerValue = numbers[5];
var value = insideInnerValue[5];
document.getElementById("tutorial").innerHTML=value;
</script>
</body>
</html>
When the script gets executed, it will generate an output consisting of the value that was displayed on the webpage and obtained from the nested array.
1K+ Views
