> 웹 프론트엔드 > JS 튜토리얼 > JavaScript에서 전역 변수 충돌을 어떻게 방지할 수 있나요?

JavaScript에서 전역 변수 충돌을 어떻게 방지할 수 있나요?

Patricia Arquette
풀어 주다: 2024-11-28 13:26:14
원래의
893명이 탐색했습니다.

How Can I Avoid Global Variable Conflicts in JavaScript?

Javascript의 전역 변수에 대한 대안

Javascript의 공유 전역 네임스페이스와 암시된 전역 변수는 여러 스크립트가 동일한 페이지에서 작동할 때 충돌을 일으킬 수 있습니다. . 이러한 문제를 방지하려면 대체 솔루션을 사용하는 것이 좋습니다.

로컬 모듈

외부적으로 노출하려는 함수가 포함된 개체를 반환하는 함수 내에 코드를 묶습니다. 반환 값을 단일 전역 변수에 할당합니다.

var FOO = (function() {
    var my_var = 10; // Shared variable

    function bar() { // Not exposed externally
        alert(my_var);
    }

    return {
        a_func: function() {
            alert(my_var);
        },
        b_func: function() {
            alert(my_var);
        }
    };

})();
로그인 후 복사

모듈의 기능에 액세스하려면 FOO.a_func()를 사용합니다. 이 접근 방식을 사용하면 FOO의 이름만 변경하여 코드를 격리하고 충돌을 방지할 수 있습니다.

싱글턴 패턴

이 특정 시나리오에서는 하나의 함수가 변수를 설정합니다. 나중에 다른 사람이 이를 검색하는 경우 싱글톤 패턴을 고려하세요. 여기에는 글로벌 데이터에 대한 제어된 액세스를 제공하는 클래스의 단일 인스턴스를 생성하는 작업이 포함됩니다.

var Singleton = {
    variable1: null,

    setVariable: function(value) {
        this.variable1 = value;
    },

    getVariable: function() {
        return this.variable1;
    }
};

Singleton.setVariable("value1");
var retrievedVariable = Singleton.getVariable(); // "value1"
로그인 후 복사

이 패턴은 싱글톤의 인스턴스가 하나만 존재하도록 보장하고 글로벌 데이터에 액세스하기 위한 제어된 인터페이스를 제공합니다.

위 내용은 JavaScript에서 전역 변수 충돌을 어떻게 방지할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿