WEBVTT

00:00:00.000 --> 00:00:03.147
보석은 예쁘죠

00:00:03.147 --> 00:00:08.275
보석 한개보다 좋은 건 여러개의 보석이죠

00:00:08.275 --> 00:00:12.562
이제 우리는 loop을 사용해서
여러개의 보석을 만들줄 알죠

00:00:12.562 --> 00:00:16.162
for loop을 사용해 
한 줄에 12개의 보석을 만들어보죠

00:00:16.162 --> 00:00:19.523
왼쪽에서 오른쪽으로요

00:00:19.523 --> 00:00:22.304
이렇게요

00:00:22.304 --> 00:00:31.186
for 안에 변수 i = 0; i는 12보다 작고; i++

00:00:31.186 --> 00:00:36.429
이 줄을 복사해서 for문 안에다가 붙여넣어요

00:00:36.429 --> 00:00:40.305
이렇게 하면 12개의 보석이
맨 윗줄 한 칸에 겹쳐서 나와요

00:00:40.305 --> 00:00:43.401
근데 우리는 화면을 가로질러서 나오게하고 싶어요

00:00:43.401 --> 00:00:45.941
그렇다는 건 x값이 바꿔야한다는거죠

00:00:45.941 --> 00:00:49.524
지금은 36인데, 매번 값이
다르게 나오게하고 싶어요

00:00:49.524 --> 00:00:51.859
i값을 이용해서 하면 됩니다

00:00:51.859 --> 00:00:56.329
간단하게 i 곱하기 36
이렇게 하면

00:00:56.329 --> 00:01:02.687
첫번째 값은 0이고, 다음은 36, 72....

00:01:02.687 --> 00:01:04.575
이제 한 줄의 보석이 나오네요

00:01:04.575 --> 00:01:07.997
인디아나존스나 알라딘 영화를 보면

00:01:07.997 --> 00:01:11.306
보석을 발견할 때

00:01:11.306 --> 00:01:13.732
보통 이렇게 한 줄의 보석만을 발견하지 않죠

00:01:13.732 --> 00:01:17.306
보석 더미를 발견하죠

00:01:17.306 --> 00:01:21.609
그럼 어떻게 하면 보석을 쭈욱

00:01:21.609 --> 00:01:24.806
스크린 밑에까지 나오게 할 수 있을까요?

00:01:24.806 --> 00:01:30.639
우선 이 for loop을 복사 붙여넣기 한 후

00:01:30.639 --> 00:01:34.565
y를 매번 바꿔줍니다

00:01:34.565 --> 00:01:37.688
60 그 다음에는 90

00:01:37.688 --> 00:01:42.308
이제 보석 3줄이 생겼네요

00:01:42.308 --> 00:01:45.495
하지만 이 방법이 좋지 않은게

00:01:45.495 --> 00:01:49.193
매줄마다 복사 붙여넣기 한 후 
값을 바꿔줘야되요

00:01:49.193 --> 00:01:52.859
이렇게 반복적인 코드를 작성하면

00:01:52.859 --> 00:01:57.025
"loop을 사용해야지" 라는 생각이 들지만

00:01:57.025 --> 00:01:58.607
이미 loop을 쓰고 있어요

00:01:58.607 --> 00:02:03.854
그렇다면 이런 반복적인
코드 작성의 해결책은 뭘까요?

00:02:03.854 --> 00:02:09.518
Nested for loop (겹쳐진 for loop) 이라는 것이 있습니다
loop 안에 loop 입니다

00:02:09.518 --> 00:02:12.132
바깥쪽 loop을 만든 후에

00:02:12.132 --> 00:02:14.851
이건 스크린 밑으로 
내려가는 걸 해주는 loop이고

00:02:14.851 --> 00:02:19.234
안쪽 loop은 보석 한 줄을

00:02:19.234 --> 00:02:21.977
왼쪽에서 오른쪽으로 나타나게 합니다

00:02:21.977 --> 00:02:24.006
어떻게 하는지 보여드리죠

00:02:24.006 --> 00:02:29.851
변수 i를 사용하고 있으니 
다른 변수 j를 사용하죠

00:02:29.851 --> 00:02:37.274
변수 j = 0; j는 13보다 작고; j++

00:02:37.274 --> 00:02:41.999
이게 위에서 아래로 내려가는 것을
담당하는 저희의 바깥쪽 loop이 됩니다

00:02:41.999 --> 00:02:48.237
기존에 사용했던 for loop을 안에다가 넣습니다

00:02:48.237 --> 00:02:53.274
들여쓰기를 고치고, 기존의 것을 지웁니다

00:02:53.274 --> 00:02:59.109
이렇게하면 한 줄에 똑같은 보석이 겹치게 나옵니다

00:02:59.109 --> 00:03:01.969
그러니 y의 값이 변하게 해줘야겠죠

00:03:01.969 --> 00:03:04.309
기존의 것을 그대로 가져왔기 때문에

00:03:04.309 --> 00:03:06.108
y값이 항상 90입니다

00:03:06.108 --> 00:03:09.440
매 행마다 y의 값이 바뀌게 하고 싶어요

00:03:09.440 --> 00:03:16.188
x는 i값을 이용하니, y는 j를 이용하게 합니다

00:03:16.188 --> 00:03:24.663
x에서 했던 방식대로 j 곱하기 30을 합니다

00:03:24.663 --> 00:03:29.934
짜잔! 멋집니다.

00:03:29.934 --> 00:03:31.776
다시 우리가 한 것을 살펴보죠

00:03:31.776 --> 00:03:38.340
바깥쪽 loop은 j가 13이 될 때까지 실행하며

00:03:38.340 --> 00:03:44.340
매번 안쪽 loop을 실행시킵니다

00:03:44.340 --> 00:03:48.673
안쪽 loop은 i가 12이 될 때까지 실행하고

00:03:48.673 --> 00:03:55.358
매번 i와 j를 이용하여 
x와 y위치에 보석을 그립니다

00:03:55.358 --> 00:03:59.607
따라서 i의 값이 j의 값보다 훨씬 더 자주 변하죠

00:03:59.607 --> 00:04:05.238
더 잘 이해하기 위해 실제로 i 값과 j 값이 변하는 것을
시각적으로 보도록 합시다

00:04:05.238 --> 00:04:09.277
이미지 출력 부분을 주석처리하고

00:04:09.277 --> 00:04:12.027
색이 나오게 한 후

00:04:12.027 --> 00:04:16.796
text 명령어를 이용해 j값이 보이게하죠

00:04:16.796 --> 00:04:22.025
이 위치에 j가 나타나도록 입력합니다

00:04:22.025 --> 00:04:26.009
이제 j가 0부터 12까지 나오는게 보이네요

00:04:26.009 --> 00:04:32.019
이건 보석의 행의 위치와 같죠

00:04:32.019 --> 00:04:35.684
이제 i의 값이 어떻게 변해 가는지를 보도록 합시다

00:04:35.684 --> 00:04:43.066
다른 색깔이 나오게 한 다음

00:04:43.066 --> 00:04:46.475
i를 입력해서

00:04:46.475 --> 00:04:50.271
x 값이 화면의 가로로 나오게 x값이 변하게 해줍니다

00:04:50.271 --> 00:04:54.688
y에도 똑같이 해주고요

00:04:54.688 --> 00:04:59.561
i가 0부터 11까지 나오는게 보이네요

00:04:59.561 --> 00:05:04.686
i가 더 자주 변하는 걸 알 수 있죠

00:05:04.686 --> 00:05:08.778
그리고 이 줄의 코드가 
윗줄의 코드보다 더 많이 실행됩니다

00:05:08.778 --> 00:05:13.855
왜냐하면 이 줄은 안쪽 loop이 
실행될때마다 실행되는데

00:05:13.855 --> 00:05:19.527
윗 줄의 코드는 바깥loop이 실행될때만
실행되니까요

00:05:19.527 --> 00:05:22.140
i와 j값을 출력해봤는데요

00:05:22.140 --> 00:05:26.973
nested for loop을 더 잘 이해하셨기를 바랍니다

00:05:26.973 --> 00:05:30.475
다시 보석 문제로 돌아가보죠

00:05:30.475 --> 00:05:34.066
nested for loop에서 많은 걸 할 수 있는데요

00:05:34.066 --> 00:05:37.232
이 세상에 있는 것들 중에서

00:05:37.232 --> 00:05:39.599
2차원 무늬들은 체스보드나 퀼트

00:05:39.599 --> 00:05:44.564
미국 국기의 별, 멋진 패턴, 벽지모양 등이 있는데

00:05:44.564 --> 00:05:47.462
우선 이 코드를 이용해

00:05:47.462 --> 00:05:49.806
이미지를 바꿔보도록 하죠

00:05:49.806 --> 00:05:55.496
하트모양이 나오도록 해보죠

00:05:55.496 --> 00:05:59.161
짠!