공부/JAVASCRIPT

[javascript] 클래스(class)

알로하리미 2021. 3. 8. 12:21
728x90

class

연관있는 속성및 동작들을 미리 설계해둔 설계서(청사진)

구성 : 매서드(동작,행동,메시지) , 필드(속성)

* JS의 Class는 객체지향적 언어에서 지원하는 완전한 Class가 아니고 기존의 prototypes을 기반으로 만들어진 class이다.

 

object

클래스를 이용해서 실제로 Data를 만들어 메모리에 올라가는 것이 Object이다.

클래스의 instance를 오브젝트라고 불른다.

 

 

1. 클래스의 선언

//클래스 선언 예시
class ClassName {
    constructor( name, age ) 
    {
        this.name = name ;
        this.age = age ; //클래스속성들에 할당
    }
    
    function doSomthing()
    {
    	return ;
    }
}

//인스턴스 생성
const a = new ClassName("알로하리미" , "30" ) ;

 

 

2. getter, setter : 조금더 방어적이게 만들어 주는것이 getter, setter라고 생각하면됨 (캡슐화)

class User {
    constructer(firstName, lastName, age){
        this.firstName = firstName;
        this.lastName = lastName ;
        this.age = age; //age setter를 호출
    }
    
    get age() //인스턴스의 내부 속성age의 값을 가져갈때 호출하는 getter
    {
        //age라는 getter를 정의하는 순간 this.age는 getter를 호출한다.        
        //return this.age; //this.age를 호출하면 getter가 무한 호출 되므로 this._age라고 한다.
    	return this._age; 
    }
    
    set age(value)//인스턴스 내부 속석age의 값을 설정할때 호출하는 setter
    {
        //age라는 setter를 정의하는 순간 this.age = 할당값 ; 은 setter를 호출한다.
        //this.age = value; //호출하면 setter를 무한 호출 하기에 this._age라고 한다.
        this._age = value < 0 ; 0 : value;
    }
}

const user1 = new User("하리미","알로", -1 ) ;
console.log(user1.age) ; //age getter 호출 
//결과값
//0

 

3. public, private, static class fields 최근 추가됨( 최신브라우저도 사용이 안됨 )

public 필드 : 기본값은 public 필드 이다. 외부에서 인스턴스로 접근이 가능하다.

private 필드 : class 선언문 내부에서만 사용가능

static  : 클래스 자체에 고정된 필드라고 생각하면됨.

static 필드, static 메서드
클래스.클래스필드 접근 됨
인스턴스.클래스필드 접근 안됨
static 메소드에서만 static 변수들을 호출 가능. 그외 불가능.
오브젝트에 상관없이 들어오는 데이터에 상관없이 공통적으로 클래스에 쓸 수 있는것을 선언할 때 사용.
class ClassWithPrivateStaticField {
  static #PRIVATE_STATIC_FIELD

  static publicStaticMethod() {
    ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD = 42
    return ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD
  }
}

console.assert(ClassWithPrivateStaticField.publicStaticMethod() === 42)

 

4. 상속과 다향성

* 오버라이딩: 부모가 정의한 함수를 자식이 재정의 한 것.

* 오버로딩 : 함수이름은 같지만 파라미터 수, 또는 타입이 다른 메소드를 중복선언한 것.

//날짜관련 Date클래스를 상속하여 
//자식클래스에서 Date(부모)의 기능을 사용할수 있게한다.
class DateFormatter extends Date {

  getFormattedDate() {
    const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
      'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
    return `${this.getDate()}-${months[this.getMonth()]}-${this.getFullYear()}`;
  }

}

console.log(new DateFormatter('August 19, 1975 23:15:30').getFormattedDate());
// expected output: "19-Aug-1975"

// 클래스 체킹
let a = new DateFormatter('August 19, 1975 23:15:30') ; 
let classFlag = DateFormatter instanceof Date ;
console.log(classFlag) ;