자바스크립트 시리즈 심층이해(25): 디자인 패턴 중 싱글톤 패턴에 대한 자세한 설명_기본지식

소개

이 장부터 JavaScript에서 사용되는 다양한 디자인 패턴의 구현을 점차적으로 소개합니다. 여기서는 패턴 자체에 대한 이론을 너무 많이 소개하지 않고 구현에만 중점을 둘 것입니다. 네, 공식적으로 시작되었습니다.

전통적인 개발 엔지니어의 관점에서 싱글톤은 클래스에 인스턴스가 하나만 있는지 확인하는 것입니다. 일반적으로 인스턴스가 존재하는지 여부를 먼저 확인하고 존재하지 않으면 직접 반환합니다. , 생성하고 반환합니다. 이렇게 하면 A 클래스에 인스턴스 객체가 하나만 있습니다. JavaScript에서 싱글톤은 네임스페이스 공급자 역할을 하며 전역 네임스페이스에서 개체에 대한 고유한 액세스 지점을 제공합니다.

텍스트

JavaScript에서 싱글톤을 구현하는 방법은 다양합니다. 가장 간단한 방법 중 하나는 많은 수의 속성과 메소드를 포함할 수 있는 객체 리터럴을 사용하는 것입니다.

코드 복사 코드는 다음과 같습니다.

var mySingleton = {
속성1: "뭔가",
속성2: "다른 것",
방법1: 함수() {
console.log('hello world');
}
};

나중에 이 개체를 확장하는 경우 고유한 전용 멤버와 메서드를 추가한 다음 클로저를 사용하여 이러한 변수 및 함수 선언을 내부에 캡슐화할 수 있습니다. 공개하고 싶은 공개 멤버와 메소드만 공개합니다. 샘플 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

var mySingleton = 함수 () {

/* 여기에 개인 변수와 메소드를 선언하세요 */
var privateVariable = '비공개 항목';
함수 showPrivate() {
console.log(privateVariable);
}

/* 공용 변수 및 메소드(비공개 변수 및 메소드에 접근 가능) */
복귀 {
         publicMethod: 함수 () {
              showPrivate();
},
publicVar: '대중이 볼 수 있습니다!'
};
};

var 싱글 = mySingleton();
Single.publicMethod(); // '비공개' 출력
console.log(single.publicVar); // '공개적으로 볼 수 있습니다!' 출력

위 코드는 아주 좋은데, 사용할 때만 초기화하고 싶다면 어떻게 해야 할까요? 리소스를 절약하기 위해 다음과 같이 다른 생성자에서 이러한 코드를 초기화할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

var 싱글톤 = (함수 () {
var가 인스턴스화되었습니다.
함수 초기화() {
/*여기서 싱글톤 코드를 정의하세요*/
         반품 {
              publicMethod: 함수 () {
console.log('hello world');
            },
             publicProperty: '테스트'
        };
}

반환 {
         getInstance: 함수 () {
                if (!instantiated) {
                        인스턴스화됨 = init();
            }
             인스턴스화된 반환
}
};
})();

/*인스턴스를 얻기 위해 공개 메소드를 호출합니다:*/
Singleton.getInstance().publicMethod();

이제 싱글톤을 구현하는 방법을 알았습니다. 하지만 싱글톤이 가장 잘 사용되는 시나리오는 무엇인가요? 실제로 싱글톤은 일반적으로 시스템 간의 다양한 통신 모드를 조정하는 데 사용됩니다. 다음 코드는 싱글톤에 대한 모범 사례입니다.

코드 복사 코드는 다음과 같습니다.

var SingletonTester = (함수 () {
//매개변수: 싱글톤에 전달되는 매개변수 집합

함수 싱글톤(args) {

//args 변수를 수신된 매개변수로 설정하거나 비어 있음(제공되지 않은 경우)

var args = args {};
//이름 매개변수 설정
This.name = 'SingletonTester';
//pointX 값 설정
This.pointX = args.pointX || 6; //받은 매개변수에서 가져오거나 기본값으로 설정
//pointY 값 설정
This.pointY = args.pointY ||
}

//인스턴스 컨테이너

var 인스턴스;

var _static = {

이름: 'SingletonTester',

//인스턴스를 가져오는 방법

//싱글톤 인스턴스 반환

         getInstance: 함수(인수) {
If (인스턴스 === 정의되지 않음) {
                    인스턴스 = new Singleton(args);
            }
             반품 인스턴스;
}
};
_static 반환;
})();

var SingletonTest = SingletonTester.getInstance({ pointX: 5 });

console.log(singletonTest.pointX); // 출력 5

기타 구현 방법

방법 1:

코드 복사 코드는 다음과 같습니다.

함수 Universe() {

// 인스턴스가 존재하는지 확인 If (Universe.instance 유형 === '객체') {

         Universe.instance를 반환합니다.
}

// 기타 콘텐츠

This.start_time = 0;

This.bang = "크다";

// 캐시

Universe.instance = 이것;

// 암시적으로 이것을 반환합니다

}

//테스트

var uni = 새로운 Universe();

var uni2 = new Universe();
console.log(uni === uni2); // 참

방법 2:

코드 복사 코드는 다음과 같습니다.

함수 Universe() {

// 캐시된 인스턴스 var 인스턴스 = this;

// 기타 콘텐츠

This.start_time = 0;

This.bang = "크다";

// 생성자 재정의

우주 = 함수() {

         반품 인스턴스;
};
}

//테스트

var uni = 새로운 Universe();

var uni2 = new Universe();
uni.bang = "123";
console.log(uni === uni2); // 참
console.log(uni2.bang); // 123

방법 3:

코드 복사 코드는 다음과 같습니다.

함수 Universe() {

// 캐시 인스턴스
var 인스턴스;

// 재구성 함수
Universe = 함수 Universe() {
         반품 인스턴스;
};

// 후처리 프로토타입 속성
Universe.prototype = 이것;

// 예시
인스턴스 = new Universe();

// 생성자 포인터 재설정
Instance.constructor = 우주;

// 기타 기능
Instance.start_time = 0;
Instance.bang = "큰";

인스턴스 반환;
}

// 테스트
var uni = 새로운 Universe();
var uni2 = new Universe();
console.log(uni === uni2); // 참

//프로토타입 속성 추가
Universe.prototype.nothing = true;

var uni = new Universe();

Universe.prototype.everything = true;

var uni2 = new Universe();

console.log(uni.nothing) // 참
console.log(uni2.nothing); // 참
console.log(uni.everything); // 참
console.log(uni2.everything); // 참
console.log(uni.constructor === Universe) // true

방법 4:

코드 복사 코드는 다음과 같습니다.

var 유니버스;

(함수 () {

var 인스턴스;

Universe = 함수 Universe() {

if (인스턴스) {
             반품 인스턴스;
}

인스턴스 = this;

// 기타 콘텐츠
This.start_time = 0;
This.bang = "크다";
};
} ());

//테스트 코드
var a = 새로운 Universe();
var b = 새로운 Universe();
경고(a === b); // 참
a.bang = "123";
경고(b.bang); // 123