[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:01.34,0:00:05.96,Default,,0000,0000,0000,,이제 자바스크립트의 기초를 모두 다졌으니\N제가 이것을 활용한 멋진 것들을 소개할게요
Dialogue: 0,0:00:05.96,0:00:08.100,Default,,0000,0000,0000,,"객체지향 프로그래밍"을 말이지요
Dialogue: 0,0:00:09.55,0:00:12.42,Default,,0000,0000,0000,,하지만 먼저 왜 유용한지부터 알아야 합니다
Dialogue: 0,0:00:12.57,0:00:16.96,Default,,0000,0000,0000,,그래서 객체지향 프로그램이 되면 좋을 것 같은 \N프로그램을 준비했어요
Dialogue: 0,0:00:17.67,0:00:24.34,Default,,0000,0000,0000,,시작하기 되게 좋은 프로그램이예요\N간단한 리터럴을 저장하는 두 개의 변수가 있어요
Dialogue: 0,0:00:25.14,0:00:30.45,Default,,0000,0000,0000,,전에 배웠듯이 리터럴은\N두 개의 중괄호로 나타내고요
Dialogue: 0,0:00:30.45,0:00:33.23,Default,,0000,0000,0000,,안에 속성의 이름과 값들을 적어줍니다
Dialogue: 0,0:00:34.41,0:00:39.24,Default,,0000,0000,0000,,두 개의 객체 리터럴하고\N밑에 {\i1}drawWinston{\i0} 함수도 있습니다
Dialogue: 0,0:00:39.24,0:00:41.13,Default,,0000,0000,0000,,1개의 매개변수 함수지요
Dialogue: 0,0:00:41.13,0:00:47.88,Default,,0000,0000,0000,,매개변수를 통해 이미지를\N알맞는 x좌표 y좌표에 출력합니다
Dialogue: 0,0:00:47.88,0:00:53.11,Default,,0000,0000,0000,,닉네임과 나이를 포함한 캡션\N또한 생성합니다
Dialogue: 0,0:00:53.11,0:00:58.16,Default,,0000,0000,0000,,그리고 밑에서 우리는 {\i1}drawWinston(){\i0}이라는 함수를\N{\i1}teen{\i0}과 {\i1}adult{\i0}에 대해 호출합니다
Dialogue: 0,0:00:58.16,0:01:01.01,Default,,0000,0000,0000,,그래서 다음과 같이 출력됩니다
Dialogue: 0,0:01:01.01,0:01:05.53,Default,,0000,0000,0000,,좋네요 이제 리터럴을 보면
Dialogue: 0,0:01:06.37,0:01:11.20,Default,,0000,0000,0000,,뭔가 되게 비슷하다는 것을 눈치 채셨을 거예요
Dialogue: 0,0:01:11.41,0:01:17.46,Default,,0000,0000,0000,,서로 비슷한 속성을 가지고 있고요\N둘다 {\i1}drawWinston(){\i0} 함수에 쓰입니다
Dialogue: 0,0:01:17.84,0:01:23.73,Default,,0000,0000,0000,,생각해보면, 둘 다 윈스턴의\N타입을 기술하는 거죠?
Dialogue: 0,0:01:24.07,0:01:28.80,Default,,0000,0000,0000,,그리고 우리는 윈스턴을 기술하는\N추상적인 타입도 생각할 수 있겠죠?
Dialogue: 0,0:01:28.80,0:01:36.46,Default,,0000,0000,0000,,모든 윈스턴은 닉네임과 나이 그리고\Nxy 좌표를 가지고 있어야 합니다
Dialogue: 0,0:01:36.46,0:01:42.16,Default,,0000,0000,0000,,여기 우리는 2개의 윈스턴의 인스턴스를\N생성했어요
Dialogue: 0,0:01:42.16,0:01:48.46,Default,,0000,0000,0000,,윈스턴을 표현하기 위해서는\N여기 십대의 윈스턴과 성인 윈스턴이 있잖아요.
Dialogue: 0,0:01:48.46,0:01:54.76,Default,,0000,0000,0000,,서로 서로 닮은 것들이 너무 많아요
Dialogue: 0,0:01:54.76,0:02:01.30,Default,,0000,0000,0000,,그렇게 생각한다면 인간, 사람이라는\N추상 자료형도 생각해볼 수 있겠죠?
Dialogue: 0,0:02:01.30,0:02:05.96,Default,,0000,0000,0000,,그럼 우리 모두는 우리만의 속성을 가진 인스턴스에 불과합니다
Dialogue: 0,0:02:05.96,0:02:14.95,Default,,0000,0000,0000,,이제 우리는 객체 지향 프로그래밍을 해볼텐데요\N윈스턴 변수들을
Dialogue: 0,0:02:14.95,0:02:21.83,Default,,0000,0000,0000,,윈스턴 객체의 인스턴스로 표현해서\N비슷한 속성을 공유하게 하려고 해요
Dialogue: 0,0:02:21.83,0:02:27.97,Default,,0000,0000,0000,,그러기 위해서 우리는 윈스턴 추상 자료형을 정의해야 돼요
Dialogue: 0,0:02:27.97,0:02:30.90,Default,,0000,0000,0000,,이제 변수를 만들게요
Dialogue: 0,0:02:30.90,0:02:38.93,Default,,0000,0000,0000,,이 안에 자료형을 저장해야겠죠? {\i1}var Winston{\i0}이라 할게요\N보통 객체 타입으로 첫문자는 대문자로 씁니다
Dialogue: 0,0:02:38.93,0:02:42.20,Default,,0000,0000,0000,,함수랑 같다고 둘게요
Dialogue: 0,0:02:42.20,0:02:47.03,Default,,0000,0000,0000,,이 함수를 특별하게 "생성자 함수"라고 부릅니다
Dialogue: 0,0:02:47.03,0:02:52.04,Default,,0000,0000,0000,,왜냐하면 이 함수가 호출될 때마다\N윈스턴 인스턴스가 생기니까요
Dialogue: 0,0:02:52.04,0:02:57.86,Default,,0000,0000,0000,,{\i1}teenageWinston{\i0}을 생성하고 싶거나\N{\i1}adultWinston{\i0}을 생성하고 싶으면 호출하면 되겠죠
Dialogue: 0,0:02:57.86,0:03:06.42,Default,,0000,0000,0000,,그럼 이 함수가 속성에 관한 정보를 전달 받아야만이\N완벽한 윈스턴을 만들 수 있겠죠?
Dialogue: 0,0:03:06.42,0:03:11.32,Default,,0000,0000,0000,,이 경우에는 nickname, age, x, y이겠죠
Dialogue: 0,0:03:11.32,0:03:15.06,Default,,0000,0000,0000,,인수가 전달되고 나서 우리는 이걸로 뭔가 해야겠죠
Dialogue: 0,0:03:15.06,0:03:21.48,Default,,0000,0000,0000,,윈스턴 객체에 정보를 넣어주어야 합니다
Dialogue: 0,0:03:21.48,0:03:28.67,Default,,0000,0000,0000,,그래서 새로운 수식어 {\i1}"this"{\i0} 를 쓸게요\N{\i1}"this"{\i0} 는 현재의 인스턴스를 의미합니다
Dialogue: 0,0:03:28.67,0:03:34.92,Default,,0000,0000,0000,,그러면 {\i1}this.nickname{\i0}, 즉 이번 객체의 닉네임 속성에는
Dialogue: 0,0:03:34.92,0:03:38.42,Default,,0000,0000,0000,,생성자로부터 전달받은 값을 넣어주어야 합니다
Dialogue: 0,0:03:38.42,0:03:44.00,Default,,0000,0000,0000,,{\i1}this.age = age{\i0}\N{\i1}this.x = x{\i0} 그리고
Dialogue: 0,0:03:44.00,0:03:47.46,Default,,0000,0000,0000,,{\i1}this.y = y{\i0} 이면 되겠죠?
Dialogue: 0,0:03:48.38,0:03:57.50,Default,,0000,0000,0000,,그럼 우리는 윈스턴이라고 부르는 추상 자료형을 만들었고요\N이 자료형은 새로운 윈스턴을 만들기 위한 생성자가 있어요
Dialogue: 0,0:03:57.50,0:04:00.33,Default,,0000,0000,0000,,이걸 이용해 볼게요
Dialogue: 0,0:04:00.33,0:04:05.24,Default,,0000,0000,0000,,{\i1}winstonTeen{\i0}을 다시 만들건데요\N이번에는 {\i1}winstonTeen ={\i0}
Dialogue: 0,0:04:05.24,0:04:10.38,Default,,0000,0000,0000,,중괄호 대신에 {\i1}= new Winston{\i0} 이라 할게요
Dialogue: 0,0:04:10.38,0:04:13.95,Default,,0000,0000,0000,,"이제 새로운 윈스턴 인스턴스를 만든다"라는 뜻이예요
Dialogue: 0,0:04:13.95,0:04:22.30,Default,,0000,0000,0000,,여기에 정보를 전달해야 되므로,\N{\i1}"Winsteen", 15, 20, 50{\i0} 로 쓸게요
Dialogue: 0,0:04:22.30,0:04:27.50,Default,,0000,0000,0000,,전에 썼던 것은 지워버리고요
Dialogue: 0,0:04:27.50,0:04:31.08,Default,,0000,0000,0000,,이제 윈스틴이 만들어졌죠?
Dialogue: 0,0:04:31.08,0:04:35.72,Default,,0000,0000,0000,,이제 {\i1}winstonAdult = new Winston(){\i0}
Dialogue: 0,0:04:35.72,0:04:39.96,Default,,0000,0000,0000,,이름은 {\i1}"Mr. Winst-a-lot"{\i0}이고요,
Dialogue: 0,0:04:39.96,0:04:47.41,Default,,0000,0000,0000,,{\i1}30, 229, 50{\i0}을 차례로 넣을게요\N전에 리터럴은 지워버리고요
Dialogue: 0,0:04:47.41,0:04:50.81,Default,,0000,0000,0000,,짜잔 제대로 작동하네요
Dialogue: 0,0:04:50.81,0:04:58.09,Default,,0000,0000,0000,,아직까지 우리가 한 것을 정리해볼게요\N우리가 만든 윈스턴 추상자료형이고요
Dialogue: 0,0:04:58.09,0:05:05.27,Default,,0000,0000,0000,,자기자신만의 속성을 가지고 새로운\N윈스턴 인스턴스를 만들었어요
Dialogue: 0,0:05:05.27,0:05:08.80,Default,,0000,0000,0000,,그리고 전달받은 속성을 생성자로 다시 대입 시켰죠
Dialogue: 0,0:05:08.80,0:05:14.38,Default,,0000,0000,0000,,외워야 합니다 {\i1}this.nickname{\i0}과 {\i1}this.age{\i0}에서
Dialogue: 0,0:05:14.38,0:05:20.21,Default,,0000,0000,0000,,만약에 {\i1}this.age{\i0} 대입문을 안썼다면 "정의 안됨" 오류가 날 거예요
Dialogue: 0,0:05:20.21,0:05:23.10,Default,,0000,0000,0000,,왜냐하면 밑에 {\i1}drawWinston{\i0} 함수에서
Dialogue: 0,0:05:23.10,0:05:28.16,Default,,0000,0000,0000,,{\i1}winston{\i0}에 나이 속성이 있어야 하기 때문이죠
Dialogue: 0,0:05:28.16,0:05:30.89,Default,,0000,0000,0000,,다시 말해서, {\i1}this.age{\i0}를 안썼다면
Dialogue: 0,0:05:30.89,0:05:34.03,Default,,0000,0000,0000,,나이 속성이 없는 거지요\N생성자로 전달 받긴 했는데
Dialogue: 0,0:05:34.03,0:05:39.36,Default,,0000,0000,0000,,그것으로 아무것도 안했잖아요\N{\i1}this{\i0}를 이용해 객체에 대입해야 합니다.
Dialogue: 0,0:05:39.36,0:05:41.44,Default,,0000,0000,0000,,여기에 덧붙여서 말하자면,
Dialogue: 0,0:05:41.44,0:05:46.36,Default,,0000,0000,0000,,여러분은 아마 이렇게 생각할지도 몰라요\N"코드가 작동하는 군. 그냥 멋지네"
Dialogue: 0,0:05:46.36,0:05:50.59,Default,,0000,0000,0000,,"전에 했던 거랑 똑같네"
Dialogue: 0,0:05:50.59,0:05:55.100,Default,,0000,0000,0000,,하지만 이제 모든 윈스턴이 같은 생성자에 들어간다는 겁니다
Dialogue: 0,0:05:55.100,0:06:00.83,Default,,0000,0000,0000,,만약에 윈스턴에서 뭔가를 고치면
Dialogue: 0,0:06:00.83,0:06:06.59,Default,,0000,0000,0000,,모든 윈스턴들이 다 고쳐집니다\N예를 들어 나이 뒤에 {\i1}"years old"{\i0}라 하면
Dialogue: 0,0:06:06.59,0:06:12.80,Default,,0000,0000,0000,,여기만 바꿨는데, 모든 윈스턴 뒤에\N{\i1}"years old"{\i0}가 붙어요
Dialogue: 0,0:06:12.80,0:06:17.28,Default,,0000,0000,0000,,인스턴스만의 속성에 공통적인 속성도 공유할 수 있다는 것이지요
Dialogue: 0,0:06:17.28,0:06:20.97,Default,,0000,0000,0000,,이것이 바로 객체 지향 프로그래밍 만의 장점이지요
Dialogue: 0,0:06:20.97,0:06:26.63,Default,,0000,0000,0000,,여러 종류의 객체가 있을 때 이것을 인스턴스로 만들 수 있고,
Dialogue: 0,0:06:26.63,0:06:29.92,Default,,0000,0000,0000,,이 객체들이 서로 같은 속성이 있다면
Dialogue: 0,0:06:29.92,0:06:35.53,Default,,0000,0000,0000,,뭔가가 다를 때 이 속성은 저 속성과는 다르다는 것을\N쉽게 알 수 있겠죠?
Dialogue: 0,0:06:35.53,0:06:40.74,Default,,0000,0000,0000,,그게 아니라 속성이 서로 비슷하다면,\N서로 공유하는 함수를 만들어
Dialogue: 0,0:06:40.74,0:06:45.83,Default,,0000,0000,0000,,비슷하게 이용하면 될 것입니다\N이것이 바로 객체지향 프로그래밍의 장점의 일부고요
Dialogue: 0,0:06:45.83,0:06:48.69,Default,,0000,0000,0000,,이것 말고도 좋은 점은 무척 많답니다
Dialogue: 0,0:06:48.69,0:06:51.00,Default,,0000,0000,0000,,다음에 만나요!