JavaScript - for .. of .. 문 with for in

김재환·2023년 11월 1일

JavaScript

목록 보기
2/39
//for ...of   for(변수 of 배열){동작부분;}

let influencer = ['suwonlog','small.tiger','Mina.ludens',
'gs25_convenience24']


for(let i = 0; i<influencer.length;i++){
  console.log(influencer[i]);
}

//influencer 배열안에 있는 요소들이 변수 element 에 하나씩 들어옴

for (let element of influencer){
  console.log(element);

}
//배열도 객체 이므로 for in 문도 가능은 하다
//변수에 property name 배열의 경우 index
//모든 프로퍼티를 가지고 반복하는 동작, 특별한 환경에서는 
다른 값이 들어가므로 배열을 쓸때는 
for in 보다 for of 를 사용 권장

for(let index in influencer){
  console.log(influencer[index]);
}

실습 설명
오늘은 풋살 동아리 경기가 있는 날입니다. 총인원 10명이서 5명씩 팀을 나누려고 하는데요.

실력이 비슷한 사람들끼리 가위바위보를 했고, 이긴사람이 0번 index, 진 사람이 1번 index 배열을 만들어 정리했습니다.

다음 groups 배열을 가지고, 이긴 사람끼리 그리고 진 사람끼리 팀을 나눠 teams 배열을 완성해 주세요.

let groups = [
  ['영준', '캡틴'], 
  ['태순', '우재'],
  ['재훈', '지웅'],
  ['윤형', '동욱'],
  ['규식', '소원'],
];

let teams = [
  [],
  [],
];

실습 결과
코드를 잘 작성했다면 다음과 같은 결과가 출력되어야 합니다.

[ '영준', '태순', '재훈', '윤형', '규식' ]
[ '캡틴', '우재', '지웅', '동욱', '소원' ]

복잡한 것처럼 보여도 생각보다 간단하게 해결할 수 있는 문제입니다.

groups의 각 요소별 0번 index끼리 묶고, 1번 index끼리 묶어주면 되는데요.

일단 처음 요소들만 나눠 준다면 다음과 같이 작성할 수 있습니다.


let groups = [
  ['영준', '캡틴'], 
  ['태순', '우재'],
  ['재훈', '지웅'],
  ['윤형', '동욱'],
  ['규식', '소원'],
];

let teams = [
  [],
  [],
];

teams[0][0] = groups[0][0];
teams[1][0] = groups[0][1];

// 테스트 코드
console.log(teams[0]);
console.log(teams[1]);
[ '영준' ]
[ '캡틴' ]

이렇게 모두 하나씩 바꿔주는 것도 하나의 방법이긴 합니다. 하지만 이렇게 해서 모두 바꿔주기에는 코드가 너무 비효율적일 것 같죠? 일정한 규칙을 찾아서 반복문을 통해 조금 더 효율적인 코드를 작성해 봅시다.


teams[0][0] = groups[0][0];
teams[1][0] = groups[0][1];
teams[0][1] = groups[1][0];
teams[1][1] = groups[1][1];
teams[0][2] = groups[2][0];
teams[1][2] = groups[2][1];
teams[0][3] = groups[3][0];
teams[1][3] = groups[3][1];
teams[0][4] = groups[4][0];
teams[1][4] = groups[4][1];

일단 하나하나 필요한 작업들을 모두 작성해 보면, 결국 groups의 각 index를 뒤집어서 teams에 할당해 주면 간단하게 배열을 나눠 줄 수 있습니다.

let groups = [
  ['영준', '캡틴'], 
  ['태순', '우재'],
  ['재훈', '지웅'],
  ['윤형', '동욱'],
  ['규식', '소원'],
];

let teams = [
  [],
  [],
];

for(let i = 0; i < groups.length; i++) {
  for(let j = 0; j < groups[i].length; j++) {
    console.log(groups[i][j]);
  }
}

2차원 배열을 다뤄야하니, 이렇게 반복문을 이렇게 겹치면 각 요소별 값들을 가져올 수 있습니다.


let groups = [
  ['영준', '캡틴'], 
  ['태순', '우재'],
  ['재훈', '지웅'],
  ['윤형', '동욱'],
  ['규식', '소원'],
];

let teams = [
  [],
  [],
];


for(let i = 0; i < groups.length; i++) {
  for(let j = 0; j < groups[i].length; j++) {
    teams[j][i] = groups[i][j];
  }
}

console.log(teams[0]);
console.log(teams[1]);

최종적으로 groups의 각 index를 뒤집어서 teams에 할당해주면 좀 더 효율적으로 문제를 해결할 수 있습니다.

내가 해결한 방법


let groups = [
	['영준', '캡틴'], 
	['태순', '우재'],
	['재훈', '지웅'],
	['윤형', '동욱'],
	['규식', '소원'],
];

let teams = [
	[],
	[],
];

for(let element of groups){
teams[0].push(element[0]);
teams[1].push(element[1]);

}

// 테스트 코드
console.log(teams[0]);
console.log(teams[1]);
profile
안녕하세요

0개의 댓글