TMI : javascript의 클래스 문법은 ES6에서 도입됐다.
자바스크립트 기반이 아닌 다른 언어에서는 대게 클래스 기반의 프로그래밍 개발 기법(생성자, 상속 등..)을 사용하는데, 그 개발자들이 자바스크립트로 넘어와서 자꾸 클래스 ‘처럼’ 개발하려 노력하다보니 JS 사이드에서도 그 니즈를 반영한것
공장에서 '상품'을 다량으로 생산해내기 위해 '설계도'를 만든다. 설계도를 토대로 각각 특징있는 '상품'을 찍어내는데
- 클래스(Class) : 책상을 만드는 '설계도' 와 비슷하다. 설계도를 통해 어떤 종류의 책상인지, 책상의 특징( 변수 또는 속성과 메서드)이 무엇인지 알 수 있다.
- 인스턴스(Instance) : 설계도를 보고 만들어진 '실제 책상'이라 생각할 수 있다. 설계도를 통해 책상의 모양, 크기, 색상, 재료 등이 결정된다.
-> 따라서, 클래스는 객체를 만들기 위한 설계도 역할이고, 설계도를 바탕으로 만들어진 실제 객체를 인스턴스라 부른다.
//클래스 설계도 작성
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
//메서드 형태의 동사 표현
sayHello() {
// console.log(this.name + "님 안녕하세요:)" + " 올해 " + this.age + "세 이시군요!^0^");
console.log(`${this.name}님 안녕하세요:) 올해 ${this.age}세 이시군요!^0^"`)
}
myAge() {
console.log(`내 나이는 올해 ${this.age}세 입니다:)`)
}
}
// 설계도를 통해 인스턴스를 만들어 보자
const person1 = new Person("홍길동","30");
const person2 = new Person("홍길순","25");
person1.sayHello();
person2.sayHello();
person1.myAge();
person2.myAge();
// forEach 를 이용해, 대량 생성도 가능할것이다.
Constructor는 Class의 생성자 함수다. 생성자 함수는 객체를 생성할 때 호출되며, 객체를 초기화하는 역할을 한다.
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
sayHello() {
console.log(`Hello, my name is ${this.name} and I'm ${this.age} years old.`);
}
}
const person = new Person('Alice', 20);
위 코드에서 constructor 메소드는 name과 age를 인자로 받아 this.name과 this.age 속성을 초기화한다.
Class에서는 getter와 setter를 사용하여 Class의 속성에 접근할 수 있다.
getter는 속성 값을 반환하는 메소드이며, setter는 속성 값을 설정하는 메소드이다.
이를 통해 생성한 인스턴스를 정해진 규격 안에서 자유자제로 변경할 수 있다.