OOP - (1) 캡슐화, 추상화

 

OOP (Object Oriented Programming) / 객체지향프로그램

---

• Encapsulation - 캡슐화
• Abstration - 추상화
• Factory Function - 팩토리함수
• Inheritance - 상속

---

 OOP란 객체를 이용해서 코드를 정리하는 방식 이다.

예를 들어 기존에는 티비를 직접 가서 버튼을 눌러 켜야했지만,

'리모콘'이 생긴다면 좀더 편리하게 조작할 수 있게 된다.

이러한 것을 객체지향프로그램이라고 한다.

 

발명가와도 같다! 

 

티비의 리모콘 기능중, 볼륨을 조절하는 코드를 작성해보았다.

객체안에 구현된 함수이기때문에 메소드 형태이다.

var tv = {
  volume : 0,
  volumeMax : function(){
 	this.volume = 100;
  },
  volumeMin : function(){
 	this.volume = 0;
  }
};

tv.volumeMax();
tv.volumeMin();

 

물론 최대볼륨과 최소볼륨만 있다면 사용하기는 힘들겠지만... 이렇게 가정해보았다!

 

그럼 이  tv라는 객체 에는, 볼륨을 조정하는 '기능'과, 그 기능에 대한 '정보'등이 들어있게 된다.

따라서 객체란 만들고자 하는 물건에 대한 관련 정보나 기능, 또는 행동들을 가졌다고 할 수 있다.

 

 

 

 

그런데 이 코드에는 문제가 하나 있다.

tv.volume = 77777;

 

이렇게 적는다면 사용자가 내부정보인 '볼륨'의 기본값을 마음대로 바꿔버리게 되므로... (생략)

그래서 사용자가 내부의 정보를 마음대로 바꿀 수 없도록 만들어줄 수 있다.

 

//...캡슐화 Encapsulation...

var tv = (function(){
  var volume = 0;//보호해놓은 변수
  
  return {
  	volumeMax : function(){
 		volume = 100;
  	},
  	volumeMin : function(){
 		volume = 0;
  	}
  };
})();

tv.volumeMax();
tv.volumeMin();

티비의 볼륨을 조정하는 코드를 즉시실행함수로 다시 재작성했다.

 

볼륨을 조정하는 메소드 자체는 리턴값으로 var volume 라는 변수에 담긴다.

따라서 볼륨을 조정하는 '기능'자체는 사용자가 여전히 조작할 수 있지만,

var volume이라는 변수는 조작되지않고 보호될 수 있게된다.

이제 사용자는 더 이상 볼륨의 기본값을 바꿀수 없게 되었다!

 

이렇게 허용되지 않은 사용자가 함부로 접근할 수 없도록 내부 정보를 보호하는 것을 캡슐화라고 부른다.

 

 

---

 캡슐화 (Encapsulation) 

캡슐화란 관련있는 변수와 메소드를 하나의 틀안에 담고, 

외부에 공개될 필요가 없는 정보를 숨기는 정보은닉 방법이라고 할수있다.

물론 정보은닉을 할 수 있는 특징을 가지는 것 뿐,

캡슐화 = 정보은닉은 아니라는것에 주의하자.

 

정보를 감추는 것은 클로저와 연관이 있는데,

 var volume은 함수가 종료되서 더이상 접근할 수 없지만, 

클로저기능에 의해  volumeMax, volumeMin 함수를 통해 변수에 접근 할 수 있기때문에

var volume 이라는 변수가 보호되는 것이다.

*클로저 : 함수가 생성될 때 당시의 상황을 기억하는 것

 

 

또한 이와 같은 방식을  모듈방식(모듈패턴) 이라고 한다.

 

 

다만 모듈방식에서 보호해놓은 변수가 객체나 배열일경우에는 주의해야한다.

이 경우 외부에서 변수가 변경될 수 있으며

반환된 객체가 반환한 객체의 프로토타입에 접근할 수 없다. (이는 상속을 구현할 수 없다는 말이 됨)

이를 보완하기 위해서는 함수형으로 호출을 하게 된다.

 

 

쉽게 말해서, 은닉하고자 했던 내용이 객체,배열등을 참조하게 된다면

참조되어있는 내용을 바꾸게 되면 그 내용도 수정이 가능하다는 소리이다.

이는 primitive / reference 에서 공부했던 참조방식과 동일하다고 생각하면 될것같다.

 

 

//...함수형으로 호출하자

var Tv = (function(){
  var volume = 0;//보호해놓은 변수

  var vol = function(){}
  	vol.prototype = 
      {
    	volumeMax : function(){
 		volume = 100;,
        },
        volumeMin : function(){
 		volume = 0;
  		}
      }
	return vol;
})();

var tv = new Tv();
console.log(tv.volumMax);

 

하지만 프로그래밍을 하는 것은 정답이 없기때문에

무조건 함수형으로 호출하는게 좋다는 뜻은 아니라는 것을 꼭 생각하자!

 

 

 

---

 

그럼 이제, 이 티비를 실제로 작동시키는 사용자는 어떻게 사용을 할 수 있을까?

작동시킬때마다 복잡한 코드를 하나하나 입력해야만 작동이 된다면 ?

 

아무도 그 티비는 사지 않을 것이다 . .

이런 복잡한 작동원리는 사용하는 사람에게는 불필요한 정보이며,

사용자는 그저 버튼만 눌러서 사용하면 된다.

 

이처럼 복잡한 원리, 방식등을 숨겨주는 작업을 추상화(Abstration)라고 부른다.

 

---

 추상화 (Abstration)  

복잡한 원리나 구동방식을 사용자로부터 숨겨주는 작업.

 

 

 

---

수업해주신 Ken 님 감사합니다 :)  틀린점이 있다면 언제든지 댓글로 알려주세요.

 

참고 및 더 알아보기 :

1. https://poiemaweb.com/js-object-oriented-programming