[javascript] 애로우 함수와 클래스

자바스크립트는 ES6부터 애로우 함수와 클래스를 도입하여 코드를 더 간결하고 구조화된 형태로 작성할 수 있게 되었습니다. 이번 글에서는 애로우 함수와 클래스에 대해 살펴보도록 하겠습니다.

애로우 함수 (Arrow Functions)

애로우 함수는 function 키워드 대신 =>를 사용하여 함수를 간결하게 표현할 수 있는 방법입니다. 아래는 기존의 함수 선언 방식과 애로우 함수를 비교한 예제입니다.

// 기존 함수 선언
function add(a, b) {
  return a + b;
}

// 애로우 함수
const add = (a, b) => a + b;

애로우 함수는 간결한 문법뿐만 아니라, this 키워드의 동작 방식이 일반 함수와 다르기 때문에 주의가 필요합니다.

클래스 (Classes)

ES6에서 클래스 문법이 도입되었으며, 프로토타입 기반의 상속보다 더 간결하고 명확한 방법으로 객체 지향 프로그래밍을 지원합니다. 아래는 클래스를 사용한 간단한 예제입니다.

class Rectangle {
  constructor(width, height) {
    this.width = width;
    this.height = height;
  }

  getArea() {
    return this.width * this.height;
  }
}

const rect = new Rectangle(10, 20);
console.log(rect.getArea()); // 200

클래스를 사용하면 생성자, 메서드, 상속 등을 더 간결하게 표현할 수 있으며, 가독성이 좋아져 유지보수가 용이해집니다.

결론

애로우 함수와 클래스는 ES6에서 도입된 기능으로, 코드를 간결하고 더 읽기 쉽게 만들어줍니다. 이러한 문법을 잘 활용하여 더 효율적인 코드를 작성할 수 있습니다.

참조: MDN web docs