mvc模式分离javascript开发

作者佚名技术来源网页制作浏览发布时间 2012-03-06

观察上面得程序我们能够发现它包含三个部门：
EventsDialog 函数对CalendarEvent这个json对象的name和date属性进行了解析显示。Events的data属性存储了日历的时间。 View.EventsDialog的调用使112显示。
这里Events Dialog的view能够被扩展，加入一个附加函数能够使它进行有效的交互。在下面得例子中，Events Dialog被给了一个open方法和一个close方法。通过这样做能够使view提高自己的感知能力，同时也能够被controller层更好的使用 view层，并不需要知道它实现的细节。

View.EventsDialog = function(CalendarEvent){ … }
View.EventsDialog.prototype.open = function(){
document.getElementById(’eventshell’).style.display = ‘block’;
}
View.EventsDialog.prototype.close = function(){
document.getElementById(’eventshell’).style.display = ‘none’;
}

var dialog = new View.EventsDialog(eventObject);
dialog.open();
dialog.close();

Generalizing Views(概括观点)

使视野变得觉察到数据模型和数据检索的方法是一容易坠入的陷阱. 分离这些函数不过是想让他们在其他方面能重新使用这个dialog。在这个例子当中，如果分离了事件的数据和dialog，那么我们能总结dialog属于view层中，dialog不只适用events类的模型，也能应用到其他模型。

View.Dialog = function(data) {
var html = ‘

‘ + data.name + ‘

‘;
delete data.name;
for(var key in data) {
html += ‘

‘ + data[key] + ‘

‘;
}
var el = document.getElementById(’eventshell’);
el.innerHTML = html;
}

我们现在有一个共有的方法去访问一个任意对象的元素，而不仅仅是事件对象。在下一个需要dialog的项目中，我们可以合并这部分代码并且使用它。
很多JavaScript框架都是以这数据不可知论来设计的。比如yui controller ，jQuery UI widgets, ExtJS, 和 Dojo Dijit 从头到位都是把通用性（泛用性）放在第一位来建立的。

Handling View methods(处理视图方法)

一般来说，view层不能运行他们自己的方法，举个例子来说，dialog（对话框）不能自己控制开关，应该由controller（控制器）–控制层来控制它是否开关。
如果一个用户点击了一个dialog中的保存按钮，这个点击动作由控制器来接收，控制器发送一个动作来决定dialog应该做什么。可能是关闭dialog也能是显示正在处理..

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!

上一页 1 2 3 4 5 6 7 8 下一页

分享到：更多

你可能对下面的文章感兴趣

上一篇: Javascript教程:随机数下一篇: JS教程:词法作用域和闭包

关于mvc模式分离javascript开发的所有评论

随机推荐