Computer >> Máy Tính >  >> Lập trình >> Javascript

Làm cách nào để nhóm các đối tượng dựa trên một giá trị trong JavaScript?

Sau đây là mã để nhóm các đối tượng dựa trên một giá trị 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>Group objects based on a value in JavaScript</h1>
<div class="result">
{ name: 'Rohan', age: 18 }, { name: 'Mohan', age: 20 }, { name: 'Shawn',
age: 18 }, { name: 'Michael', age: 18 }, { name: 'David', age: 20 }
</div>
<button class="Btn">CLICK HERE</button>
<h3>Click on the above button to group the above object based on people's age</h3>
<script>
   let resEle = document.querySelector(".result");
   let sampleEle = document.querySelector(".sample");
   let BtnEle = document.querySelector(".Btn");
   const people = [
      { name: "Rohan", age: 18 },
      { name: "Mohan", age: 20 },
      { name: "Shawn", age: 18 },
      { name: "Michael", age: 18 },
      { name: "David", age: 20 },
   ];
   let groupBy = (array, key) => {
      return array.reduce((result, obj) => {
         (result[obj[key]] = result[obj[key]] || []).push(obj);
         return result;
      }, {});
   };
   let a = groupBy(people, "age");
   BtnEle.addEventListener("click", () => {
      console.log(a);
   });
</script>
</body>
</html>

Đầu ra

Đoạn mã trên sẽ tạo ra kết quả sau -

Làm cách nào để nhóm các đối tượng dựa trên một giá trị trong JavaScript?

Khi nhấp vào nút ‘NHẤP VÀO ĐÂY’ và kiểm tra bảng điều khiển -

Làm cách nào để nhóm các đối tượng dựa trên một giá trị trong JavaScript?