[JavaScript] 자바스크립트에서 클래스 정의하기

2022. 8. 5. 16:08Program/JavaScript

253_자바스크립트에서 클래스 정의하기

[적용]

  • 특정 기능을 클래스로 만들고 싶을 때
  • 자바스크립트에서 객체지향 프로그래밍을 구현하고 싶을 때

[문법]

구문 의미
class 클래스명 {} 클래스를 선언 

[내용]

키워드 class를 사용해 클래스를 선언하며, 

클래스명은 카멜 케이스(CamelCase(첫 글자를 대문자로 하여 단어를 연결하는 방법))을 이용하는 것이 일반적이다.

JavaScript        

class MyClass {}

 

클래스에 constructor()를 삽입하면 초기화 시 해당 메소드가 실행되며,

constructor()문의 삽입은 한 번만 가능하다.

JavaScript                                                                                        

class MyClass {
  constructor() {
    console.log('클래스가 초기화 되었습니다.');
  }
}

 

클래스 초기화 시 초깃값을 constructor()의 인수로 전달하여 외부 값을 사용할 수 있다.

JavaScript          

class MyClass {
  constructor(value1, value2) {
    console.log(`${value1}`);
    console.log(`${value2}`);
  }
}

// 초기값 '여우'와 '24'가 콘솔 로그에 출력됨
new MyClass('여우', 24);

실행결과

 

클래스는 고유의 변수와 함수를 가질 수 있으며, 이 요소를 멤버라고 한다.

멤버에 관해서는 아래의 링크를 통해서 참고하자.

https://stonefree.tistory.com/443

 

[JavaScript] 자바스크립트 클래스에서 변수 사용하기

255_자바스크립트 클래스에서 변수 사용하기 [적용] 클래스에 변수를 사용하고 싶을 때 API 통신 결과 클래스를 생성하고 싶을 때 [문법] 구문 의미 this.변수명 = 값 멤버 변수 정의 [내용] 클래스에

stonefree.tistory.com

https://stonefree.tistory.com/444

 

[JavaScript] 자바스크립트 클래스에서 메소드(Method) 사용하기

256_자바스크립트 클래스에서 메소드(Method) 사용하기 [적용] 클래스에 메소드를 정의하고 싶을 때 [문법] 구문 의미 메소드명() {처리내용} 멤버 함수 정의 [내용] 클래스 내부의 함수를 클래스 메

stonefree.tistory.com

JavaScript    

class MyClass {
  constructor() {
    // 멤버 변수
    this.myField = '사자';
  }
  
  // 멤버 함수
  myMethod() {
    console.log(this.myField);
  }
}

 

 


 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김