backbone.js之Model篇 简单总结和深入(2)
一、模型属性的一些操作方法
1、mmodel.get() 获取属性的值
2、mmodel.set('age',5) 更新单个属性的值
mmodel.set({name:'aaa',age:6}) 更新多个属性的值
在设置属性值时,如果该属性不存在,会自动创建该属性;同时会以true的形式返回一个模型的引用。
3、mmodel.unset('age') 从模型中删除一个属性
4、mmodel.clear() 从模型中删除所有的属性
5、mmodel.has('age') 检查是否存在某一属性
6、mmodel.isValid() 手动触发验证,只会返回true或者false,但不会触发invalid
二、HTML转义后的属性值
如果用户输入的文字不是纯文本格式,可能会有一些导致XSS注入攻击的安全漏洞,解决的办法就是任何用户输入文字之前使用escape()
var testModel = new Backbone.Model({
name : "<script>alert(11)</script>"
}); var escaped_name = testModel.escape('name');
三、重写setter 方法和 getter方法
1、使用原因:
(1 属性需要变化格式进行存储
(2 需要一个模型虚拟属性,依赖于其他属性
(3 防止把非法的值赋值给模型属性
2、操作:需要引入mutators.js,到https://github.com/asciidisco/Backbone.Mutators下载 backbone.mutators.js 文件,然后引入到项目中
3、原因(2)demo:
(function($){ var testModel = Backbone.Model.extend({ mutators:{
fullMessage : {
get: function(){
return this.get('name') + ' -and-' + this.get('age');
//return this.name + ' -hh-' + this.age;
}
}
}
}); var t = new testModel;
t.set({
name :'Axiba',
age : 33
});
alert(t.get('fullMessage'));
alert(t.get('name')); })(jQuery);
4、反过来,重写setter方法的demo,注意key和value:
(function($){ var testModel = Backbone.Model.extend({ mutators:{
fullMessage : {
get: function(){
return this.get('name') + '-and-' + this.get('age');
},
set: function(key, value, options, set){
var message = value.split('-and-');
this.set('name',message[0],options);
this.set('age',message[0],options);
}
}
}
}); var t = new testModel;
t.set({
name :'Axiba',
age : '33'
}); t.set('fullMessage','daomul-and-11'); alert(t.get('fullMessage'));
alert(t.get('name'));
alert(t.get('age')); })(jQuery);
5、值得注意的是:
(1 如果是在创建新模型的时候给属性赋值,没有触发到change事件的话,其对应的setter方法是不会触发的。
(2 新的方法会试图先调用被重写的getter和setter方法,再去调用原始的get() 和 set()
backbone.js之Model篇 简单总结和深入(2)的更多相关文章
- Backbone.js之model篇(一)
Backbone.js之model篇(一) Backbone 是一个前端 JS 代码 MVC 框架,它不可取代 Jquery,不可取代现有的 template 库.而是和这些结合起来构建复杂的 web ...
- backBone.js之Model篇 (1) 简单实例
“Model是js应用的核心,包括基础的数据以及围绕着这些数据的逻辑:数据转换.验证.属性计算和访问控制”. 一.初始化方法 我们先来看一个demo,initialize,这是一个初始化方法,但是写这 ...
- [Backbone.js]如何处理Model里面嵌入的Collection?
写了近半个月的backbone.js代码,从一开始的todo到现在做仿微信的网页聊天,其中最大的困惑就在于如何处理比较复杂的Model,其内嵌了一个或者多个Collections. 假设我们有一个Pe ...
- Backbone学习笔记 - Model篇
2 Model 在Backbone中,Model用于存储核心数据,可以将数据交互相关的逻辑代码放在这里.基本形式如下: var Human = Backbone.Model.extend({ init ...
- Backbone之旅——Model篇
Backbone作为前端的MVC框架,把后端的设计思想带到前端,使前端代码更加清晰.可维护性大大提高 Backbone依赖于underscore.js和jquery,所以在使用backbone的时候一 ...
- js学习第二篇简单语法
字符串(String)字面量 可以使用单引号或双引号 数组(Array)字面量 定义一个数组: [40, 100, 1, 5, 25, 10] 对象(Object)字面量 定义一个对象: {first ...
- Backbone.js 中使用 Model
前面几篇 Backbone.js 的例子中有使用到 template, 及数据的填充,其实这已经很接近 Model 了.现在来学习怎么创建自己的 Model 类,并简单的使用.Backbone.js ...
- backbone.js 教程(1) View & Model & Collection
Backbone.js Overview 它由Jeremy Ashkenas开发,最初发行于2010-10-13 它是一个轻量的JavaScript类库,只依赖于underscore.js,非强制依赖 ...
- MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录
注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...
随机推荐
- Apache伪静态配置,支持.htaccess配置方法
第一.编辑httpd.conf文件 A - 在etc/httpd/conf/目录下的httpd.conf 文件,找到: LoadModule rewrite_module modules/mod_re ...
- 使用a标签制作tooltips
摘要: 前面已经分享了三种方法制作tooltips,今天再来分享一个借助a标签来实现tooltips的方法. 效果如下:
- kendo-ui下拉树形选择(DropDownTreeView)
摘要: 最近项目中有一个特殊的需求,下拉选择部门,但是部门的层级关系要在下来框中体现出来,如下图 下面我就把实现的过程分享给大家,代码如下: dropdowntreeview.js /* * * Dr ...
- MTK 精简ROM
PhaseBeam.apk--------------------------------------动态壁纸光之韵律(可删) Phone.apk--------------------------- ...
- 奔五的人学ios:swift竟然没有字符串包括,找个简单的解决方法
swift关于字符串的推断中 有前导.有后缀 两个方法.竟然没有包括推断. 经过学习找了个简单的解决方法: extension String { func has(v:String)->Bool ...
- 5 -- Hibernate的基本用法 --4 6 Hibernate事务属性
事务也是Hibernate持久层访问的重要方面,Hibernate不仅提供了局部事务支持,也允许使用容器管理的全局事务. Hibernate关于事务管理的属性: ⊙ hibernate.transac ...
- [转]PHP判断字符串是纯英文、纯汉字或汉英混合(GBK)
PHP判断字符串是否为中文(或英文)的方法,除了正则表达式判断和拆分字符判断字符的值是否小于128 外还有一种比较特别的方法. 使用php中的mb_strlen和strlen函数判断 方法比较简单:分 ...
- 利用Python爆破数据库备份文件
某次测试过程中,发现PHP备份功能代码如下: // 根据时间生成备份文件名 $file_name = 'D' . date('Ymd') . 'T' . date('His'); $sql_file_ ...
- [XPath] XPath 与 lxml (五)XPath 实例
本文继续沿用第三章的 XML 示例文档. 选取价格高于30的 price 节点 # 从父节点进行筛选 >>> root.xpath('//book[price>30]/pric ...
- LINUX分辨率修改
上次说过了如何搭建LINUX虚拟机环境,但是完成之后存在很多问题,屏幕分辨太小就是其中之一. 为了让各位能有一个舒心的工作环境,现在就教给大家LINUX系统更改屏幕分辨率的两个办法. 一.鼠标操作 1 ...