자바스크립트의 OOP(객체지향형 프로그래밍)

객체란?

객체는 객체지향언어를 공부하시는 분이라면 무조건 이해해야 할 만큼 중요합니다.

객체(Object)란? 세상에 존재하는 모든 것 입니다. 즉, 주변에 있는 사물, 생명을 말합니다. 프로그래밍 관점에서 객체는 데이터의 분산을 막기 위해서 데이터와 기능을 하나로 묶은 그룹이라고 볼 수있습니다.

장점

• 직관적으로 이해하기 쉽다
• 유지 보수를 용이하게 만든다

객체를 만들어주고 객체 안에 프로퍼티와 메서드를 만들고
외부에서 프로토 타입을 이용해 프로퍼티와 메서드를 넣는 방법이다

function Song(title, writer, singer, released) { // 객체, constructor함수
  this.title = title;
  this.writer = writer;
  this.singer = singer;
  this.released = new Date(released);
  //객체 안에 프로퍼티가 아닌 메서드도 생성가능
  this.getReleaseDay = () => {
    return this.released.getDay(); //요일을 불러오는 메서드
  };
  this.getSongInfo = () => {
    return `제목 : ${this.title} 작곡 : ${this.writer}, 가수 : ${this.singer} `;
  };
  console.log(this);
}

Song.prototype.getReleaseDay = function () { //외부에서 프로토 타입을 이용해 메서드를 객체에 추가할 수도 있다
  return this.released.getDay();
}

Song.prototype.getSongInfo = () => {
  return `제목 : ${this.title} 작곡 : ${this.writer}, 가수 : ${this.singer} `;
}

// 인스턴스
const song1 = new Song("lose yourself", "eminem", "eminem", "1995-10-22"); //new를 빼면 Song을 가르키는 것이 아닌 전역객체(window)를 가르킨다
//콘솔 출력시 title:lose yourself, writer:eminem, singer: eminem, released:1995-10-22 이렇게 잘나온다
const song2 = new Song("hater", "joe", "joe", "2020-06-01");
//서로 다른 객체가 생성된다

위의 코드는 조금 옛날 버전이고 ES6부턴 class라는 것이 등장한다
위의 코드와 결과가 똑같다!

class Song {
  constructor(title, writer, singer, released) {
    this.title = title;
    this.writer = writer;
    this.singer = singer;
    this.released = new Date(released);
  }
  getReleasedDay() {
    return this.released.getDay();
  }
  getSongInfo() {
    return `제목 : ${this.title} 작곡 : ${this.writer}, 가수 : ${this.singer} `;
  }
}

// 인스턴스
const song1 = new Song("lose yourself", "eminem", "eminem", "1995-10-22"); 
const song2 = new Song("hater", "joe", "joe", "2020-06-01");

console.log(song1.getSongInfo(), song2.getSongInfo());