[javascript] 클래스 Class 선언 생성자 함수 getter setter constructor method

Javascript 자바스크립트 클래스

 

1. 클래스(class) 선언

2. 생성자(constructor)

3. 함수(method)

4. getter

5. setter

 

자바스크립트에서 객체를 사용하기 위한 방법으로

Class가 있는데 다른 언어를 사용하던 사람에게는

아주 익숙한 키워드일 것이다.

 

  클래스의 선언

class 원하는클래스명 {
	constructor(파라미터1, 파라미터2){
    	this.속성명1 = 파라미터1;
        this.속성명2 = 파라미터2;
    }
}

 

위 예제 코드에서 constructor는 생성자를 의미한다.

생성자는 객체를 생성할때 자동으로 호출되는데,

전달되는 값을 통하여

객체를 생성함과 동시에 속성값을 초기화할수 있다.

물론 생략 가능하고, 내부에 객체생성시 원하는 기능을 

입력하면 해당 기능이 실행된다.

 

  클래스 내부의 Getter / Setter

class 원하는클래스명 {
	constructor(파라미터1, 파라미터2){
    	this.속성명1 = 파라미터1;
        this.속성명2 = 파라미터2;
    }
    
    //사용자가 속성의 값을 꺼낼때 실행
    get 속성명1 {
    	return this.속성명1 * 2;
    }
    
    //사용자가 속성에 값을 저장할때 실행
    set 속성명1 (value){
    	if(value > 0)
    	    this._속성명1 = value;
    }
}

클래스를 사용할때 사용자에게 클래스 내부의 

속성을 간접접근 시키거나 조건에 맞는 

속성 값만 저장이 가능하도록 하게 하기위해

주로 사용하는 키워드인 get, set이다.

 

물론 직접 접근도 가능하지만,

사용자에게 어느정도의 제약을 두게되면 

편리한 앱의 구동이 가능하다는 장점이 있다.

 

  클래스 내부 함수 선언

class 원하는클래스명 {
	constructor(파라미터1, 파라미터2){
    	this.속성명1 = 파라미터1;
        this.속성명2 = 파라미터2;
    }
    
    //함수 선언 (function을 생략한다){
    print(){
    	console.log(this.속성명1, this.속성명2);
    }
}

클래스 내 함수의 선언또한 가능한데,

function 키워드는 생략해야 한다.

 

 

  샘플예제

class Person {
    //생성자 역할을 하는 constructor
	constructor(name, age,gender){
    	this.name = name;
        this.age = age;
        this.gender = gender;
    }
    
    //getter
    get age(){
    	return this._age;
    }
    
    //setter : class내 속성 값의 제한을 두어야 하는 경우 자주 사용
    set age(value){
    	if(value > 0 && value < 150){
    		this._age = value;
        }
    }
    
    //method 
	Print(){
    	console.log('이름 : ' + this.name + '  나이 : ' + this._age);
    }
}

let per1 = new Person('철수',20,'남');
let per2 = new Person('영희',30,'여');

per1.Print();
per2.Print();