제목을 다음과 같이 다시 작성합니다. 기본 배열을 그룹화하고 각 그룹에 필드와 하위 배열을 추가합니다.
P粉190443691
2023-08-24 21:18:20
<p>다음과 같은 무거운 배열이 있습니다.</p>
<pre class="brush:php;toolbar:false;">[
{Id: 1, 이름: '빨간색', 옵션 이름: '색상'},
{Id: 2, 이름: '노란색', 옵션 이름: '색상'},
{Id: 3, 이름: '파란색', optionName: '색상'},
{Id: 4, 이름: '녹색', optionName: '색상'},
{Id: 7, 이름: '검정색', optionName: '색상'},
{Id: 8, 이름: 'S', optionName: '크기'},
{Id: 11, 이름: 'M', optionName: '크기'},
{Id: 12, 이름: 'L', optionName: '크기'},
{Id: 13, 이름: 'XL', 옵션 이름: '크기'},
{Id: 14, 이름: 'XXL', 옵션 이름: '크기'}
]</pre>
<p><code>optionName</code>별로 그룹화해야 하며 기본 배열에 다음과 같이 두 개의 행이 있어야 합니다. </p>
<pre class="brush:php;toolbar:false;">[
{
이름: '색상',
데이터:[{Id: 1, 이름: '빨간색'},
{ID: 2, 이름: '노란색'},
{ID: 3, 이름: '파란색'},
{ID: 4, 이름: '녹색'},
{ID: 7, 이름: '검은색'}]
}, {
이름: '크기',
데이터:[{Id: 8, 이름: 'S'},
{ID: 11, 이름: 'M'},
{ID: 12, 이름: 'L'},
{ID: 13, 이름: 'XL'},
{ID: 14, 이름: 'XXL'}]
}
]</pre>
<p>자바스크립트로 어떻게 구현하나요? </p>
Map 객체를 사용하는 ES6 솔루션:
다음은 이 상황에 대해 제가 작성한 코드 조각입니다. 이 함수를 모든 배열에 추가할 수 있습니다:
으아아아이렇게 사용하시면 됩니다. 데이터를 그룹화하는 방법을 정의하는 함수를 전달하기만 하면 됩니다.
으아아아작업 바이올린
필요하다면
{key: k, data: map[k]}
替换为{Name: k, Data: map[k]}
할 수 있습니다.이것은 위 코드의 더 간결한 ES6 버전이기도 합니다:
으아아아다음과 같이 사용하세요:
으아아아