JavaScript面向对象(极简主义法minimalist approach)


Posted in Javascript onJuly 17, 2012

极简主义法

荷兰程序员 Gabor de Mooij 提出了一种比 Object.create ()更好的新方法,他称这种方法为"极简主义法"(minimalist approach)。这也是我推荐的方法。

3. 1 封装

这种方法不使用 this 和 prototype,代码部署起来非常简单,这大概也是它被叫做"极简主义法"的原因。

首先,它也是用一个对象模拟"类"。在这个类里面,定义一个构造函数 createNew (),用来生成实例。

var Cat = { 
createNew: function (){ 
// some code here 
} 
};

然后,在 createNew ()里面,定义一个实例对象,把这个实例对象作为返回值。

var Cat = { 
createNew: function (){ 
var cat = {}; 
cat.name = "大毛"; 
cat.makeSound = function (){ alert ("喵喵喵"); }; 
return cat; 
} 
};

使用的时候,调用 createNew ()方法,就可以得到实例对象。

var cat1 = Cat.createNew (); 
cat1.makeSound (); // 喵喵喵

这种方法的好处是,容易理解,结构清晰优雅,符合传统的"面向对象编程"的构造,因此可以方便地部署下面的特性。

3. 2 继承

让一个类继承另一个类,实现起来很方便。只要在前者的 createNew ()方法中,调用后者的 createNew ()方法即可。

先定义一个 Animal 类。

var Animal = { 
createNew: function (){ 
var animal = {}; 
animal.sleep = function (){ alert ("睡懒觉"); }; 
return animal; 
} 
};

然后,在 Cat 的 createNew ()方法中,调用 Animal 的 createNew ()方法。

var Cat = { 
createNew: function (){ 
var cat = Animal.createNew (); 
cat.name = "大毛"; 
cat.makeSound = function (){ alert ("喵喵喵"); }; 
return cat; 
} 
};

这样得到的 Cat 实例,就会同时继承 Cat 类和 Animal 类。

var cat1 = Cat.createNew (); 
cat1.sleep (); // 睡懒觉

3. 3 私有属性和私有方法

在 createNew ()方法中,只要不是定义在 cat 对象上的方法和属性,都是私有的。

var Cat = { 
createNew: function (){ 
var cat = {}; 
var sound = "喵喵喵"; 
cat.makeSound = function (){ alert (sound); }; 
return cat; 
} 
};

上例的内部变量 sound,外部无法读取,只有通过 cat 的公有方法 makeSound ()来读取。

var cat1 = Cat.createNew (); 
alert (cat1.sound); // undefined

3. 4 数据共享

有时候,我们需要所有实例对象,能够读写同一项内部数据。这个时候,只要把这个内部数据,封装在类对象的里面、createNew ()方法的外面即可。

var Cat = { 
sound : "喵喵喵", 
createNew: function (){ 
var cat = {}; 
cat.makeSound = function (){ alert (Cat.sound); }; 
cat.changeSound = function (x){ Cat.sound = x; }; 
return cat; 
} 
};

然后,生成两个实例对象:

var cat1 = Cat.createNew (); 
var cat2 = Cat.createNew (); 
cat1.makeSound (); // 喵喵喵

这时,如果有一个实例对象,修改了共享的数据,另一个实例对象也会受到影响。

cat2.changeSound ("啦啦啦"); 
cat1.makeSound (); // 啦啦啦
Javascript 相关文章推荐
Js+Dhtml:WEB程序员简易开发工具包(预先体验版)
Nov 07 Javascript
用js重建星际争霸
Dec 22 Javascript
ExtJs使用IFrame的实现代码
Mar 24 Javascript
JavaScript中OnLoad几种使用方法
Dec 15 Javascript
JavaScript插件化开发教程 (一)
Jan 27 Javascript
Javascript中setTimeOut和setInterval的定时器用法
Jun 12 Javascript
浅谈JavaScript的push(),pop(),concat()方法
Jun 03 Javascript
js提示框替代系统alert,自动关闭alert对话框的实现方法
Nov 07 Javascript
Bootstrap + AngularJS 实现简单的数据过滤字符查找功能
Jul 27 Javascript
node.js使用免费的阿里云ip查询获取ip所在地【推荐】
Sep 03 Javascript
详解vue-property-decorator使用手册
Jul 29 Javascript
原生js实现的观察者和订阅者模式简单示例
Apr 18 Javascript
基于jQuery的获取标签名的代码
Jul 16 #Javascript
写自已的js类库需要的核心代码
Jul 16 #Javascript
js不完美解决click和dblclick事件冲突问题
Jul 16 #Javascript
js jquery数组介绍
Jul 15 #Javascript
js限制文本框只能输入数字(正则表达式)
Jul 15 #Javascript
基于jquery的图片幻灯展示源码
Jul 15 #Javascript
20款非常优秀的 jQuery 工具提示插件 推荐
Jul 15 #Javascript
You might like
请php正则走开
2008/03/15 PHP
php统计文章排行示例
2014/03/04 PHP
php中使用gd库实现下载网页中所有图片
2015/05/12 PHP
功能强大的php文件上传类
2016/08/29 PHP
让FireFox支持innerText的实现代码
2009/12/01 Javascript
JS获取浏览器版本及名称实现函数
2013/04/02 Javascript
js中cookie的添加、取值、删除示例代码
2013/10/21 Javascript
利用浏览器全屏api实现js全屏
2014/01/16 Javascript
jQuery选择器源码解读(四):tokenize方法的Expr.preFilter
2015/03/31 Javascript
JavaScript实现点击文字切换登录窗口的方法
2015/05/11 Javascript
使用Node.js配合Nginx实现高负载网络
2015/06/28 Javascript
javascript中的previousSibling和nextSibling的正确用法
2015/09/16 Javascript
原生JavaScript实现异步多文件上传
2015/12/02 Javascript
JS+CSS3模拟溢出滚动效果
2016/08/12 Javascript
js调用屏幕宽度的简单方法
2016/11/14 Javascript
angular和BootStrap3实现购物车功能
2017/01/25 Javascript
NodeJS设计模式总结【单例模式,适配器模式,装饰模式,观察者模式】
2017/09/06 NodeJs
基于JS实现简单滑块拼图游戏
2019/10/12 Javascript
使用 Github Actions 自动部署 Angular 应用到 Github Pages的方法
2020/07/20 Javascript
Python中多线程thread与threading的实现方法
2014/08/18 Python
github配置使用指南
2014/11/18 Python
python3抓取中文网页的方法
2015/07/28 Python
Python模块结构与布局操作方法实例分析
2017/07/24 Python
python+pyqt实现右下角弹出框
2017/10/26 Python
Python编译为二进制so可执行文件实例
2019/12/23 Python
python用opencv完成图像分割并进行目标物的提取
2020/05/25 Python
纯CSS3+DIV实现小三角形边框效果的示例代码
2020/08/03 HTML / CSS
HTML5 Canvas+JS控制电脑或手机上的摄像头实例
2014/05/03 HTML / CSS
HTML5拖拉上传文件的简单实例
2017/01/11 HTML / CSS
经典导游欢迎词大全
2014/01/16 职场文书
2014年应届大学生毕业自我鉴定
2014/01/31 职场文书
高中历史教学反思
2014/02/08 职场文书
岗位聘任书范文
2014/03/29 职场文书
高中学生评语大全
2014/04/25 职场文书
四风问题对照检查材料思想汇报
2014/10/07 职场文书
分析设计模式之模板方法Java实现
2021/06/23 Java/Android