>웹 프론트엔드 >JS 튜토리얼 >js 디자인 패턴 - 싱글턴 패턴의 활용

js 디자인 패턴 - 싱글턴 패턴의 활용

php中世界最好的语言
php中世界最好的语言원래의
2018-03-14 14:02:332432검색

이번에는 js디자인 패턴-싱글 케이스 모드를 가져왔는데, js 싱글턴 모드 사용 시 주의사항은 무엇인지 살펴보겠습니다.

1. 개념:

전통적인 개발 엔지니어의 관점에서 단일 관심 모델은 각 클래스에 인스턴스가 하나만 있는지 확인하는 것입니다. 인스턴스가 존재하는지 여부를 먼저 확인합니다. 존재하지 않으면 다시 생성되므로 각 클래스에 대해 인스턴스 개체가 하나만 있습니다. JavaScript에서 싱글톤은
네임스페이스의 공급자 역할을 하며 전역적으로 개체에 액세스할 수 있는 고유한 액세스 지점을 제공합니다. 123 2. 기능 및 주의사항:
기능: 1. 모듈 간 통신
2. 시스템에는 특정 클래스의 객체가 하나만 있을 수 있습니다.
3. 자신의
속성 및 메소드를 보호하세요 참고: 1. 지불 이것에 주의하세요
      2. 클로저는 쉽게 메모리 누수를 일으킬 수 있습니다
        3. 상속을 사용할 때 new 사용에 주의하세요.

3. 구현하는 가장 간단한 방법은

많은 수의 속성과 메서드를 포함할 수 있는 객체 리터럴을 사용하는 것입니다.

var firstObject = {
    property1: "something",
    property2: "something else",
    method1: function () {
        console.log('hello web!');
    }
};

이 객체를 확장하려면 자체 전용 멤버를 제공한 다음 클로저를 통해 이러한 변수 및 함수 선언을 내부에 캡슐화할 수 있습니다. 비공개 또는 공개 메소드를 구현할 수 있습니다. 다음 코드를 다시 살펴보겠습니다.

var firstObject= function () {
    /* 这里声明私有变量和方法 */
    var privateVariable = 'something private';    function showPrivate() {
        console.log(privateVariable);
    }    /* 公有变量和方法(可以访问私有变量和方法) */
    return {
        publicMethod: function () {
            showPrivate();
        },
        publicVar: 'the public can see this!'
    };
};var single = firstObject();
single.publicMethod();  // 输出 'something private'console.log(single.publicVar); // 输出 'the public can see this!'

사용할 때만 초기화하고 싶다면 어떻게 해야 할까요? 리소스를 절약하기 위해 다음과 같이 다른

생성자에서 이러한 코드를 초기화할 수 있습니다.

var firstjObiect= (function () {
    var instantiated;    function init() {
        /*这里定义单例代码*/
        return {
            publicMethod: function () {
                console.log('hello world');
            },
            publicProperty: 'test'
        };
    }    return {
        getInstance: function () {
            if (!instantiated) {
                instantiated = init();
            }            return instantiated;
        }
    };
})();/*调用公有的方法来获取实例:*/firstjObiect.getInstance().publicMethod();

사용 시나리오를 살펴보겠습니다. 싱글톤은 일반적으로 시스템 간의 다양한 모드에서 통신 조정에 사용됩니다.

var firstObjectTester = (function () {
    //参数:传递给单例的一个参数集合
    function Singleton(args) {
        //设置args变量为接收的参数或者为空(如果没有提供的话)
        var args = args || {};        //设置name参数
        this.name = 'SingletonTester';        //设置pointX的值
        this.pointX = args.pointX || 6; //从接收的参数里获取,或者设置为默认值
        //设置pointY的值
        this.pointY = args.pointY || 10;
    }    //实例容器
    var instance;    var _static = {
        name: 'SingletonTester',        //获取实例的方法
        //返回Singleton的实例
        getInstance: function (args) {
            if (instance === undefined) {
                instance = new Singleton(args);
            }            return instance;
        }
    };    return _static;
})();var singletonTest = firstObjectTester .getInstance({ pointX: 5 });
console.log(singletonTest.pointX); // 输出 5

다음은 다음과 같습니다. 싱글톤 모드 구현 예에 대한 링크는 다음과 같습니다.

텍스트 영역 데이터 저장 중 Html을 Txt로 변환하고 표시 중 Txt를 Html로 변환하는 솔루션

위 방법의 주요 구현 방법은 다음과 같습니다. 다른 구현 방법은 (출처: Tom 삼촌의 블로그)

Method 1,

function Universe() {
    // 判断是否存在实例
    if (typeof Universe.instance === 'object') {        return Universe.instance;
    }    // 其它内容
    this.start_time = 0;    this.bang = "Big";    // 缓存
    Universe.instance = this;    // 隐式返回this}// 测试var uni = new Universe();var uni2 = new Universe();
console.log(uni === uni2); // true

Method 2,

function Universe() {
    // 缓存的实例
    var instance = this;    // 其它内容
    this.start_time = 0;    this.bang = "Big";    // 重写构造函数
    Universe = function () {
        return instance;
    };
}// 测试var uni = new Universe();var uni2 = new Universe();
uni.bang = "123";
console.log(uni === uni2); // trueconsole.log(uni2.bang); // 123

이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 다른 관련 기사를 주목하세요. PHP 중국어 웹사이트에서!

추천 도서:

심층 JavaScript DOM 애플리케이션

심층 JavaScript 타이머

심층 JavaScript 기본 애플리케이션

위 내용은 js 디자인 패턴 - 싱글턴 패턴의 활용의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.