>  기사  >  웹 프론트엔드  >  공유 키를 사용하여 배열의 JavaScript 개체를 병합하는 방법은 무엇입니까?

공유 키를 사용하여 배열의 JavaScript 개체를 병합하는 방법은 무엇입니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-10-30 23:43:30872검색

How to Merge JavaScript Objects in an Array with Shared Keys?

공유 키를 사용하여 배열의 JavaScript 개체 병합

JavaScript에서는 유사한 키를 가진 개체를 단일 개체로 결합해야 하는 경우가 많습니다. . 주어진 예를 고려하십시오.

<code class="js">const array = [
  {
    name: "foo1",
    value: "val1"
  },
  {
    name: "foo1",
    value: ["val2", "val3"]
  },
  {
    name: "foo2",
    value: "val4"
  }
];</code>

이 배열을 모든 값 키가 공유 이름을 가진 객체로 병합되는 "출력" 배열로 재구성하는 것이 목표입니다. 예상되는 출력은 다음과 같습니다.

<code class="js">const output = [
  {
    name: "foo1",
    value: ["val1", "val2", "val3"]
  },
  {
    name: "foo2",
    value: ["val4"]
  }
];</code>

개체 병합

이 문제에 대한 한 가지 접근 방식은 다음 단계를 사용하는 것입니다.

  1. forEach()를 사용하여 배열의 각 개체를 반복합니다.
  2. 출력 배열을 필터링하여 동일한 이름의 키를 가진 기존 개체를 찾습니다.
  3. 기존 개체가 발견되면 현재 객체의 값을 해당 값 배열에 추가합니다.
  4. 기존 객체를 찾을 수 없는 경우 현재 객체의 속성으로 새 객체를 생성하여 출력 배열에 추가합니다.
  5. 가능성을 처리합니다. 값을 배열로 변환하여 문자열로 변환합니다.

예제 코드

다음 코드는 설명된 접근 방식을 구현합니다.

<code class="js">const array = [
  {
    name: "foo1",
    value: "val1"
  },
  {
    name: "foo1",
    value: ["val2", "val3"]
  },
  {
    name: "foo2",
    value: "val4"
  }
];

let output = [];

array.forEach(item => {
  const existing = output.filter(v => v.name == item.name);
  if (existing.length) {
    const existingIndex = output.indexOf(existing[0]);
    output[existingIndex].value = output[existingIndex].value.concat(item.value);
  } else {
    if (typeof item.value == 'string') item.value = [item.value];
    output.push(item);
  }
});

console.log(output);</code>

이 코드는 동일한 이름을 가진 모든 객체의 값이 병합된 원하는 출력 배열을 생성합니다.

위 내용은 공유 키를 사용하여 배열의 JavaScript 개체를 병합하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.