맨날 헷갈리는 클래스와 get, set

Jean·2023년 7월 26일

클래스란?

객체 생성기

많이 만들어 둘 객체의 틀을 잡아두는 것!
객체 공장이라고 볼 수 있다

class Person {
	// constructor는 이름을 변경할 수 없어요.
  constructor(name, age) {
		// 이름(name)과 나이(age)가 없으면 사람이 아니죠?
		// new라는 키워드를 이용해서 인스턴스를 만들 때, 기본적으로
		// 넣어야 하는 값들을 의미해요! :)
		// 여기서 말하는 this는 만들어질 인스턴스를 의미한다고 생각해주세요!
    this.name = name;
    this.age = age;
  }

	// 다양한 메소드를 아래와 같이 정의할 수 있어요.
	// 여기서 this.name으로 내부 값을 접근해야 함을 잊지 마세요! :)
  sayHello() {
    console.log(`Hello, my name is ${this.name} and I'm ${this.age} years old.`);
  }
}

const person1 = new Person("Alice", 30);
const person2 = new Person("Bob", 25);

// 만든 객체를 토대로 메서드 호출해보기
person1.sayHello(); // 출력: "Hello, my name is Alice and I am 30 years old."
person2.sayHello(); // 출력: "Hello, my name is Bob and I am 25 years old."

get, set

좀 더 쓰기 쉽게, 보기 쉽게

클래스의 변수를 꺼내 쓰거나 수정할 때 함수를 이용해서 출력, 수정한다
이유는 객체 안의 데이터가 복잡할수록 외부에서 접근이 힘들고, 수정할 때 실수를 방지하기 편하기 때문 (정수자리에 문자열을 넣는다던가...)

객체에서

const person ={
 name:"kim",
 age:20,
  nextYear(){
    return this.age +1
  },
  setAge(age){
    this.age = parseInt(age)
  }
  
  person.nextYear() //21
  person.setAge('40') //40

이때 get, set을 써보면 데이터 입출력이 좀 더 간편하고 보기도 편해진다!

const person ={
 name:"kim",
 age:20,
  get nextYear(){
    return this.age +1
  },
  set setAge(age){
    this.age = parseInt(age)
  }
  
  person.nextYear //21
  person.setAge='40' //40

클래스에서

const Person {
 constructor(){
    this.name = 'Park';
    this.age = 20;
  }
  get nextYear(){
    return this.age +1
  }
  set setAge(age){
    this.age = parseInt(age)
  }
  
  const person = new Person("Park",30)
  
  person.nextYear //31
  person.setAge='40' //40