浅谈Backbone的defaults

使用Backbone开发也有一段时间了,直到前2周,才发现,之前走的都是弯路,使用的方式都是错的。

不扯了。今天记录一下自己使用Backbone的defaults时需要注意的地方。

用过Backbone的都知道,defaults能节省不少重复的初始化代码段。

1 var Model = Backbone.Model.extend({
2     defaults: {
3         str: ‘this is string‘,
4         num: 0
5     }
6 });
7
8 var a=new Model();
9 var b=new Model();

然后试试下面的代码

 1 var Model = Backbone.Model.extend({
 2     defaults: {
 3         list: [],
 4         obj: {}
 5     }
 6 });
 7
 8 var a = new Model();
 9 var b = new Model();
10
11 a.get(‘list‘).push(1);
12 a.get(‘obj‘)[‘str‘] = ‘tihs is string‘;
13
14 console.log("b.attributes", b.attributes);

结果如下

是的,Model b的数据也改了,原因很简单:Array和Object是引用类型。

解决方法有2个:

1,初始化对象时,显式传入初始化的数据

1 var a = new Model({ list: [], obj: {} });
2 var b = new Model({ list: [], obj: {} });

2,修改defaults对象的值,通过function返回

1 var Model = Backbone.Model.extend({
2     defaults: function () {
3         return {
4             list: [],
5             obj: {}
6         };
7     }
8 });

看Backbone的Model方法

 1   var Model = Backbone.Model = function(attributes, options) {
 2     var attrs = attributes || {};
 3     options || (options = {});
 4     this.cid = _.uniqueId(‘c‘);
 5     this.attributes = {};
 6     if (options.collection) this.collection = options.collection;
 7     if (options.parse) attrs = this.parse(attrs, options) || {};
 8     attrs = _.defaults({}, attrs, _.result(this, ‘defaults‘));
 9     this.set(attrs, options);
10     this.changed = {};
11     this.initialize.apply(this, arguments);
12   };

重点是:attrs = _.defaults({}, attrs, _.result(this, ‘defaults‘));

其中的Underscore方法_.result

仅此提醒自己:不要想着看文档就行,无需理会源码。真的不能再偷懒了!

时间: 2024-09-15 19:56:52

浅谈Backbone的defaults的相关文章

浅谈HTML5单页面架构(二)——backbone + requirejs + zepto + underscore

本文转载自:http://www.cnblogs.com/kenkofox/p/4648472.html 上一篇<浅谈HTML5单页面架构(一)——requirejs + angular + angular-route>探讨了angular+requirejs的一个简单架构,这一篇继续来看看backbone如何跟requirejs结合. 相同地,项目架构好与坏不是说用了多少牛逼的框架,而是怎么合理利用框架,让项目开发更流畅,代码更容易管理.那么带着这个目的,我们来继续探讨backbone. 首

单页应用SEO浅谈

单页应用SEO浅谈 前言 单页应用(Single Page Application)越来越受web开发者欢迎,单页应用的体验可以模拟原生应用,一次开发,多端兼容.单页应用并不是一个全新发明的技术,而是随着互联网的发展,满足用户体验的一种综合技术. SEO 一直以来,搜索引擎优化(SEO)是开发者容易忽略的部分.SEO是针对搜索(Google.百度.雅虎搜索等)在技术细节上的优化,例如语义.搜索关键词与内容相关性.收录量.搜索排名等.SEO也是同行.市场竞争常用的的营销手段.Google.百度的搜

浅谈HTML5单页面架构(一)——requirejs + angular + angular-route

本文转载自:http://www.cnblogs.com/kenkofox/p/4643760.html 心血来潮,打算结合实际开发的经验,浅谈一下HTML5单页面App或网页的架构. 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又要数单页面架构体验最好,更像原生app.简单来说,单页面App不需要频繁切换网页,可以局部刷新,整个加载流畅度会好很多. 废话就不多说了,直接到正题吧,浅谈一下我自己理解的几种单页面架构: 1.requirejs

浅谈移动前端的最佳实践(转)

前言 这几天,第三轮全站优化结束,测试项目在2G首屏载入速度取得了一些优化成绩,对比下来有10s左右的差距: 这次优化工作结束后,已经是第三次大规模折腾公司框架了,这里将一些自己知道的移动端的建议提出来分享下,希望对各位有用 文中有误请您提出,以免误人自误 技术选型 单页or多页 spa(single page application)也就是我们常常说的web应用程序webapp,被认为是业内的发展趋势,主要有两个优点: ① 用户体验好 ② 可以更好的降低服务器压力 但是单页有几个致命的缺点:

AngularJS进阶(二十五)requirejs + angular + angular-route 浅谈HTML5单页面架构

requirejs + angular + angular-route 浅谈HTML5单页面架构 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又要数单页面架构体验最好,更像原生app.简单来说,单页面App不需要频繁切换网页,可以局部刷新,整个加载流畅度会好很多. 废话就不多说了,直接到正题吧,浅谈一下我自己理解的几种单页面架构: 1.requirejs+angular+angular-route(+zepto) 最后这个zepto可有可无

浅谈前后端分离

浅谈前后端分离 所谓的前后端分离,到底是分离什么呢?其实就是页面的渲染工作,之前是后端渲染好页面,交给前端来显示,分离后前端需要自己拼装html代码,然后再显示.前端来管理页面的渲染有很多好处,比如减少网络请求量,制作单页面应用等.事情听起来简单,但这么一分离又会牵扯到很多问题,比如: 资源的按需加载.尤其是在单页应用中. 页面展现逻辑.分离让前端的逻辑陡增,需要有一个良好的前端架构,如mvc模式. 数据校验.因为页面数据都是从后端请求来的,必须校验要展示的数据是否合法,避免xss或其他安全问题

.net中对象序列化技术浅谈

.net中对象序列化技术浅谈 2009-03-11 阅读2756评论2 序列化是将对象状态转换为可保持或传输的格式的过程.与序列化相对的是反序列化,它将流转换为对象.这两个过程结合起来,可以轻松地存储和传输数 据.例如,可以序列化一个对象,然后使用 HTTP 通过 Internet 在客户端和服务器之间传输该对象.反之,反序列化根据流重新构造对象.此外还可以将对象序列化后保存到本地,再次运行的时候可以从本地文件 中“恢复”对象到序列化之前的状态.在.net中有提供了几种序列化的方式:二进制序列化

浅谈——页面静态化

现在互联网发展越来越迅速,对网站的性能要求越来越高,也就是如何应对高并发量.像12306需要应付上亿人同时来抢票,淘宝双十一--所以,如何提高网站的性能,是做网站都需要考虑的. 首先网站性能优化的方面有很多:1,使用缓存,最传统的一级二级缓存:2,将服务和数据库分开,使用不同的服务器,分工更加明确,效率更加高:3,分布式,提供多台服务器,利用反向代理服务器nginx进行反向代理,将请求分散开来:4,数据库的读写分离,不同的数据库,将读操作和写操作分开,并实时同步即可:5,分布式缓存,使用memc

浅谈html标签

浅谈html各常用标签用法 标题标签:<h1>-<h6>来表示,使标题字体变粗. <br />换行标记 <hr />水平分隔符 &nbsp空格符 &copy版权符 <a href>a标签超链接 href可接链接地址 <p>段落标签<blockquote>引用标签及可用做缩进 <table>表格中的<ul>无序列表<ol>有序列表<dl>自定义列表<row