여기 우리 친구 winston이 
우리 수업을 도와 줄겁니다

모습은 이미 완벽해 보이지만

눈 크기를 조금 수정해볼게요

이 부분이 눈을 그리는 부분이에요

채우기 색을 정하고

두개의 타원을 만듭니다

더 작게 만들려고

너비를 수정해 봤어요

완벽한 원을 만들고 싶어서

높이도 같이 수정했어요

양쪽 다 같은 크기로 만들고싶어요

반대쪽 눈도 너비와 높이를 수정해야겠어요

눈이 너무 작아졌어요 다시 돌려놓을게요

숫자 하나만 바꿔서

양쪽 눈을 전부 변경할 수 있다면
얼마나 좋을까요?

그래서 이번 시간에는 변수에 대해 배우겠습니다

변수는 이름이라고 할 수 있고

어떤 것을 놓는 자리라고 할 수도 있어요

변수를 이름이 있는 양동이라고 생각해보세요

양동이에 무엇을 담더라도

양동이의 이름은 똑같아요

양동이에 담긴 것은
변수값이라고 부릅니다

실제로 변수를 만들어볼까요?

모든 방법을 사용해 보겠습니다.

먼저 변수타입 var 를 적습니다

한 칸 띄우고 변수명을 입력합니다

변수를 설명할 수 있게 정합니다

eyeSize로 정했어요

어떤 이름이라도 변수명이 될 수 있지만

중간에 띄어쓰기는 안됩니다

물론 뒤에 적을 세미콜론은 잊지 말아야하죠

이제 eyeSize 변수를 만들었어요

윈스턴의 눈크기를 저장할 변수입니다

그러나 아직 이 변수는 값이 없습니다

변수값을 입력하기 위해

eyeSize = 20; 라고 적습니다

=이 무엇인지 알아요?

제가 가르쳐주지 않았네요

= 은 같다라는 의미가 아니라 
할당한다는 의미입니다

그 말은 변수 eyeSize에
20이라는 값을 할당한다는 의미입니다

즉 eyeSize라는 이름의 양동이 안에

20이라는 숫자를 넣는 것입니다

x=3 과 3=x 는
수학시간에 어떻게 말하나요?

x와 3이 같다고 말합니다

그러나 이 수업에서는 그게 아닙니다

등호 왼쪽에는 변수만 적을 수 있습니다

등호 오른쪽에는 변수에 
할당할 값만 적을 수 있습니다

이것을 기억하는 방법은

코딩하면서 큰 소리로 말해보는 것입니다

훌륭한 프로그래머들은 그렇게 합니다

등호 기호를 만나면

같다(equals)가 아닌 된다(gets)라고 말하세요

eyeSize는 20이 됩니다 라고 말해야겠죠

이제 eyeSize를 사용할 때마다

eyeSize가 20의 값을 갖고 있다고
컴퓨터가 인식하겠죠

확인해보겠습니다

eyeSize를 복사하고

네 개의 숫자를
변수 eyeSize로 바꿔줍니다

짜잔!

이제 윈스턴의 눈은
완전한 원형이고 크기도 같아요

만약 두 눈의 크기를 바꾸고 싶다면

이 변수 하나만 변경하면 돼요

멋지네요!

두가지만 더 설명할게요

이것은 우리가 만든 eyeSize변수에요

33이라고 값을 할당했어요

한 줄에 묶을 수도 있어요

첫째 var eyeSize라고 적고

둘째 33을 할당합니다

그럼 이 두 줄을 지우더라도

모두 그대로 작동해요

컴퓨터는 코드를 위에서 아래로 
읽는다는사실을 기억하세요

이 eyeSize가 무엇인지 알 수 있는 이유는

이미 여기 정의되어있기 때문입니다

이것을 아래쪽으로 이동시키면

컴퓨터는 eyeSize가 무엇인지 모르게 됩니다

eyeSize가 정의되지 않았다는
오류메시지가 나옵니다

본인은 아래에 정의했다고
생각할지도 모르겠네요

그러나 컴퓨터는 그렇게 똑똑하지 않아요

위쪽으로 다시 이동해야겠군요

변수를 사용하기 전에

변수가 정의되어 있는지 항상 확인해야 합니다

이제 변수에 대해 알겠죠?