클래스(Class)

자바스크립트의 클래스(Class)는 ES6(ECMAScript 2015)에서 도입된, 객체 지향 프로그래밍을 보다 쉽게 구현할 수 있게 해주는 구문입니다. 클래스는 사실상 프로토타입 기반 상속을 사용하는 기존 자바스크립트의 상속 메커니즘을 더 명확하고 간결하게 작성할 수 있게 해주는 "문법적 설탕(syntactic sugar)"입니다. 이는 개발자가 클래스 기반 언어에서 익숙한 방식으로 자바스크립트에서도 클래스를 정의하고 상속받을 수 있게 합니다.

클래스의 기본 구조

자바스크립트에서 클래스는 class 키워드를 사용하여 정의됩니다. 클래스 내부에는 생성자(constructor)와 메소드를 정의할 수 있습니다. 생성자는 새로운 인스턴스가 생성될 때 호출되며, 인스턴스 초기화에 사용됩니다. 메소드는 클래스의 행동을 정의하고, 인스턴스 또는 클래스 자체(static 메소드)에 속한 함수입니다.

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

  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

// 인스턴스 생성
const person1 = new Person('John', 30);
person1.greet(); // "Hello, my name is John and I am 30 years old." 출력

클래스 상속

자바스크립트에서는 extends 키워드를 사용하여 클래스 상속을 구현할 수 있습니다. 상속을 통해 한 클래스(자식 클래스)가 다른 클래스(부모 클래스)의 속성과 메소드를 상속받을 수 있습니다. 이를 통해 코드의 재사용성과 유지보수성이 향상됩니다.

class Employee extends Person {
  constructor(name, age, jobTitle) {
    super(name, age); // 부모 클래스의 constructor 호출
    this.jobTitle = jobTitle;
  }

  introduce() {
    console.log(`Hello, my name is ${this.name}, I am ${this.age} years old, and I work as a ${this.jobTitle}.`);
  }
}

// 인스턴스 생성
const employee1 = new Employee('Jane', 28, 'Software Developer');
employee1.introduce(); // "Hello, my name is Jane, I am 28 years old, and I work as a Software Developer." 출력
employee1.greet(); // 부모 클래스의 메소드 호출 가능

주의사항

• 클래스 정의는 호이스팅(hoisting)이 일어나지 않습니다. 즉, 클래스를 사용하기 전에 선언해야 합니다.
• 클래스 내부의 코드는 엄격 모드(strict mode)에서 실행됩니다.
• 클래스 메소드는 열거할 수 없습니다. (즉, for...in 루프나 Object.keys 메소드로 나열할 수 없습니다.)
• 클래스는 프로토타입 기반 상속의 문법적 설탕이므로, 자바스크립트의 기본 프로토타입 상속 메커니즘을 이해하는 것이 중요합니다.

자바스크립트 클래스는 객체 지향 프로그래밍 패러다임을 사용하여 더 구조화되고 명시적인 방식으로 코드를 조직화할 수 있는 강력한 방법을 제공합니다.