Backbone.js事件触发 #

var obj = _.extend({}, Backbone.Events);

obj.on('alert', function(message) {
    console.log('Alert:', message);
});

obj.trigger('alert', 'Hello World');

obj.on('event1', function() { console.log('Event 1'); });
obj.on('event2', function() { console.log('Event 2'); });

obj.trigger('event1 event2');

obj.on('custom', function(a, b, c) {
    console.log(a, b, c);
});

obj.trigger('custom', 1, 2, 3);

var result = obj.trigger('alert', 'Hello');
console.log(result === obj);

obj.on('greet', function(name) {
    console.log('Hello, ' + name);
});

obj.trigger('greet', 'World');

obj.on('calculate', function(a, b, operator) {
    var result;
    switch (operator) {
        case '+': result = a + b; break;
        case '-': result = a - b; break;
        case '*': result = a * b; break;
    }
    console.log(result);
});

obj.trigger('calculate', 10, 5, '+');

obj.on('save', function(data) {
    console.log('保存数据:', data);
});

obj.trigger('save', {
    id: 1,
    name: '张三',
    email: 'zhangsan@example.com'
});

obj.on('user:action', function(event) {
    console.log('用户:', event.user);
    console.log('动作:', event.action);
    console.log('时间:', event.timestamp);
});

obj.trigger('user:action', {
    user: '张三',
    action: 'login',
    timestamp: new Date()
});

obj.on('user:login', function(user) {
    console.log('用户登录:', user);
});

obj.on('user:logout', function() {
    console.log('用户登出');
});

obj.on('model:save:success', function(model) {
    console.log('保存成功:', model);
});

obj.on('model:save:error', function(error) {
    console.log('保存失败:', error);
});

obj.on('user:created', function() {});
obj.on('user:updated', function() {});
obj.on('user:deleted', function() {});

obj.on('order:created', function() {});
obj.on('order:updated', function() {});
obj.on('order:deleted', function() {});

var StateMachine = _.extend({
    state: 'idle',
    
    transition: function(newState) {
        var oldState = this.state;
        this.state = newState;
        
        this.trigger('state:change', newState, oldState);
        this.trigger('state:' + newState);
    }
}, Backbone.Events);

StateMachine.on('state:change', function(newState, oldState) {
    console.log('状态从', oldState, '变为', newState);
});

StateMachine.on('state:running', function() {
    console.log('进入运行状态');
});

StateMachine.transition('running');

var OrderService = _.extend({
    create: function(data) {
        this.trigger('order:beforeCreate', data);
        
        var order = this.doCreate(data);
        
        this.trigger('order:created', order);
        return order;
    },
    
    cancel: function(orderId) {
        this.trigger('order:beforeCancel', orderId);
        
        var result = this.doCancel(orderId);
        
        this.trigger('order:cancelled', orderId);
        return result;
    }
}, Backbone.Events);

obj.on('start', function() {
    console.log('开始');
    obj.trigger('process');
});

obj.on('process', function() {
    console.log('处理中');
    obj.trigger('complete');
});

obj.on('complete', function() {
    console.log('完成');
});

obj.trigger('start');

obj.on('validate', function(data) {
    if (data.valid) {
        obj.trigger('validate:success', data);
    } else {
        obj.trigger('validate:error', data.errors);
    }
});

obj.on('validate:success', function(data) {
    console.log('验证成功:', data);
});

obj.on('validate:error', function(errors) {
    console.log('验证失败:', errors);
});

obj.trigger('validate', { valid: true, data: {} });
obj.trigger('validate', { valid: false, errors: ['错误1', '错误2'] });

obj.on('fetch:start', function() {
    console.log('开始获取数据');
    
    setTimeout(function() {
        obj.trigger('fetch:complete', { data: [1, 2, 3] });
    }, 1000);
});

obj.on('fetch:complete', function(result) {
    console.log('获取完成:', result.data);
});

obj.trigger('fetch:start');

var EventBus = _.extend({}, Backbone.Events);

var ModuleA = {
    init: function() {
        EventBus.on('data:updated', this.onDataUpdated, this);
    },
    
    onDataUpdated: function(data) {
        console.log('ModuleA 收到数据更新:', data);
    }
};

var ModuleB = {
    init: function() {
        EventBus.on('data:updated', this.onDataUpdated, this);
    },
    
    onDataUpdated: function(data) {
        console.log('ModuleB 收到数据更新:', data);
    }
};

ModuleA.init();
ModuleB.init();

EventBus.trigger('data:updated', { id: 1, name: '张三' });

var Parent = _.extend({}, Backbone.Events);
var Child = _.extend({}, Backbone.Events);

Child.on('action', function(data) {
    console.log('Child 处理:', data);
    Parent.trigger('child:action', data);
});

Parent.on('child:action', function(data) {
    console.log('Parent 收到子事件:', data);
});

Child.trigger('action', { type: 'click' });

var EventAggregator = {
    events: {},
    
    register: function(name, obj) {
        this.events[name] = obj;
    },
    
    broadcast: function(event, data) {
        for (var name in this.events) {
            this.events[name].trigger(event, data);
        }
    }
};

var module1 = _.extend({}, Backbone.Events);
var module2 = _.extend({}, Backbone.Events);

EventAggregator.register('module1', module1);
EventAggregator.register('module2', module2);

module1.on('update', function(data) {
    console.log('Module1 更新:', data);
});

module2.on('update', function(data) {
    console.log('Module2 更新:', data);
});

EventAggregator.broadcast('update', { value: 100 });

var NotificationService = _.extend({
    notify: function(type, message) {
        this.trigger('notification', {
            type: type,
            message: message,
            timestamp: new Date()
        });
    },
    
    success: function(message) {
        this.notify('success', message);
    },
    
    error: function(message) {
        this.notify('error', message);
    },
    
    warning: function(message) {
        this.notify('warning', message);
    },
    
    info: function(message) {
        this.notify('info', message);
    }
}, Backbone.Events);

NotificationService.on('notification', function(notification) {
    console.log('[' + notification.type + ']', notification.message);
});

NotificationService.success('操作成功');
NotificationService.error('操作失败');

var ProgressTracker = _.extend({
    start: function(total) {
        this.total = total;
        this.current = 0;
        this.trigger('progress:start', { total: total });
    },
    
    update: function(increment) {
        this.current += increment;
        var percent = Math.round((this.current / this.total) * 100);
        
        this.trigger('progress:update', {
            current: this.current,
            total: this.total,
            percent: percent
        });
        
        if (this.current >= this.total) {
            this.complete();
        }
    },
    
    complete: function() {
        this.trigger('progress:complete');
    }
}, Backbone.Events);

ProgressTracker.on('progress:update', function(data) {
    console.log('进度:', data.percent + '%');
});

ProgressTracker.on('progress:complete', function() {
    console.log('完成!');
});

ProgressTracker.start(100);
ProgressTracker.update(30);
ProgressTracker.update(40);
ProgressTracker.update(30);

var Component = _.extend({
    initialize: function(options) {
        this.trigger('before:init', options);
        
        this.options = options;
        this.setup();
        
        this.trigger('init', this);
    },
    
    setup: function() {
        this.trigger('setup');
    },
    
    destroy: function() {
        this.trigger('before:destroy');
        
        this.cleanup();
        
        this.trigger('destroy');
        this.off();
    },
    
    cleanup: function() {
        this.trigger('cleanup');
    }
}, Backbone.Events);

Component.on('before:init', function(options) {
    console.log('初始化前:', options);
});

Component.on('init', function(component) {
    console.log('初始化完成');
});

Component.on('before:destroy', function() {
    console.log('销毁前');
});

Component.on('destroy', function() {
    console.log('已销毁');
});

Component.initialize({ debug: true });
Component.destroy();