Làm cách nào để chúng ta lặp qua mảng mảng chứa các đối tượng trong JavaScript?

Sau đây là đoạn mã để lặp qua mảng mảng chứa các đối tượng trong JavaScript -

Ví dụ

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result {
      font-size: 18px;
      font-weight: 500;
      color: rebeccapurple;
   }
</style>
</head>
<body>
<h1>Loop through array of arrays containing objects in JavaScript</h1>
<div class="result"></div>
<button class="Btn">CLICK HERE</button>
<h3>
Click the above button to loop throught the arrObj
</h3>
<script>
   let BtnEle = document.querySelector(".Btn");
   let resEle = document.querySelector(".result");
   let arrObj = [
      [
         { name: "Rohan", age: 22 },
         { name: "Mohan", age: 12 },
         { name: "Shawn", age: 14 },
      ],
      [
         { id: 12, price: 44 },
         { id: 23, price: 45 },
         { id: 91, price: 14 },
      ],
   ];
   BtnEle.addEventListener("click", () => {
      arrObj.forEach((item) => {
         item.forEach((object) => {
            for (let i in object) {
               resEle.innerHTML += i + " : " + object[i] + " ";
            }
            resEle.innerHTML += "";
         });
      });
   });
</script>
</body>
</html>