TIL : JavaScript Loops

Perfume·2020년 9월 11일
1

JavaScript

목록 보기
7/13

같은 일이 한 두 번 반복된다면 일일이 손으로 칠 수 있겠지만, 백 번이 넘는 일을 반복해야 한다면? 당연히 컴퓨터가 해주는 편이 나을 것이다. 그럴 때 사용되는 것이 바로 루프문이다.

for문

간단히 말해서, for(begin; condition; step) 처럼 작성하면 된다.

예시)

콘솔에 5에서 10까지 나오게 해야 한다면?

for(let counter = 5; counter <=10, counter ++) {console.log(counter)};

반대로 콘솔에 0부터 3까지 나오게 하려면?

for(let counter = 3; counter>=0, counter--){console.log(counter)};

조금 더 나아가서, for문을 이용해 array의 각 요소에 대해 동일한 작업을 수행할 수도 있다. 예컨데 카탈로그에 있는 모든 제품의 가격을 인상한다고 가정해보자. 이럴 때 for문을 이용하면 간단하게 해결할 수 있다.

밑에는 코드카데미에서 낸 퀴즈를 혼자 풀어본 건데, for문을 구체적으로 어떤 식으로 활용하는지 예시가 될 수 있을 것 같아서 첨부한다.

const vacationSpots = ['Bali', 'Paris', 'Tulum'];

for(let i=0; i< vacationSpots.length; i++){
console.log(I would love to visit ${vacationSpots[i]})
};

Nested loop

루프 안에 루프를 넣는 것. 그게 바로 Nested loop다. 쉬워 보이는데 막상 활용해보려니 생각보다 복잡하다. codecademy에선 mutual follower 프로그램을 만드는 것이 예시로 나왔는데 솔직한 심경으로 한 60% 정도만 이해된다.

let bobsFollowers = ['Joe', 'Marta', 'Sam', 'Erin'];
let tinasFollowers = ['Sam', 'Marta', 'Elle'];
let mutualFollowers = [];

for (let i = 0; i < bobsFollowers.length; i++) {
for (let j = 0; j < tinasFollowers.length; j++) {
if (bobsFollowers[i] === tinasFollowers[j]) {
mutualFollowers.push(bobsFollowers[i]);
}
}
};

While 문

for문과 달리 While문은 루프 전에 global scope로 선언된다.

여기서 잠깐. global scope와 block scope의 개념을 짚고 가겠다.

global scope 는 화면에 그냥 적은 코드다. 그래서 메모리가 시작하는 순간부터 끝까지 기억하기 때문에 최소한으로 사용하는 것이 좋다.

block scope는 { } 안에 적은 코드다. { } 안의 내용은 블록 밖에서는 적용되지 않는다.

자, 그러면 while문은 언제 사용할까? 바로 루프를 몇 번이나 실행해야 하는지 정확히 모를 때다. for문은 우리가 얼마나 루프를 해야 하는지 알고 있을 때 사용하고, while 문은 정확히 알 수 없을 때 사용하면 좋다.

for문과 while문의 비교

// A for loop that prints 1, 2, and 3
for (let counterOne = 1; counterOne < 4; counterOne++){
console.log(counterOne);
}

// A while loop that prints 1, 2, and 3
let counterTwo = 1;
while (counterTwo < 4) {
console.log(counterTwo);
counterTwo++;
}

while문의 또 다른 예시

const cards = ['diamond', 'spade', 'heart', 'club'];

// Write your code below
let currentCard;

while ( currentCard != 'spade') {
currentCard = cards[Math.floor(Math.random() * 4)];
console.log(currentCard);
}

do While문

do while문은 while문과 비슷하게 작동한다. 그러나 둘의 차이점이 있다면 do while문은 조건이 참이 되지 않더라도 적어도 1번은 작동한다는 점이다. 베이킹을 할 때 설탕을 얼마나 넣어야 하는지를 코드로 작성하는 예시를 들어보겠다.

let cupsOfSugarNeeded = 3;
let cupsAdded = 0;
do {
cupsAdded++
} while(cupsAdded < cupsOfSugarNeeded);

profile
공부하는 즐거움

0개의 댓글