소개
이 랩에서는 JavaScript 를 사용하여 배열의 배열에서 요소를 그룹 해제하는 방법을 살펴봅니다. reduce, map, forEach와 같은 내장 JavaScript 함수를 조합하여 단일 배열의 배열에서 개별 배열을 추출합니다. 이 랩을 마치면 원하는 출력을 얻기 위해 JavaScript 에서 배열을 조작하는 방법에 대한 확실한 이해를 갖게 될 것입니다.
이 랩에서는 JavaScript 를 사용하여 배열의 배열에서 요소를 그룹 해제하는 방법을 살펴봅니다. reduce, map, forEach와 같은 내장 JavaScript 함수를 조합하여 단일 배열의 배열에서 개별 배열을 추출합니다. 이 랩을 마치면 원하는 출력을 얻기 위해 JavaScript 에서 배열을 조작하는 방법에 대한 확실한 이해를 갖게 될 것입니다.
zip 함수로 생성된 배열의 요소를 그룹 해제하려면 JavaScript 에서 unzip 함수를 사용하여 배열의 배열을 만들 수 있습니다. 방법은 다음과 같습니다.
node를 입력하여 코딩 연습을 시작합니다.Math.max(), Function.prototype.apply()를 사용하여 배열에서 가장 긴 하위 배열을 얻고, Array.prototype.map()을 사용하여 각 요소를 배열로 만듭니다.Array.prototype.reduce()와 Array.prototype.forEach()를 사용하여 그룹화된 값을 개별 배열에 매핑합니다.unzip 함수의 코드는 다음과 같습니다.
const unzip = (arr) =>
arr.reduce(
(acc, val) => (val.forEach((v, i) => acc[i].push(v)), acc),
Array.from({
length: Math.max(...arr.map((x) => x.length))
}).map((x) => [])
);
다음 예제와 함께 unzip 함수를 사용할 수 있습니다.
unzip([
["a", 1, true],
["b", 2, false]
]); // [['a', 'b'], [1, 2], [true, false]]
unzip([
["a", 1, true],
["b", 2]
]); // [['a', 'b'], [1, 2], [true]]
이 단계를 따르면 JavaScript 에서 배열 요소를 쉽게 그룹 해제할 수 있습니다.
축하합니다! 배열 요소 그룹 해제 랩을 완료했습니다. LabEx 에서 더 많은 랩을 연습하여 기술을 향상시킬 수 있습니다.