极简主义法编写JavaScript类


Posted in Javascript onNovember 02, 2017

这个所谓的"极简主义法"是荷兰程序员Gabor de Mooij提出来的,这种方法不使用this和prototype,代码部署起来非常简单,这大概也是它被叫做"极简主义法"的原因。下面就介绍如何使用极简主义法完成JavaScript的封装和继承

1. 封装

首先,它也是用一个对象模拟"类"。在这个类里面,定义一个构造函数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(); // 喵喵喵

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

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实例,就会继承Animal类。

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

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

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(); // 啦啦啦

 

极简主义,看起来很美好,但是也有缺点,首先是不能使用instanceof 判断对象所属的类,"cat1 instanceof Cat"无法通过,另外,极简主义虽然摆脱了使用原型链的缺点(属性不能私有、创建、继承对象不够直观),但也暴露了没用原型链的弊端:每一次生成一个实例,都必须为重复的内容,多占用一些内存。

总结

以上所述是小编给大家介绍的极简主义法编写JavaScript类,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
采用CSS和JS,刚好我最近有个站点要用到下拉菜单!
Jun 26 Javascript
jqGrid增加时--判断开始日期与结束日期(实例解析)
Nov 08 Javascript
js实现头像图片切割缩放及无刷新上传图片的方法
Jul 17 Javascript
纯jquery实现模仿淘宝购物车结算
Aug 20 Javascript
AngularJS 遇到的小坑与技巧小结
Jun 07 Javascript
JS实现获取当前URL和来源URL的方法
Aug 24 Javascript
vue.js全局API之nextTick全面解析
Jul 07 Javascript
JS中利用swiper实现3d翻转幻灯片实例代码
Aug 25 Javascript
浅析JS抽象工厂模式
Dec 14 Javascript
javascript标准库(js的标准内置对象)总结
May 26 Javascript
基于vue写一个全局Message组件的实现
Aug 15 Javascript
详解Vue3使用axios的配置教程
Apr 29 Vue.js
利用nvm管理多个版本的node.js与npm详解
Nov 02 #Javascript
JavaScript屏蔽Backspace键的实现代码
Nov 02 #Javascript
Vue源码学习之初始化模块init.js解析
Nov 02 #Javascript
为输入框加入数字js校验代码分享
Nov 02 #Javascript
详谈js中标准for循环与foreach(for in)的区别
Nov 02 #Javascript
使用 Node.js 模拟滑动拼图验证码操作的示例代码
Nov 02 #Javascript
基于JavaScript+HTML5 实现打地鼠小游戏逻辑流程图文详解(附完整代码)
Nov 02 #Javascript
You might like
如何使用PHP中的字符串函数
2006/10/09 PHP
浅析关于PHP位运算的简单权限设计
2013/06/30 PHP
php+ajax实现图片文件上传功能实例
2014/06/17 PHP
你应该知道PHP浮点数知识
2015/05/13 PHP
在WordPress中使用wp_count_posts函数来统计文章数量
2016/01/05 PHP
php获取ajax的headers方法与内容实例
2017/12/27 PHP
PHP设计模式之数据访问对象模式(DAO)原理与用法实例分析
2019/12/12 PHP
javascript编程起步(第六课)
2007/01/10 Javascript
一段非常简单的js判断浏览器的内核
2014/08/17 Javascript
jQuery中noconflict函数的实现原理分解
2015/02/03 Javascript
jQuery插件实现文件上传功能(支持拖拽)
2020/08/27 Javascript
angularJS 发起$http.post和$http.get请求的实现方法
2017/05/18 Javascript
easyui-datagrid开发实践(总结)
2017/08/02 Javascript
ligerUI---ListBox(列表框可移动的实例)
2017/11/28 Javascript
开发Vue树形组件的示例代码
2017/12/21 Javascript
微信小程序非跳转式组件授权登录的方法示例
2019/05/22 Javascript
Vue2.x通用编辑组件的封装及应用详解
2019/05/28 Javascript
小程序如何获取多个formId实现详解
2019/09/20 Javascript
vue跳转同一个组件,参数不同,页面接收值只接收一次的解决方法
2019/11/05 Javascript
Element PageHeader页头的使用方法
2020/07/26 Javascript
vue-路由精讲 二级路由和三级路由的作用
2020/08/06 Javascript
[01:55]2014DOTA2国际邀请赛快报:国土生病 紧急去医院治疗
2014/07/10 DOTA
Python中使用platform模块获取系统信息的用法教程
2016/07/08 Python
python中requests小技巧
2017/05/10 Python
python字符串的方法与操作大全
2018/01/30 Python
pandas object格式转float64格式的方法
2018/04/10 Python
python批量处理文件或文件夹
2020/07/28 Python
python使用nibabel和sitk读取保存nii.gz文件实例
2020/07/01 Python
python MD5加密的示例
2020/10/19 Python
高档奢华时装在线目的地:FORWARD by elyse walker
2017/10/16 全球购物
UNIONBAY官网:美国青少年服装品牌
2019/03/26 全球购物
优秀高中生事迹材料
2014/02/11 职场文书
小学班主任培训方案
2014/06/04 职场文书
2015年机关纠风工作总结
2015/05/15 职场文书
党组织关系的介绍信模板
2019/06/21 职场文书
Python数据分析之绘图和可视化详解
2021/06/02 Python