functional继承模式 摘自javascript:the good parts


Posted in Javascript onJune 20, 2011

这种模式的作用在于确保对象属性的真正私有化, 我们无法直接访问对象的状态, 只能通过特权方法来进行操作.
下面直接来个例子吧.

var person = function(cfg) { 
var that = {}; 
that.getName = function() { 
return cfg.name || 'unknow name'; 
}; 
// 性别 默认男性 
that.getGender = function() { 
return cfg.gender || 'male'; 
}; 
return that; 
}; 
var programmer = function(cfg) { 
var that = person(cfg), 
share = {}; 
share.status = 'normal'; 
that.getFamiliarLanguage = function() { 
return (cfg.langs || []).join(' '); 
}; 
that.getProfile = function() { 
return 'hi,my name is ' + that.getName(); 
}; 
that.getStatus = function() { 
return share.status; 
}; 
that.setStatus = function(status) { 
share.status = status; 
}; 
return that; 
}; 
var me = programmer({ 
name: 'AndyZhang', 
gender: 'male', 
// 熟悉的语言 
langs: ['javascript', 'java', 'php'] 
}); 
console.debug(me.getFamiliarLanguage()); 
console.debug(me.getProfile()); 
me.setStatus('oh really busy..'); 
console.debug(me.getStatus());

从代码中可以看到,我们调用programmer方法时,没用使用new, 而且方法里也没有出现this关键字.
如果出现类似this.name = cfg.name这样的属性赋值代码, 再用new去调用(构造函数调用方式),这样产生的对象的name属性就不再私有.如:
// 这里方法名的首字母大写 以表示作为一个构造方法 用new来调用 
var Person = function(cfg) { 
this.name = cfg.name; 
this.gender = cfg.gender; 
} 
// new出一个person1 
var person1 = new Person({ 
name: 'Andrew', 
gender: 'male' 
}); 
// 本来是想让name, gender成为私有 用类似setter getter方法来读写 就像javaBean一样 
alert(person1.name); // 'Andrew' 
alert(person1.gender); // 'male'

从上面的例子可以看出person1的属性我们是可以直接访问的,没有做到真正的private. 有时候我们会用代码规范或约定来表示我们定义的某个属性是私有的,比如this._name用这样的写法表示name属性是私有的. 个人觉得只要约定统一,这也是一种不错的方式, 在第三方js库中,这种运用的可能比较多,像YUI2
继续看最开始的代码, 没有用到this, 而是用了that作为载体, 从programmer方法中我们看到that所起到的作用, 调用person后,返回的that已经具有了person所具有的方法getName, getGender, 然后我们根据programmer具体的需要在that基础上进行扩展, 当然也可以覆写原来的方法, programmer中的share可以用来集中一些私有变量和方法, 通过javascript的scope和closure机制, 可以在that扩展的方法中对它们进行处理和调用, 比如代码中的that.getStatus和that.setStatus方法, 最后return that.
Javascript 相关文章推荐
几个有趣的Javascript Hack
Jul 24 Javascript
jquery插件之easing 动态菜单
Aug 21 Javascript
javascript操作css属性
Dec 30 Javascript
返回上一页并自动刷新的JavaScript代码
Feb 19 Javascript
理解Javascript的动态语言特性
Jun 17 Javascript
Bootstrap的Refresh Icon也spin起来
Jul 13 Javascript
jquery把int类型转换成字符串类型的方法
Oct 07 Javascript
JavaScript使用原型和原型链实现对象继承的方法详解
Apr 05 Javascript
浅谈发布订阅模式与观察者模式
Apr 09 Javascript
解决layui laydate 时间控件一闪而过的问题
Sep 28 Javascript
基于JQuery实现页面定时弹出广告
May 08 jQuery
Vue项目前后端联调(使用proxyTable实现跨域方式)
Jul 18 Javascript
jQuery数组处理方法汇总
Jun 20 #Javascript
jQuery UI AutoComplete 使用说明
Jun 20 #Javascript
jQuery 源码分析笔记(3) Deferred机制
Jun 19 #Javascript
jQuery 源码分析笔记(7) Queue
Jun 19 #Javascript
jQuery 源码分析笔记(5) jQuery.support
Jun 19 #Javascript
jQuery调用WebService的实现代码
Jun 19 #Javascript
非常棒的10款jQuery 幻灯片插件
Jun 14 #Javascript
You might like
php 如何获取文件的后缀名
2016/06/05 PHP
谈谈PHP连接Access数据库的注意事项
2016/08/12 PHP
单独使用CKFinder选择图片的方法
2010/08/21 Javascript
js实现一个省市区三级联动选择框代码分享
2013/03/06 Javascript
js获得当前时区夏令时发生和终止的时间代码
2014/02/23 Javascript
js调试系列 控制台命令行API使用方法
2014/06/18 Javascript
JavaScript控制两个列表框listbox左右交换数据的方法
2015/03/18 Javascript
原生JS实现仿淘宝网左侧商品分类菜单效果代码
2015/09/10 Javascript
jquery中取消和绑定hover事件的实现代码
2016/06/02 Javascript
JS 日期与时间戮相互转化的简单实例
2016/06/22 Javascript
JS原型链怎么理解
2016/06/27 Javascript
JS调用某段SQL语句的方法
2016/10/20 Javascript
微信小程序 input输入框控件详解及实例(多种示例)
2016/12/14 Javascript
纯JS单页面赛车游戏制作代码分享
2017/03/03 Javascript
详解node服务器中打开html文件的两种方法
2017/09/18 Javascript
angularjs 页面自适应高度的方法
2018/01/17 Javascript
详解vue移动端日期选择组件
2018/02/22 Javascript
小程序ios音频播放没声音问题的解决
2018/07/11 Javascript
vue + any-touch实现一个iscroll 实现拖拽和滑动动画效果
2019/04/08 Javascript
vue配置文件实现代理v2版本的方法
2019/06/21 Javascript
Vue移动端右滑屏幕返回上一页附源码下载
2019/06/26 Javascript
vue vantUI tab切换时 list组件不触发load事件的问题及解决方法
2020/02/14 Javascript
javascript设计模式 ? 模板方法模式原理与用法实例分析
2020/04/23 Javascript
[01:04:09]DOTA2-DPC中国联赛 正赛 iG vs VG BO3 第二场 2月2日
2021/03/11 DOTA
简单介绍Python中的len()函数的使用
2015/04/07 Python
Windows下anaconda安装第三方包的方法小结(tensorflow、gensim为例)
2018/04/05 Python
python不到50行代码完成了多张excel合并的实现示例
2020/05/28 Python
佳能德国网上商店:Canon德国
2017/03/18 全球购物
美国新兴城市生活方式零售商:VILLA
2017/12/06 全球购物
俄罗斯卫浴采暖及维修用品超级市场:Dkrussia
2020/05/12 全球购物
经济管理专业毕业生自荐信范文
2014/01/02 职场文书
公司部门司机岗位职责
2014/01/03 职场文书
应届优秀本科大学毕业生自我鉴定
2014/01/21 职场文书
施工质量承诺书范文
2014/05/30 职场文书
超市理货员岗位职责
2014/07/04 职场文书
mysql中如何用命令创建联合唯一索引
2022/04/20 MySQL