Class 클래스

조금 더 연관있는 데이터를 한곳에 묶어놓는 컨테이너같은 역할

ES6 이전 Class 문법

const student1 = {
	name: 'alice',
  	age: 26
}


const student2 = {
	name: 'lucy',
  	age: 15
}

이런 방식으로 코드를 짰을 경우 student 의 정보가 많아지면 불필요하게 코드가 길어진다.
이렇게 비슷한 Object 를 많이 만들일이 있다면 Class 를 만들어 쓰는게 효율적이다.
Class 는 Object 를 뽑아내는 기계라고 이해하면 쉽다.

function 기계(){
	this.student = 'alice';
  	// 새로 생성되는 object에 {student : 'alice'} 를 추가해줘
  	this.age = 26;
  	// 새로 생성되는 object에 {age : 26} 을 추가해줘
}

const student1 = new 기계()
// console.log(student1)
// -> 기계 {student : "alice", age: 26}

this -> 기계로부터 생성되는 Object들 (= 주로 instance 라고 한다.)

여기서 발생하는 문제점:
-> 그러면 계속 똑같은 Object들만 생성되지 않나?
  
해결책:
-> 파라미터 삽입

class 기계(구멍){
	this.student = 구멍;
}

const student1 = new 기계('jack')
// console.log(student1)
// -> 기계 {student : "jack"}

---

ES6 Class 문법

Class

• template
• declare once
• no data in

⬇️⬇️⬇️

• 틀/템플릿
• 클래스 자체에는 데이터가 들어가지 않고 틀만 정의하는 것.
  (이런 클래스에는 이런 데이터만 들어올 수 있어! 라고 정의 해놓고 한번만 선언한다.)

---

Object

• instance of a class
• created many times
• data in

⬇️⬇️⬇️

Class 를 이용해서 실제 데이터를 넣어서 만드는 것
Class 를 이용해서 새로운 instance를 생성하면 Object가 된다.

---

Class 선언

class Person {
  	// constructor 생성자 -> object를 만들 때 필요한 데이터 전달
	constructor(name, age) {
    // fields
      this.name = name;
      this.age = age;
    }
  
  	// methods
  	speak() {
    	console.log(`%{this.name}: hello!`);
    }
}

const ellie = new Person('ellie', 20);

console.log(ellie.name);
// ellie
console.log(ellie.age);
// 20
ellie.speak();
// ellie: hello!

유튜브 코딩애플 / 드림코딩 참고