객체 지향 프로그래밍! 코딩 공부를 하면서 여러번 본 단어다. 이게 무슨 의미인 걸까? 일단은 사전적 정의를 찾아보았다.
MDN : 데이터가 객체 내에 캡슐화되고 구성 요소 부분 이 아닌 객체 자체가 운용되는 프로그래밍 방식. JavaScript는 매우 객체 지향적인 언어로, 클래스 기반의 언어들과는 대조적으로 프로토타입 기반의 모델을 따른다.
Wikipedia : 컴퓨터 프로그래밍의 패러다임 중 하나로, 컴퓨터 프로그램을 명령어의 목록 으로 보는 시각에서 벗어나 여러 개의 독립된 단위, 즉 객체들의 모임으로 파악하고자 하는 것이며, 각각의 객체는 메시지를 주고받고 데이터를 처리할 수 있다.
......
그 외에도 여러 정의가 있었지만, 그래. 이름 그대로 객체가 중요하다는 거군. 그래서 정확히 뭐라는거야? 라는 생각이 들던 중, 확 와닫는 정의가 있었다.
- 객체지향 프로그래밍이란 실세계의 사물을 추상화(Abstraction), 캡슐화(Encapsulation), 상속(Inheritance), 다형성(Polymorphism) 하여, 코드 재사용을 증가 시키고 유지보수를 감소시키는 장점을 얻기 위해서 객체들을 연결 시켜 프로그래밍 하는 것 입니다. (출처 : https://vandbt.tistory.com/10)
아하! 객체들을 연결 시킴으로써 효율성을 극대화 시킨 프로그래밍 방법이구나! 그렇다면 저기서 말하는 추상화, 캡슐화, 상속, 다형성은 뭘까?
객체 지향 프로그래밍의 이러한 특성 덕분에,
반면,
객체 지향 프로그래밍을 하려면 객체를 만들어야 할 것이다.
그렇다면, 객체를 생성하는 방법에는 어떤 것들이 있을까?
let obj = { name : 'Kay', id : 'code-kay' };
let obj = new Object();
obj.name = 'Kay';
obj.id = 'code-kay';
let Obj = { name : 'Kay', id : 'code-kay' };
let obj1 = Object.create(Obj);
let obj2 = Object.create(Obj);
function Person(name, id){
this.name = name;
this.id = id;
}
let obj = new Person('Kay', 'code-kay');
var Burger = function(patty) {
var someInstance = {};
someInstance.patty = 1;
someInstance.extraPatty = function() {
this.patty += 1;
}
return someInstance;
};
var burger1 = Burger(1);
var burger2 = Burger(2);
burger1.extraPatty();
console.log(burger1.patty) // 2
console.log(burger2.patty) // 2
var extend = funciton(to, from) {
for (var key in from) {
to[key] = from[key];
}
};
var someMethods = {};
someMethods.extraPatty = function() {
this.patty += 1;
};
var Burger = function(patty) {
var someInstance = { patty: patty };
extend(someInstance, someMethod);
return someInstance;
};
var burger1 = Burger(1)
var someMethods = {};
someMethods.extraPatty = function() {
this.patty += 1;
};
var Burger = function(patty) {
var someInstance = Object.creat(someMethods);
//someMethods를 prototype으로 하는 객체를 생성
someInstance.patty = patty;
return someInstance;
};
var burger1 = Burger(1)
var Burger = function(patty) {
this.patty = patty;
};
Burger.prototype.extraPatty = function() {
this.patty += 1;
};
var burger1 = new Burger(1);
var burger2 = new Burger(2);
포스팅을 하다보니 '프로토타입'이라는 용어가 계속해서 등장한다. Javascript는 프로토타입 기반의 언어라던가, 객체의 프로토타입을 설정한다던가... 이게 무슨 뜻일까?
Java, Python 등등 객체지향언어에서 클래스(Class)는 빠질 수 없는 개념이라고 한다. 그런데 JavaScript는 객체지향언어 인데 클래스라는 개념이 없다...! 대신 프로토타입이라는 것이 있는데, 이를 활용해서 클래스를 흉내낼 수 있다고 한다.
CheeseBurger라는 생성자 함수로 만든 객체에
Burger이라는 생성자 함수의 속성도 상속시켜주고 싶을 때,
CheeseBurger.prototype = Object.create(Burger.prototype);
CheeseBurger.prototype.constructor = CheeseBurger;
var CheeseBurger = function(name) {
Burger.call(this, name); // Burger.apply(this, arguments)
}
지금까진 프로토타입으로 클래스와 상속을 흉내내느라 눈물의 응꼬쑈 를 했는데, 최신 문법인 ES6에서는 클래스를 사용할 수 있게 되었다. 정확히 말하면, 작동되는 원리는 똑같지만 클래스 문법을 통해 쉽게 사용할 수 있게 된 것이다.
class Burger {
constructor(patty) {
this.patty = patty;
}
extraPatty(){}
}
class CheeseBurger extends Burger { //extends로 연결
constructor(patty) { //constructor가 똑같아서 생략 가능
super(patty); //this 전달은 super로 대체
}
extraCheese(){}
}