자바스크립트 변수의 인터페이스 구현 방법

09 Sep 2023

javascript

자바스크립트는 유연한 프로그래밍 언어로서 변수를 사용하여 데이터를 저장하고 조작하는 데 사용됩니다. 그러나 때로는 변수에 더 엄격한 제한을 두고 싶을 수도 있습니다. 이때 인터페이스를 사용하여 변수의 구조와 동작을 정의할 수 있습니다. 이번 블로그에서는 자바스크립트에서 변수의 인터페이스를 구현하는 방법을 알아보겠습니다.

인터페이스란 무엇인가요?

인터페이스는 객체가 가져야 하는 속성과 메서드의 목록을 정의한 것입니다. 다른 객체가 해당 인터페이스를 구현하는 경우, 이 객체는 인터페이스에 정의된 모든 속성과 메서드를 구현해야 합니다. 즉, 인터페이스는 객체의 동작을 규정하는 일종의 계약으로 볼 수 있습니다.

자바스크립트에서 인터페이스를 구현하는 방법

자바스크립트는 명시적으로 인터페이스를 정의하는 문법을 제공하지 않습니다. 그러나 다음과 같은 방법을 사용하여 인터페이스를 구현할 수 있습니다.

1. 주석을 사용하여 인터페이스 정의하기

/**
 * 인터페이스 MyInterface
 */
// @interface
const MyInterface = {};
/**
 * 속성 a
 * @type {number}
 */
MyInterface.a = 0;
/**
 * 메서드 b
 * @param {string} str 입력 문자열
 * @returns {string} 수정된 문자열
 */
MyInterface.b = function (str) {
  return str.toUpperCase();
};

위의 예제에서 MyInterface는 주석을 사용하여 인터페이스를 정의합니다. MyInterface 객체의 속성과 메서드는 주석을 통해 정의되며, 타입 정보와 설명이 포함될 수 있습니다. 하지만 이 방법은 자바스크립트 엔진에 의해 자동으로 체크되거나 강제되지는 않습니다.

2. 클래스를 사용하여 인터페이스 구현하기

/**
 * 인터페이스 MyInterface
 */
class MyInterface {
  /**
   * 속성 a
   * @type {number}
   */
  a = 0;
  /**
   * 메서드 b
   * @param {string} str 입력 문자열
   * @returns {string} 수정된 문자열
   */
  b(str) {
    return str.toUpperCase();
  }
}

위의 예제에서는 MyInterface 클래스를 사용하여 인터페이스를 정의합니다. 클래스 내에 속성과 메서드를 정의하며, 타입 정보와 설명을 주석으로 추가할 수 있습니다. 이 방법은 타입스크립트 같은 정적 타입 검사 도구를 사용할 경우 유용하게 사용될 수 있습니다.

3. 덕 타이핑(Duck Typing) 활용하기

덕 타이핑은 “오리처럼 걷고, 오리처럼 소리를 낸다면 그것은 오리다”라는 개념입니다. 즉, 특정한 인터페이스를 따르지 않더라도, 객체가 해당 인터페이스에 정의된 속성과 메서드를 가지고 있다면 해당 객체는 인터페이스를 구현한 것으로 간주됩니다.

class MyClass {
  a = 0;
  b(str) {
    return str.toUpperCase();
  }
}

const myObject = new MyClass();

// MyInterface를 구현한 것으로 간주
function useMyInterface(obj) {
  console.log(obj.a);
  console.log(obj.b('hello'));
}

useMyInterface(myObject); // 출력: 0, "HELLO"

위의 예제에서 MyClass는 MyInterface를 명시적으로 구현하지 않았지만, 동일한 속성(a)과 메서드(b)를 가지고 있습니다. 따라서 MyClass 객체인 myObject는 MyInterface를 구현한 것으로 간주할 수 있고, useMyInterface 함수에 전달하여 사용할 수 있습니다.

결론

자바스크립트는 유연한 언어이지만, 때로는 변수에 엄격한 제한을 두고 싶을 수 있습니다. 이때 인터페이스를 사용하여 변수의 구조와 동작을 정의할 수 있습니다. 위에서 소개한 방법을 사용하여 자바스크립트에서 변수의 인터페이스를 구현할 수 있습니다. 주석을 사용하는 방법으로 간단히 정의할 수도 있고, 클래스를 사용하거나 덕 타이핑을 활용할 수도 있습니다.