[Javascript] Class와 Instance, 그리고 get & set

클래스란, 어떤 객체를 빠르게 생성해내기 위한 틀과 같은 것이다.

 

특정한 모양의 빵을 만들거나, 어떤 모양의 그릇을 대량으로 만든다고 하면

일반적으로 하나 만들 때 마다 하나 씩 손으로 만들어 내는 것 보다 틀을 만들어서 재료를 넣는 것이 더 빠르게  만들 수 있다.

 

위의 예시에서 클래스(Class)는 어떤 모양의 틀을 의미하고, 인스턴스(Instance)는 틀에 적용되어 생성된 객체를 의미한다.

 

자바스크립트에서 클래스를 만들기 위해서는 Class + 클래스 이름으로, 아래와 같이 선언해주면 된다.

Class Person {
	// 여기에 내용이 들어갑니다.
}

클래스를 만들기 위해서 반드시 포함되어야 하는 요소가 있는데, 그것은 바로 생성자 함수다.

생성자 함수는 객체 생성의 필수 구성 요소를 규정하는 역할을 하며

지정은 constructor 안으로 넣어주면 된다.

class Person {
	constructor(name, age){ // Person을 만들 때, name과 age를 필수로 하겠다.
		this._name = name;
		this._age = age;
        }
}

let new_person = new Person("people_1", 20) // 객체 생성

위 예시 코드에서 this.name 이나 this.age 가 의미하는 것은

name 을 people_1로, age를 20으로 하는 객체를 new_person 이라는 변수로 만든다는 의미이다.

 

객체에는 생성을 위한 생성자 함수 외에도 method 기능을 넣을 수 있으며 일반적인 함수 생성과 크게 다르지 않다.

class Person {
	constructor(name, age){ // Person을 만들 때, name과 age를 필수로 하겠다.
		this._name = name;
		this._age = age;
        }
    
    greeting(){
    	console.log(`Hi, my name is ${this._name}`);
    }
    
}

let new_person = new Person("people_1", 20) // 객체 생성
new_person.greeting(); // output : "Hi, my name is perople_1"

위 코드 예시에서 추측할 수 있는 것 처럼 생성된 객체의 속성을 불러오는 것도 가능하며 (getter, get + 함수명)

객체 생성 이후 속성을 변경하는 것(setter, set + 함수명) 또한 가능하다.

 

class Person {
	constructor(name, age){ // Person을 만들 때, name과 age를 필수로 하겠다.
		this._name = name;
		this._age = age;
        }
    
    greeting(){
    	console.log(`Hi, my name is ${this._name}`);
    }
    
    get get_name(){	// 이름을 반환하는 함수
    	return this._name;
    }
    
    get get_age(){	// 나이를 반환하는 함수
    	return this._age;
    }
    
    set change_name(value){	// 이름을 변경하는 함수
    	this._name = value;
    }
    
    set change_age(value) {	// 나이를 변경하는 함수
    	this._age = value
    }
    
}

let new_person = new Person("people_1", 20) // 객체 생성
new_person.greeting(); // output : "Hi, my name is perople_1"

console.log(new_person.get_name); // output : people_1
console.log(new_person.get_age); // output : 20

new_person.change_name = "people_2";	// 이름 변경
new_person.change_age = 21;	// 나이 변경

console.log(new_person.get_name); // output : people_2
console.log(new_person.get_age); // output : 21