오늘 배운것

• 클래스와 인스턴스
• 객체지향 프로그래밍
• 클래스와 프로토타입
• 프로토타입 체인

클래스와 인스턴스

1. 객체지향 프로그래밍은 모델로써의 '청사진'을 생성하여,
   그 청사진을 바탕으로 한 객체를 만드는 패턴을 말함.

   ==> 여기서 청사진: class
   ==> 청사진을 바탕으로 생성된 객체 : instance 라고 용어를 지정

2. 청사진 만들기 (class만들기)
   일반함수와 같다. 단, 구분을 위해 대문자 + 심플한 일반명사로 만들어준다
   예시) class Car {
   constructor(brand, name, color )
   }

3. 키워드 new
   일반 변수선언과 같다. 단, instance는 new 를 붙여서 만든다.

   ==>let avante = new Car ('bmw', 'mini', 'white');

   각 isntance는 클래스의 고유한 속성과 메소드를 가지게 됨.

4. 완성예시(클래스)

• es5

function Car (brand, name, color){
	this.brand = brand;
  	this.name = name;
  	this.color = color;
}
Car.prototype.refuel = function(){
	//메소드 : ${this.name}에 연료를 공급합니다.
}

• es6

class Car{
	constructor(brand, name, color){
    	this.brand = brand;
  		this.name = name;
  		this.color = color;
    }
  	refuel() {
      //메소드 : ${this.name}에 연료를 공급합니다.
    }
}

5. 완성예시(인스턴스)

let avante = new Car ('bmw', mini', 'white');
mini.brand; //bmw
mini.refuel(); //미니에 연료를 공급합니다. 

6. 참고1.
   배열은 Array의 인스턴스.
   따라서

let arr = new Array('a','b','c');
arr.length// 3
arr.push('course');

이런 형태로로 사용가능함. 

7. 참고2 (출처 mdn)

class Teacher extends Person {
  constructor(first, last, age, gender, interests, subject, grade) {
    super(first, last, age, gender, interests);

    // subject and grade are specific to Teacher
    this.subject = subject;
    this.grade = grade;
  }
}

////////////////////////////////////////////////

**extends **super() 
**const Bee = require('./Bee'); //물론 상위 클래스를 불러와야함(상속의경우)

super()연산자를 사용해주면 코드를 읽기 수월함. 
이는, 상위클래스의 생성자를 호출하여 super()의 매개변수를 통해 상위 클래스의 멤버를 
상속받을 수 있는 코드임. 

객체지향 프로그래밍

• oop는 4가지 주요 개념을 통해 재사용성을 얻을 수 있음.
• oop의 모든것은 '객체'로 그룹화
  한번 객체로 만들어지면, 메모리상에서 반환되기 전까지 객체 내의 모든 것이 유지됨.

캡슐화 Encapsulation

• 데이터와 기능을 하나의 단위로 묶는 것. 모으자!
• 은닉화

상속 Inheritance

• 상위클래스로부터 속성과 메소드를 받아올 수 있음.

추상화 Abstraction

• 어려운 로직구현된 간단한 버튼들로 동작시킴.
  (따라서 어려운 로직은 신경쓰지 않아도 된다)
• 메소드와 속성만 정의한 것을 인터페이스

다형성 Polymorphism

• 객체의 특성에 맞게 달리 작성하는 것이 가능

클래스와 프로토타입

프로토타입 체인

• 상속

• div 엘리먼트의 클래스 모식도