这是javascript中的MVC吗?
尽管我已经在PHP中多次使用MVC,但我发现它在Javascript中是完全不同的。我正在通过web阅读Javascript中的MVC,但其中许多都有不同的实现。我提出了一个简单的MVC,但我认为这是不正确的。这是可以接受的还是完全错误的这是javascript中的MVC吗?,javascript,model-view-controller,design-patterns,Javascript,Model View Controller,Design Patterns,尽管我已经在PHP中多次使用MVC,但我发现它在Javascript中是完全不同的。我正在通过web阅读Javascript中的MVC,但其中许多都有不同的实现。我提出了一个简单的MVC,但我认为这是不正确的。这是可以接受的还是完全错误的 var AppView = View.extend({ init: function() { // listen to Model changes this.listen("counterChanged",
var AppView = View.extend({
init: function()
{
// listen to Model changes
this.listen("counterChanged", $.proxy( this.updateCounter, this ));
// assign click event; call controller method
this.container.find("#increase").click( this.callback( this.Controller, "increase" ));
this.container.find("#decrease").click( this.callback( this.Controller, "decrease" ));
},
updateCounter: function( evtData )
{
this.container.find("#counter").html( evtData.newValue );
}
});
var AppController = Controller.extend({
increase: function()
{
this.Model.update("counter", this.Model.get('counter') + 1 );
},
decrease: function()
{
this.Model.update("counter", this.Model.get('counter') - 1 );
}
});
var AppModel = Model.extend({
onUpdate_counter: function( newValue )
{
this.fireEvent("counterChanged",{
newValue: newValue
})
}
});
var App = {}
$(document).ready(function(){
App.Model = new AppModel({
counter: 0
});
App.Controller = new AppController( App.Model );
App.View = new AppView("#app", App.Controller );
App.Model.setView( App.View );
});
HTML:
<div id='app'>
<div id='counter'>0</div>
<a id='increase'>Increae</a>
<a id='decrease'>Decrease</a>
</div>
0
肠内
减少
视图侦听模型中的更改并将事件分配给html锚。视图在单击定位点时调用控制器,然后控制器更新模型 这是经典的1979型MVC:
- 控制器更新模型
- 模型通过侦听器更新视图
- 控制器更新模型
- 控制器从模型中获取数据并将其发送到视图
在这两种类型中,视图事件都会触发控制器操作。clyfe//在您看来,在Javascript环境中哪个更好?我在我的一个项目中使用了PHP风格的MVC,但我的经理指出我的控制器与视图是耦合的。在客户端js中,经典模型有更多的好处。也有人试图通过服务器推送(WebSockets,comet)技术使用经典模式的服务器端。一般来说,经典模型更好(耦合更少,样板更少)。模型2只是请求/响应web特性压缩的结果。