js class 개념 정리

최석훈·2021년 4월 13일
0
post-custom-banner

class의 역할

class는 연관된 변수나 함수들을 정리해주는 역할을 해준다.
그리고 class는 탬플릿같은 역할을 해서 쉽게 object를 만들 수 있게 해준다.

class 용어

class Person {
    name;
    age;
    // name과 age같은 변수를 field 라고 한다.
    sayHello();
    // 함수는 method 라고 한다.
}

constructor 메서드

class Person {
    constructor(name, age){
    this.name = name;
    this.age = age;
    }
}

const roy = new Person("roy", 20);

console.log(roy.name)
// roy
console.log(roy.age)
// 20

constructor 메서드는 class 내에서 객체를 생성하고 초기화하기 위한 특별한 메서드이다.

getter 와 setter

class Person {
    constructor(name, age){
    this.name = name;
    this.age = age;
 	// this.age가 호출될 때, get age()가 불러와지고
    // = age;가 호출될 때, set _age()가 불러와진다.
    }
    
    
    sayHello();
    
	
    get age(){
    	return this._age;
    }
    //get은 값을 return해주는 것
    set age(value){
    	this._age = value < 0 ? 0 : value;
    }
    //set을 통해 값을 설정해준다.
 
}

getter와 setter는 헷가리기 쉬운 개념이다.
이것을 왜 쓰냐면, 사용자가 이상한 값을 넣은 때를 방지하기 위함이다.
만약에 사용자가 age에 -29을 넣었다고 하자. 근데 나이가 - 가 될 수 없으니 이 값을 사용하기에는 문제가 있다. 따라서 이렇게 잘못된 값이 입력되었을 때를 방지해서 get, set을 사용하는 것이다.

근데 get, set에 age의 변수명이 이상하다. 앞에 _ (언더바)가 붙어있다. 그 이유는 set age() 함수는 this.age에 값을 할당할 때 불어와진다. 근데 언더바가 붙지 않으면 무한으로 set함수가 불러와지게 되어서 무한루프에 빠지게 되는 것이다. 따라서 get,set의 함수 안에서는 변수 이름은 살짝 다르게 해줘야 한다.

profile
하루를 열심히
post-custom-banner

0개의 댓글