먼저 다음과 같이 매우 흥미로운 2차원 배열을 얻습니다:
let arr = [ ["이름", "나이", "주민등록번호",],
["차이 슈쿤", "100", "420115212320125230",],
["우이판", "100", "420114201236201254",],
]
이와 같은 형태로 변환합니다:
저는 for 루프를 사용하는 것이 좋다고 생각했습니다.
// 먼저 테이블을 렌더링하는 데 사용할 두 개의 배열을 정의합니다.
let tableNamesData = [] // 양식 이름 배열
let tableData = [] // 표 형식의 데이터
// 빈 객체 재정의하기
let obj = {}
// 1단계
// 테이블 이름 렌더링하기:label 및 렌더링 필드:prop 먼저 반복해 보세요.
for (let i = 0; i < arr[0].length; i++) {
const item = arr[0][i];
tableNamesData.push({label: item, prop: item})
}
// 2단계:
// 이중 루프
// 테이블 데이터 렌더링하기:tableData 먼저 반복해 보세요.
for (let i = 1; i < arr.length; i++) {
for (let j = 0; j < arr[i].length; j++) {
obj[tableNamesData[j].label] = arr[i][j]
}
tableData.push(obj)
obj = {}
}
// 이중 루프를 만드는 방법을 모르는 가족 구성원이 있다면 단계별로 루프에 인쇄하여 오!
console.log(tableNamesData); // [{"label": " , "prop": " }, {"label": " , "prop": " }, {"label": "주민등록번호", "prop": "주민등록번호"}]
console.log(tableData) // [{" : "최서건", "나이": "100", "주민등록번호": "420115212320125230"},{" : "우이판", "나이": "100", "주민등록번호": "420114201236201254"}]
// 드디어 완성되었습니다!
테이블에 렌더링하는 방법을 보여드릴 필요는 없으니 원하시면 댓글로 알려주세요.
제가 이렇게 복잡하다고 생각하시는 가족분들은 댓글을 달아주시면 제가 배울 수 있도록 도와주세요, 감사합니다!
