Computer >> 컴퓨터 >  >> 프로그래밍 >> JavaScript

JavaScript에서 initValidation() 함수 밖에서 validate() 함수를 호출하는 방법

자바스크립트로 개발하다 보면 initValidation() 함수 내부에 정의된 validate() 함수를, 굳이 initValidation()을 호출하지 않고도 외부에서 직접 실행해야 하는 경우가 있습니다.

그런데 일반적인 방식으로는 내부 함수에 접근할 수 없습니다. 다음은 문제가 되는 코드입니다.

문제의 코드

function initValidation(){
    // 관련 없는 코드
    function validate(_block){
       // 검증 로직
    }
}

위 코드에서 validateinitValidation 내부에 선언된 지역 함수이므로, 함수 외부에서는 접근 자체가 불가능합니다.

해결 방법: this를 활용한 함수 노출

자바스크립트에서 함수는 곧 객체라는 점을 활용하면 이 문제를 쉽게 해결할 수 있습니다. 내부 함수를 this에 할당하여 외부로 노출하도록 코드를 다음과 같이 수정합니다.

function initValidation(){
    // 관련 없는 코드
    function validate(_block){
       // 검증 로직
       console.log(_block);
    }
    this.validate = validate;
}

이렇게 수정하면 initValidation이 하나의 클래스(생성자 함수)처럼 동작하게 되며, validate는 그 클래스의 속성(property)이 됩니다. 이제 new 키워드로 인스턴스를 생성한 뒤 다음과 같이 접근할 수 있습니다.

const v = new initValidation();
v.validate('Hello world');

전체 코드 예제

function initValidation(){
    // 관련 없는 코드
    function validate(_block){
       // 검증 로직
       console.log(_block);
    }
    this.validate = validate;
}
const v = new initValidation();
v.validate('Hello world');

출력 결과

콘솔에는 다음과 같이 출력됩니다.

Hello world

추가 팁: 모듈 패턴 활용하기

new 연산자 없이 특정 함수만 선택적으로 노출하고 싶다면 클로저를 이용한 모듈 패턴도 좋은 대안입니다.

function initValidation(){
    function validate(_block){
       console.log(_block);
    }
    return { validate };
}
const { validate } = initValidation();
validate('Hello world');

이 방식은 필요한 함수만 공개 객체에 담아 반환하므로, 내부 구현은 숨기면서 외부 사용성만 제공할 수 있다는 장점이 있습니다. 상황에 맞게 두 가지 방법 중 적절한 것을 선택하시면 됩니다.