首页 > 代码库 > 表现和数据分离的好处
表现和数据分离的好处
http://www.cnblogs.com/yexiaochai/p/3167465.html
1、界面与数据的分离，必须体现在代码上，界面的代码归界面的代码，数据的代码归数据的代码，两者必须泾渭分明。
2、当界面需求发生改变，只需要改写界面的代码，并且所改写的代码不能影响到数据访问的代码。
只有做到这两者才算界面与数据分离。叶小钗同学让我上代码，趁今天还不是很忙，写下了下面的代码：
<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8" /> <title></title> <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> <script> $(function () { var Countries = function () { } Countries.prototype = { _items: [], _getData: function (success) { var items = [ { id: 0, name: ‘中国‘ }, { id: 1, name: ‘日本‘ }, { id: 2, name: ‘美国‘ } ]; $.extend(this._items, items); success(items); }, //Events on_selected: $.Callbacks(), on_inserted: $.Callbacks(), //Methods select: function () { var self = this; this._getData(function (items) { self.on_selected.fire({ sender: self, items: items }); }); }, insert: function (item) { var self = this; this._items.push(item); self.on_inserted.fire({ sender: self, item: item }); } } //======================================================================= // 以下为界面代码，当要调整界面，改这里就行啦~~~ var countries = new Countries(); countries.on_selected.add(function (args) { $(args.items).each(function () { $(‘#countries‘).append($(‘<option>‘).attr(‘value‘, this.id).text(this.name)); }); }); countries.on_inserted.add(function (args) { $(‘#countries‘).append($(‘<option selected="selected">‘).attr(‘value‘, args.item.id).text(args.item.name)); }); var id = 10; $(‘#btnAdd‘).click(function () { countries.insert({ id: ++id, name: $(‘#countryName‘).val() }); }); countries.select(); //======================================================================= }); </script></head><body> <select id="countries"></select> <div> <input id="countryName" /><button id="btnAdd">添加</button> </div></body></html>代码是可以直接Copy运行的，界面如下图：
上面的代码，真正做到了界面与数据的分离：
1、在数据访问的代码，没有一行涉及到UI的，如果有一行，哪怕一行涉及到，都不能算是界面与数据分离。（简单点说，就是数据访问的代码，不能对UI有依赖）
2、当界面需求发生变化，只要修改界面的代码就可以了。
3、数据访问的代码会不会发生变化？一般来说，这个是很少会发生变化的（相比界面）。假如发生变化了，需要修改数据访问的代码，所作的修改并不会影响到界面的代码。
表现和数据分离的好处
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。