JavaScript의 기본 객체/함수 체이닝 이해

함수 체이닝은 개발자가 특정 순서로 실행되는 일련의 작업을 생성할 수 있게 해주는 프로그래밍 기술입니다. JavaScript에서는 함수 자체를 반환하고 this 키워드를 사용하여 이를 수행합니다.

연결 원리를 이해하기 위해 실제 예제를 살펴보겠습니다.

var one = function(num) {
    this.oldnum = num;

    this.add = function() {
        this.oldnum  ;
        return this;
    }

    if (this instanceof one) {
        return this.one;
    } else {
        return new one(num);
    }
}
var test = one(1).add().add();

이 예에서는 one 함수가 숫자로 구성됩니다. oldnum 속성을 증가시키고 이를 반환하는 add 함수를 정의합니다. if 문은 함수가 생성자(new 사용)로 호출되었는지 확인하고 그렇지 않은 경우 함수의 새 인스턴스를 반환합니다.

one(1).add().add() 표현식은 다음을 생성하여 시작됩니다. 초기값이 1인 새로운 객체. 그런 다음 이 객체에 대해 add 함수가 두 번 호출되어 매번 oldnum 속성이 증가합니다. 마지막으로 test 변수는 oldnum이 3으로 설정된 하나의 객체인 결과를 보유합니다.

반대로 다음 예제는 올바르게 연결되지 않습니다:

var gmap = function() {

    this.add = function() {
        alert('add');

        return this;
    }

    if (this instanceof gmap) {
        return this.gmap;
    } else {
        return new gmap();
    }

}
var test = gmap.add();

여기서 gmap 함수는 메서드 내에서 이를 반환하지 않으므로 연결이 끊어집니다. gmap.add() 표현식은 gmap 생성자 함수 자체에서 add 메소드를 호출하려고 시도하지만 의도한 대로 작동하지 않습니다.

성공적인 연결의 핵심은 this 키워드를 사용하는 것입니다. 현재 객체. 메서드에서 이를 반환함으로써 호출자는 객체에 다시 액세스하고 일련의 작업을 계속할 수 있습니다.

체이닝은 JavaScript에서 간결하고 표현력이 풍부한 코드를 작성하는 강력한 기술이 될 수 있습니다. 위에 설명된 원칙을 이해함으로써 개발자는 체인을 효과적으로 활용하여 애플리케이션 기능을 향상시킬 수 있습니다.