[1] 클래스 기본 코드 형식
class 클래스명{
}
[2] 클래스를 통해 객체 생성하기
var|let|const 변수이름 = new 클래스이름();
- 일반적으로 JS에서 객체를 생성할 때 const 키워드를 사용한다.
- 객체의 내부 요소는 점(.)을 통해 접근할 수 있다.
[3] 클래스의 패턴 3가지
- 변수만 정의한 클래스
- 메서드만 정의한 클래스
- 변수와 메서드를 함께 정의한 클래스
1) 변수만 정의한 클래스
- 생성자 함수를 정의하고 생성자 함수 안에서 this 키워드를 통해 객체 안에 선언할 변수들을 생성한다.
- 생성자 함수명은 constructor로 미리 정의되어 있다.
class ProductClass{
constructor(){
this.prodName = "상품이름";
this.prodNo = "상품번호";
}
}
var p1 = new ProductClass();
console.log(p1);
console.log(p1.prodName);
console.log(p1.prodNo);
var p2 = new ProductClass();
console.log(p2);
console.log(p2.prodName);
console.log(p2.prodNo);
p1.prodName = "상품1";
p1.prodNo = "123";
p2.prodName = "상품2";
p2.prodNo = "124";
console.log(p1);
console.log(p2);
ProductClass { prodName: '상품이름', prodNo: '상품번호' }
상품이름
상품번호
ProductClass { prodName: '상품이름', prodNo: '상품번호' }
상품이름
상품번호
ProductClass { prodName: '상품1', prodNo: '123' }
ProductClass { prodName: '상품2', prodNo: '124' }
2) 메서드만 정의한 클래스
class Calc {
plus(x,y){
return x+y;
}
minus(x,y){
return x-y;
}
}
var c1 = new Calc();
console.log(c1.plus(1,2));
console.log(c1.minus(10,5));
3
5
3) 변수와 메서드를 함께 정의한 클래스
class HelloWorld{
constructor(){
this.message = null;
}
sayHello() {console.log(this.message);}
setEng() { this.message = "Hello";}
setKor() {this.message = "안녕하세요.";}
}
const hello = new HelloWorld();
hello.setEng();
hello.sayHello();
hello.setKor();
hello.sayHello();
Hello
안녕하세요.
[4] 클래스에 getter,setter 적용하기
module.exports = class prcInfo {
constructor(){
this._size = null;
this._lowestAsk = null;
this._highestBid = null;
this._lastSale = null;
}
set size(value){
if(!value){
console.log("size 입력하세요.");
return;
}
this._size = value;
}
set lowestAsk(value){
if(!value){
console.log("lowestAsk 입력하세요.");
return ;
}
this._lowestAsk = value;
}
set highestBid(value){
if(!value){
console.log("highestBid 입력하세요.");
return;
}
this._highestBid = value;
}
set lastSale(value){
if(!value){
console.log("lastSale 입력하세요.");
return ;
}
this._lastSale = value;
}
get size(){
return this._size;
}
get lowestAsk(){
return this._lowestAsk;
}
get highestBid(){
return this._highestBid;
}
get lastSale(){
return this._lastSale;
}
}
const prcInfo1 = new prcInfo();
prcInfo1.size = "5.5";
prcInfo1.lowestAsk = 909000;
prcInfo1.highestBid = 354000;
prcInfo1.lastSale = 537000;
console.log(prcInfo1);
prcInfo {
_size: '5.5',
_lowestAsk: 909000,
_highestBid: 354000,
_lastSale: 537000
}
참고링크