매주 우수 코드 감상 분석 시리즈[2]----Jif

3024 단어 코드

하나.간단한 소개


Jif는 경량급 이벤트입니다. Jif는 이벤트 감청 on, 발송send, 비우기clear 인터페이스를 제공합니다. 우리는remove 등 인터페이스를 확장할 수 있습니다.
Jif도 관찰자 모델의 우아한 실현이다.
 

둘.코드 공개


이번 주 우수 코드는 다음과 같습니다.
        var Jif = function () {

            this._listeners = {};

        };



        Jif.prototype = (function (undefined) {

            return {

                on: function (event, callback) {

                    if (this._listeners[event] === undefined) {

                        this._listeners[event] = [];

                    }



                    this._listeners[event].push(callback);

                },



                clear: function (event, callback) {

                    var listeners = this._listeners[event];

                    var i = listeners.length;



                    if (listeners === undefined) {

                        throw new Error('Unknown event type: ' + event);

                    }



                    if (callback === undefined) {

                        this._listeners[event] = [];

                        return;

                    }



                    while (i > 0) {

                        i -= 1;

                        if (listeners[i] === callback) {

                            this._listeners[event].splice(i, 1);

                        }

                    }

                },

         

                send: function (event, msg) {

                    var listeners = this._listeners[event];

                    var i = listeners.length;



                    if (listeners === undefined) {

                        throw new Error('Unknown event type: ' + event);

                    }



                    while (i > 0) {

                        i -= 1;

                        listeners[i](msg);

                    }

                }

            };

        })();

 
 

셋.사용법

        var events = new Jif();

        //    

        events.on('weather', function (weather) {

            alert('today is   ' + weather.condition);

        });

        //    

        events.send('weather', { condition: 'sunny' });

게시와 구독을 실현했지만 게시자와 구독자의 개념을 무시하고 이벤트에서 통일된 것을 알 수 있다.
 
 

넷.기타 관련 링크


Observer Design Pattern Using JavaScript: http://www.codeproject.com/KB/scripting/Observer_Pattern_JS.aspx
javascript 관찰자 모드:http://www.cnblogs.com/rubylouvre/archive/2010/03/29/1699203.html
Javascript 난탄 디자인 모드 시리즈(1) - 관찰자 모드(Observer):http://www.cnblogs.com/liping13599168/archive/2009/01/01/1366599.html

좋은 웹페이지 즐겨찾기