소프트웨어 설계와 Vue.js의 프록시 패턴
소프트웨어 디자인 패턴의 프록시 패턴 Proxy pattern은 디자인 패턴 중 Structural 패턴 중 하나이다. 가장 기본적인 골자는 "대신 요청을 처리해주는" 패턴 이라는 것이다. 누구 대신 요청을 처리하냐면, 실제 객체 대신 요청을 처리한다. (요청의 주체는 누구든 될 수 있지만 일반적으로 프로그램 런타임에서 메모리에 생성되는 객체이다. 네트워크 관련 객체가 될 수도 있고, 상주하는 객체가 될 수도 있음.) a라는 기능을 본래는 A객체에서 처리하는 것이 맞지만 a라는 기능으로 인해 다른 객체에 의도하지 않은 접근을 허용할 수 있다. (A class 내에서 구현한 기능이든, 함수든) 따라서, 다른 객체에 대해 접근을 제어 하기 위해 본 객체와 다른 대리인 역할을 하는 객체 를 제공한다. 본 객체 = Real subject 대리인 = Proxy 는 공통 Interface를 구현함으로서 접근 제어를 구현한다. 본 객체는 비즈니스 로직을 수행한다. 대리인 객체는 요청이 본 객체에 도달하기 전에 구현된 작업을 수행해서 직접 도달하지 않게 접근을 제어하거나 기타 로직들을 수행한다. (접근 제어, 지연 로딩, 로깅, 캐싱, 원격 프록시 등) ( **원격 프록시 = 다른 네트워크의 머신에서 돌아가고있는 객체를 대표한다. ) 요청을 보내는 클라이언트 입장에서는 실제 객체 대신 대리인 객체와 소통하고 있는 것이다. Vue의 프록시 패턴 vue.js에서는 JS의 내장 Proxy객체를 활용하여 데이터를 관찰하고 데이터가 변하면 이를 변경사항에 적용한다. => 반응성, Reactive vue3에서는 객체를 반응성 상태로 만들 때 reactive() 함수를 사용하는데 이렇게 만들어진 프록시 객체는 실제 객체에 대한 모든 접근을 가로챈다. (속성 값 변경, 생성, 삭제 등) Vue에서는 JS의 Proxy 객체를 이용하여 본 객체에 요청이 도달하기 전에 요청을 가로채서 반응성을 위한 로직을 수행한다. (본 객체에 의존하는 다른 객체에 대한 의존성 추적...
