본문 바로가기
Frontend/JavaScript

클래스 ① 클래스 기본

by minhi 2024. 10. 28.
클래스

 

객체 ① 객체 기본에서 객체란 키와 값으로 구성된 속성을 가지는 자료형이라고 하였다.

 

이러한 객체를 정의하고 활용하여 프로그램을 만드는 것을 객체 지향 프로그래밍이라고 하며

 

이때 클래스를 사용하면 객체를 보다 효율적으로 생성할 수 있다.

 

클래스란 객체를 정의한 설계도로, 다음과 같은 형태로 생성한다.

class 클래스 이름 {

}

 

이러한 클래스를 기반으로 생성한 객체는 인스턴스라고 하며 다음과 같은 형태로 생성한다.

new 클래스 이름()

 

즉 클래스는 객체를 만드는 틀, 인스턴스는 각각의 구체적인 객체 정도로 이해할 수 있고

 

일반적으로 클래스의 첫 글자는 대문자를 가진다.

 

생성자

 

앞서 인스턴스를 new 클래스 이름() 으로 생성한다고 하였는데, 이때 이 클래스 이름() 함수를 생성자라고 한다.

 

생성자는 속성 추가 등 객체 초기화 역할을 수행하며 constructor 메소드를 통해 지정할 수 있다.

class 클래스 이름 {
  constructor () {
    // 생성자
  }
}

 

일반적으로 constructor 메소드 내부에는 객체의 속성 값을 초기화하는 코드를 작성한다.

 

메소드

 

클래스에는 객체에서 사용할 메소드를 정의할 수도 있다.

 

<script>
  class Student {
    constructor (이름, 국어, 영어, 수학, 과학) {
      this.이름 = 이름
      this.국어 = 국어
      this.영어 = 영어
      this.수학 = 수학
      this.과학 = 과학
    }

    getSum () {
      return this.국어 + this.영어 + this.수학 + this.과학
    }

    getAverage () {
      return this.getSum() / 4
    }

    toString () {
      return `${this.이름}\t${this.getSum()}점\t${this.getAverage()}점\n`
    }
  }

  const students = []

  students.push(new Student('구름', 87, 98, 88, 90))
  students.push(new Student('별이', 92, 98, 96, 88))
  students.push(new Student('겨울', 76, 96, 94, 86))
  students.push(new Student('바다', 98, 52, 98, 92))

  let output = '이름\t총점\t평균\n'

  for (const s of students) {
    output += s.toString()
  }

  console.log(output)
</script>

 

 

 

 

 


이 글은 혼자 공부하는 자바스크립트 (윤인성 저)를 바탕으로 공부한 내용을 작성한 글입니다.