OOP, 객체지향 프로그래밍에 대한 알기쉬운 개념설명
- 개발자들이 가장 쓸데없이 어렵게 써놓은 용어들 중 하나가 바로 객체지향 프로그래밍. OOP (Object Oriented Programming)개념이다.
이걸 좀더 단순하게 설명해보자면 - 박스 안에 여러가지 내용을 넣어두고 '내맘대로 이름'을 정해둘 수 있는 방식이다. 마치, 즐겨찾기 폴더처럼 어떤 내용이 들어가있을지는 내가 뭘 넣어뒀느냐에 따라서 달라진다. 또한 이 박스는 한번 만들면 어디에서어떻게 불러오건 '그 박스'와 '그 박스 안에 있는 물건들'을 가져오게된다. 그 안에 들어있는건 수식일 수도 있고, 미리 저장되어있는 데이터일수도 있고, DB에서 불러와야하는 데이터 호출방식일수도 있다. 말 그대로 자주 쓰는 물건들을 한데 담아놓고, 이 박스 이름은 이제 '내가 자주쓰는 OO용 박스다' 라고 이름을 붙여놓는거나 다름없다. 상황마다 필요한 물건들을 찾으러다니다보면, 그 과정에서 쓸데없이 코드가 길어지니까. '이 기능은 이 이름'으로 정의하고. 다시 불러오고. 반복사용하기 편하라고 만들어둔 '즐겨찾기 폴더' 같은거라고 생각해두면 이해가 쉽다.
다만 이런 폴더라는건. '머리가 좋고, 정리를 잘 하는 사람'일수록 쓰기가 유리한데. 자주쓰는 공통 도구나, 기능들을 한데 모아두고서. 복잡하지 않고 단순한 기능의 조합만으로도 문제를 해결하기 때문이다. 결국 수식을 지저분하게 길고 써봐야, 합축적이고 간단한 방법으로 해결하는게 낫다는 이야기. 그러니 중요한 내용 몇개만으로도 거대한 문제를 효율적으로 해결할 수 있도록 코드를 짜는게 프로그래밍을 잘하는거다. (쓸데없는 상태값이나 파라미터는 최대한 줄이고, 꼭 필요한 핵심 내용은 한데 묶어서 사용해야한다는 이야기)
OOP의 개념에대한 간단한 설명영상 (영어)
https://www.youtube.com/watch?v=pTB0EiLXUC8
- 여긴 그냥 네가지 답이 있다. 국내 문서들은 이 부분을 참 이해안가게 설명해두는 사람들이 많아서. 내 방식대로 다시 정리해본다. (해외 문서가 훨씬 이해가 쉽게 잘 정리가 되어있더라)
자바스크립트의 OOP적 특성
1. Abstraction (추상화) = 개별 기능의 목적에 맞는 이름을 임의로 붙일 수 있다
2. Encapsulation (캡슐화) = 개별 값에 대한 메타연결 + 안전하게 데이터를 연결하기
3. Inheritance (상속구조) = 기존 특성 물려받기
4. Polymorphism (다형성) = 세세한 명령을 내리지 않아도, 상황이나 맥락에 맞는 결과값을 가져올 수 있다
1. Abstraction (추상화 ) = 개별 기능의 목적에 맞는 이름을 임의로 붙일 수 있다
OOP. 객체지향 프로그래밍이라는건,말의 의미보다는 개념을 이미지화해놓는게 더 이해가 편하다. OOP는 결국 박스 안에 '어떤 것들을 넣어두는가'에 대한 내용이고. 그 안에 들어가게될 것들의 사용목적이나, 큰 범주 등을 이름표로 붙여놓게된다. 예를 들어 - 이삿짐을 생각해보면, 옷이나 신발을 집어넣은건 '잡화'이고, 드라이버나 망치, 못 등이 들어가면 '공구함'이 될거다. 이런 '의도한 공통의 속성이나 기능을 묶어서 이름을 붙이는게 추상화다. 왜 이게 추상화냐고 말하면, 이런 '판단의 기준점'이 사람이 아니라 컴퓨터의 입장에서 바라본 내용이기 때문이다.
예시 :
- 오브젝트 (박스) 이름 = 인물 프로필
- 담고있는 개별 클래스 (물건 / 정보규격) = 이름 / 나이 / 성별 / 키 / 몸무게 / 사는곳 / 직장 - 등등
- 개별 프로필 정보를 표현해줘야할때. '인물 프로필' 이라는 오브젝트 (박스) 를 가져다 사용할 예정
- 특정 개인에 대한 정보가 입력되거나, 수정되었을 경우, '인물 프로필' 이라는 오브젝트 (박스) 안에 들어있는 개별 클래스 (물건 / 정보규격) 에 대한 업데이트를 진행할 예정.
- 이런 방식 외에도 수식이나, 특정 공식. 혹은 클래스 (물건 / 정보규격)들을 서로 연결해 수식을 만들어내기도함.
2. Encapsulation (캡슐화) = 개별 값에 대한 메타연결 + 안전하게 데이터를 연결하기
서로 상관없는 내용들을 묶어서. 기호처럼 사용하는 방식. 예를 들어서 A=10일때. A+4는 14가 된다. 마치 이 수식에서처럼 A= 무엇이다. 라고 메타 (대체) 연결을 진행하는게 캡슐화에 대한 내용이다. 뭐 이렇게 간단한걸 이렇게 꼬아놓나 싶지만. 개별 데이터값을 그대로 노출하지않고. 개발 코드 내에서 '안전하게 불러와서 사용하기위한' 방식이다.
예시 :
실제 A값 : 10 (외부에선 알 수 없음)
계산에 사용된 수식 : A+4 = ?
최종결과값 : 14
반대로 말하면 직관적인 코드작성을 피하면서, 안정성을 올리는 방법이라는 이야기. 개별 코드의 데이터값을 알 수 없도록 꼬아뒀기 때문에. A의 값을 알지 못하더라도, 수식의 최종값에는 원하는 결과가 나오지만. 실제 해당 내용을 확인하려면 - 실제 코드가 가리키는 내용을 열어봐야만 알 수 있다. 사실 다른사람들이 짜둔 자바스크립트 코드를 알아보기가 지랄맞은 이유중에 하나가 바로 이 지점 때문인 경우가 많다.
3. Inheritance (상속구조) = 기존 특성 물려받기
OOP는 자주 쓰는 박스 안에 내가 원하는 내용을 넣어둔 방식이라고 했었던걸 기억하자. 내가 어디에 있건간에. 내가 미리 정리해둔 '그 박스'를 불러오면, 당연히 그 안에는 기존에 넣어두었던 '그 물건'들이 들어있다. 그리고 박스내의 '물건들'을 꺼내서, 다시 새로운 박스에 넣고, 새로운 박스를 만들 수도 있다.
현실에서라면 동시에 한가지 물건이 동시에 두 곳에 존재할 수 없겠지만. 프로그래밍의 세계에서는 두개의 박스 안에 들어있는 도구가 서로 동일한 하나의 물건일 수 있다. 그래서 한 박스에서 꺼내서 그 도구를 쓰게되면. 그 기록이나, 변화지점이 - 다른 박스에 들어있는 도구에도 영향을 준다. 이런 인스턴스 개념에 익숙하지 않은 디자이너들에게 이해하기 쉽게 설명하자면 - PSD의 스마트 오브젝트를 두개 복사해서, 개별 레이어에 담아둔 거라고 생각해두면 이해가 쉬울듯 하다. 한 쪽의 스마트 오브젝트를 수정하면, 다른 레이어에도 동일하게 수정된 내용이 적용되는걸 기억한다면. 바로 그 기능이다. 그걸 굳이 '상속이니 뭐니' 해둔 것이고. 간단히 '서로 연결된 상태인 인스턴스' 개념이라고 생각하면 된다.
예시 :
두 개의 오브젝트 (박스) 에서 동일한 클래스를 동시에 사용할 수 있다. (서로 동일한 내용이나 규격을 갖고있음)
- 오브젝트 (박스 A) 이름 = 인물 프로필
- 담고있는 개별 클래스 (물건 / 정보규격) = 이름 / 나이 / 성별 / 키 / 몸무게 / 사는곳 / 직장 - 등등
- 오브젝트 (박스 B) 이름 = 대학교 학생증
- 담고있는 개별 클래스 (물건 / 정보규격) = 이름 / 학년 / 학교 이름
- 두 오브젝트 (박스 A, B)는 서로 다르지만. 그 안에 담겨있는 '이름'이라는 클래스는 동일하게 사용되고있다.
4. Polymorphism (다형성) = 세세한 명령을 내리지 않아도, 상황이나 맥락에 맞는 결과값을 가져올 수 있다
내가 생각하기에 개발자들이가장 '비직관적으로, 설명을 못해둔' 내용들중 하나. 내 식대로 단순화하자면 이렇다. 프로그래밍이란건 결국엔 '내가직접 무언가를 하는게' 아니라. 프로그램. 컴퓨터가 일을 하게 시키는 방식이다. 그렇다보니 기존에 내가 정리해둔 '박스' 안에서 '무언가'를 꺼내오게 할 때도. 정확히 어떤걸, 어디에서 꺼내오게 할 것인지가 중요하다. 컴퓨터는 사람처럼 똑똑하지가 않기 때문에 - 일반적으로 '어디어디에 있는, 몇번째 박스들 중에. 무어라고 써있는 박스 안에. 어떻게 생긴 OOO를 꺼내와라' 같이 자세하게 이야기를 해줘야한다. 다만 OOP 에서는 이런 세세한 설명 대신, '창고안에있는 OOO박스 안에 첫번째 있는 내용을 가져와. 근데 그게 무슨이름이건, 어떤 애건 상관없어' - 같이 뭉뚱그린 명령을 내릴 수 있다.
예를 들어서, 샐러드를 손에 들고있는 친구 A와, 도시락을 들고있는 친구 B가 있다고 할 때. 프로그래밍을 통해 - A와 B가 각각 손에 들고있는 '무언가'를 가져와. 라고 말하기만해도. 우리는 샐러드와 도시락을 각각 가져오도록 만들 수 있다. 이게 OOP의 다형성. 상황이나 맥락에 맞는 결과값을 어느정도 감안해서 적용이 가능하다는 이야기인데. 이런 '맥락'이라는건. 매우 제한적인 수준이고. 기존 다른 프로그래밍 모델에 비해 좀 낫다는 것 뿐이다. 그렇게 중요한 내용은 아니니까, 너무 큰 기대는 하지 말자.
사실상 4번은 자바스크립트에서 크게 중요하지않다. 그러니1, 2, 3번은 꼭 기억해두자.
1. Abstraction (추상화) = 개별 기능의 목적에 맞는 이름을 임의로 붙일 수 있다
2. Encapsulation (캡슐화) = 개별 값에 대한 메타연결 + 안전하게 데이터를 연결하기
3. Inheritance (상속구조) = 기존 특성 물려받기
4. Polymorphism (다형성) = 세세한 명령을 내리지 않아도, 상황이나 맥락에 맞는 결과값을 가져올 수 있다
이 내용은 UI 디자인 연구소 - 단톡방에 올려진 자료를 정리하여 만들어진 컨텐츠입니다.
저희 단톡방은 잡담이 불가능한 방입니다. 단톡방에 들어오시려는 분은 - 이용안내문을 꼭 확인해주세요!
단톡방 이용안내
https://brunch.co.kr/@clay1987/113
위 자료는 UI 디자인 연구소에서 공유된 자료입니다
https://open.kakao.com/o/gfQpajKb