[TIL/JavaScript] 2023/01/12

1. 클래스와 객체(1)

객체(Object)란 '물리적으로 존재하거나 추상적으로 생각할 수 있는 것중에서 자신의 속성을 갖고 있고 다른 것과 식별 가능한 것'을 의미한다. 객체를 생성하기 위해서는 클래스(Class)를 선언해야 한다.

'객체'는 이미지 좌측 하단에 위치하고 있는 '토토로'이다. 완성된 토토로 모형은 물리적으로 존재하며 자신의 속성을 갖고 있고, 다른 것과 식별 가능하다. 토토로를 제작하기 위해 우측에 제시되고 있는 '설계도 또는 조립도'가 바로 클래스이다.

객체를 만드는 방식은 다음과 같다. const + 변수명 = new + 클래스명 + (생성자에서 정의한 매개변수들...)

노트북이라는 객체를 생성하기 위해 필요한 설계도를 그리는 방식은 다음과 같다. 'class + 클래스명' -> '생성자(매개변수들...)' -> 'this와 속성'

객체의 속성 하나하나에 접근해 갖고와야 할 때, 'this.속성명'을 사용한다. 터미널을 통해 각각의 값이 return되었음을 확인할 수 있다.

2. 클래스와 객체(2)

앞서 class는 '설계도'라고 비유한 바 있다. 데이터(값)를 나타내는 속성을 주로 정의했는데, 함수와 같이 특정 코드를 실행할 수 있는 메소드(method)도 class에서 정의할 수 있다. method를 class에서 정의하고 호출하는 과정은 다음과 같이 이루어진다.

다음으로 '객체 리터럴'이라는 개념에 대해 학습했다. '객체 리터럴'이란 class와 같은 템플릿 없이 빠르게 객체를 만들 수 있는 방식을 의미한다. 기본적인 구조는 다음과 같다.

백견이 불여일타, 바로 코드를 작성해봤다.

퀴즈) 의류 쇼핑몰을 만들려고 한다. 옷의 종류는 많지만 기본적으로 색깔, 사이즈, 가격의 속성을 갖고 있다. 그리고 이 옷들의 세 속성을 바로 확인할 수 있게 출력해주는 메소드가 필요하다. 클래스와 객체를 활용하여 코드를 작성해보자.

회고

멀지 않은 미래에 도로에서 운전하기 위해, 이제 막 기능시험을 준비하며 운전대를 처음 잡아본 운전자의 마음이다. 엑셀, 브레이크, 핸들링, T자 주차 등... 각각의 항목들을 잘 수행하고 있지만, 초보운전자의 마음 깊은 곳에서 메아리가 울린다. "내가 도로에 나갈 수 있다고?"

스탑 띵킹 저스트 킵 고잉 하자! 지옥같은 목요일도 잘 버텼다!