JS, TS

RORO 패턴

gaoooon 2025. 4. 28. 12:25

서론

개발을 하다 보면 이미 만들어진 함수나 라이브러리를 사용할 때, 일부 함수들이 매개변수를 객체 형태로 전달받는 경우를 종종 볼 수 있다. 처음에는 한두 군데에서만 그런 방식을 사용하길래 크게 신경 쓰지 않았지만, 생각보다 많은 곳에서 객체를 통한 매개변수 전달을 사용하는 것을 보고 그 이유가 궁금해져 관련 내용을 찾아보게 되었고, 이에 대해 글을 작성하게 되었다.

RORO

구글링을 해보니 객체를 통해 매개변수를 전달하는 방식을 RORO 패턴이라고 부른다.

RORO는 Receive an object, Return an object의 약자로 객체를 통해 받고, 객체를 통해 반환한다라는 뜻이다.

명명된 인수

RORO 패턴은 명명된 인수 방식을 활용하는 패턴이다.

명명된 인수 방식이란 함수를 사용할 때 인수에 이름을 지정하여 넘기는 방식을 말한다.

 

def create_user(name: str, age: int, height: float):
    User(name, age, height)

create_user(
  name="방가온",
  age=19,
  height=180.0
)

 

위와 같이 파이썬에서는 자체적으로 명명된 인수 방식을 지원한다.

하지만 자바스크립트의 경우 자체적으로 지원되지 않아서 RORO 패턴을 사용한다.

그래서 어떤 점이 좋은가

1. 순서에 영향을 받지 않는다.

const a = (a: number, b?: number, c?: number) => {};

a(54, 39); // a와 c의 인수만 사용하고 싶을때 할수 없다

---

const a = ({ a, b, c }: { a: number; b?: number; c?: number }) => {};

a({ a: 1, c: 3 });

 

 

일반적인 방법으로 사용한다면 매개변수의 순서를 신경 써야 하는데 RORO 패턴을 사용한다면 순서를 신경 쓸 필요가 없다.

 

 

2. 명시적인 인수

 

일반적인 방법은 함수를 호출하는 부분에서 인수가 어떤 역할을 하는지 한눈에 알아차리기 어렵다. (RORO 패턴을 안 쓴다면 JSDoc을 사용할 수도 있을 것이다.)

하지만 RORO 패턴을 사용한다면 함수 호출 부분에서 인수가 어떤 역할을 하는지 원활하게 알 수 있다.

alertMyInfo({ name: 'John Doe', age: 30, email: 'abc@gmail.com' });

 

 

 

3. typescript와 같이 사용하여 안정성 강화

 

type alias나 interface를 사용하여 객체의 타입을 지정하여 사용한다면 type safety 하게 사용할 수 있다.

interface LogParams {
  eventName: string;
  data: (() => Promise<AnyObjectType>) | AnyObjectType;
  urls: string[];
}

사용 예시

 

이렇게 tanstack-query, react-hook-form 뿐만 아니라 다양한 곳에서 RORO 패턴을 적용하고 있다.

마무리

모든 상황에서 RORO 패턴을 사용하는것은 비효율적일 것 같고 인수가 어느 정도 많을 때 잘 사용을 한다면 좋은 해결책이 될 수 있을 것 같다는 생각이다.

728x90