javascript 5. For Loop and While Loop 반복문

For Loop

const guys = ["Jay", "Son", "Park", "Messi", "Jimmy"];

이러한 배열이 있다고 치자.

 

만약 저 사람들이 접속할 때마다

Hello라는 인사를 하고싶으면 어떻게 해야할까?

 

 

우선 반복문 for문을 통해 저들을 다 불러보겠다. 

const guys = ["Jay", "Son", "Park", "Messi", "Jimmy"];

for (guy of guys) {
	console.log(guy);
}

for (guy of guys) 에서 guy는 뒤에 있는 복수형의 단수를 써주면 된다.

결과

 

 

 

예를들어, for ( 단수 of 복수)

 

for (name of names)

const names = ["Jay", "Son", "Park", "Messi", "Jimmy"];

for (name of names) {
	console.log(guy);
}

for (person of people)

const people = ["Jay", "Son", "Park", "Messi", "Jimmy"];

for (person of people) {
	console.log(guy);
}

이렇게 해도 상관없다.

 

결과

 

 

그렇다면 이들 이름 앞에

Hello만 출력하면 될 것 같다.

 

const guys = ["Jay", "Son", "Park", "Messi", "Jimmy"];

for (guy of guys) {
	console.log(`Hello`, guy);
}

 

저번시간에 배웠던 ` ` (backtick)을 사용해서

console.log에 있는 guy앞에 하고싶은말을 적으면 된다.

 

결과

 

 

 

데이터를 찾을 때도 유용하다.

예를들어, 저 중에 Park을 찾고싶을때도 쓸 수 있다.

 

const guys = ["Jay", "Son", "Park", "Messi", "Jimmy"];

for (guy of guys) {
	if (guy === "Park") {
		console.log("I found the Park!");
	}
}

조건문(if문)을 활용해서 

Park이면, "I found the Park!" 이라는 메세지가 나오게 했다.

결과

결과는 잘 나오지만, 이 코드에는 단점이 있다.

Park을 찾고나서도 코드가 여전히 실행되고 있다는 점이다.

이를 해결하기 위해서 break를 활용할 수 있다.

 

const guys = ["Jay", "Son", "Park", "Messi", "Jimmy"];

for (guy of guys) {
	if (guy === "Park") {
		console.log("I found the Park!");
		break;
	}
}

이렇게 break를 써주면

원하는 조건을 실행되면

나머지배열(Messi, Jimmy)까지 찾을 필요없이 for문을 빠져나온다.

 

---

While Loop

웹사이트 로딩되는 과정을 예로 한번 들어보자.

let loading = 0;

while(loading < 100){
	console.log('Website is still loading');
}

이러한 코드를 작성하면(실행시키는건 비추 - 렉걸림)

저 loading은 계속 실행된다.

왜냐하면 0은 항상 100보다 작기 때문에 항상 참이기 때문이다.

그래서 'Website is still loading' 이라는 메세지가 console 창에 계속 나온다.

 

이것을 방지하기 위해

loading을 1씩 늘려줄 수 있다.

첫번째 방법 : loading++;

두번째 방법 : loading+= 1;

let loading = 0;

while(loading < 100){
	console.log('Website is still loading');

	loading++;
}

 

결과

loading이 1씩 늘어나서

100번째까지 실행된 것을 볼 수 있다.