섹션 19 : for 루프

보일러플레이트 : 변화없이 여러 군데에서 반복되는 코드를 말한다

• for loop
• while loop
• for … of loop
• for … in loop

for loop

for(let i = 0; i <=10; i++) {
	console.log(i)
}

for 구문에는 괄호 뒤에 세가지가 들어간다. ; 로 구분한다.

1. 시작점. 변수를 선언한다.
2. 조건: 이 조건이 참일때 중괄호 안이 실행된다. <=로 하면 그 수까지 적용됨.
3. 중괄호 안이 실행되고 나서 그 다음 반복 전에 실행. 주로 카운터. ++이나 +=, -= 등으로 카운터를 변경한다.

infinite loops

무한루프에 빠지는 처참한 경우가 있다. 이러면 안됨.

for(let i = 10; i >= 0; i++) {
	console.log(i);
}

영원히 돌기만 한다. 컴퓨터가 뻗는다.

Loop & Arrays

배열을 다룰 때 루프를 많이 쓴다.

let animals = ['lions', 'tigers', 'bears'];

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

이런식으로 배열.length까지 반복하면 배열을 다 훑는다.

Nested Loops

중첩 루프.

루프 안에 루프를 또 쓴다.

let str =  'LOL';
for(let i = 0; i <= 4; i++) {
	console.log("outer:', i);
	for(let j = 0; j < str.length; j++) {
		console.log('    Inner:', str[j]);
	}
}

이렇게 되면 i가 0 일때 j는 3번 돌고, i가 1일때 또 3번 돌고 하는 식으로 반복된다.

조금 어렵지만 구조만 파악하면 쉽다.

While

let num = 0;
while (num < 10) {
	console.log(num);
	num++;
}

while 뒤 괄호 안에 하나의 조건만 들어간다. 그 값이 참이면 중괄호 안 실행하고 반복. 조건이 거짓이라면 실행하지 않는다.

break

while 반복문에 많이 사용한다. 특정 조건이나 구문이 실행되면 break를 써서 반복을 깨는 것이다. break가 없다면 while뒤 조건문이 참일때 영원히 반복한다.

let input = prompt("say something")
while(true) {
	input = prompt(input);
	if(input.toLowerCase() === "stop copying me") break;
}
console.log("ok")

for … of

반복가능한 객체(배열, map, set, string 등) 에 대해서 쉽게 반복할 수 있다. 익스플로러는 사용불가.

const subreddits = ['cringe', 'books', 'chickens']

for(let i = 0; i < subreddits.length; i++) {
	console.log(subreddits[i]);
}
//일반 for 구문으로 쓰면 위에서 처럼 쓸 수 있다.

for(let sub of subreddits) {
	console.log(sub)
}

for(let 변수 of 반복가능한 객체)

로 써주면 알아서 내용을 반복해준다. 기계적으로 변수 i를 선언하고 카운팅하고 할 필요가 없다.

let 뒤에 변수는 아무 이름이나 넣으면 됨.

for … in

키-값 쌍인 객체 리터럴은 반복가능한 객체가 아니다. 순서가 없다.

엄밀히 말하면 시스템 상으론 배열도 객체고 문자열도 객체다. set, map도 객체다.

객체 리터럴을 루프에 이용하기 위해서

for … in 구문을 쓴다.

const testScore = {
	a: 56,
	b: 34,
	c: 25
}

for(let person in testScore) {
	console.log(person);
}

// a
// b
// c

// 이렇게 키만 나온다. 키와 값을 모두 나타내려면

console.log(`${person} scored ${testScore[person]}`);
//이렇게 할 수 있다.

또는

Object.keys(testScore);
//이렇게 하면 키만 들어간 배열이 나온다.

Object.values(testScore);
//이렇게 하면 값만 들어간 배열이 나온다.

Object.entries(testScore);
//이렇게 하면 키-값 쌍으로 된 중첩된 배열이 나온다.

위 메서드를 쓰면 for in을 쓰지 않고 for of를 써서 동일한 결과를 만들수 있다.