javascript 将共享属性迁移到原型中去的实现方法


Posted in Javascript onAugust 31, 2016

当我们用一个构造函数创建对象时,其属性就会被添加到this中去。并且被添加到this中的属性实际上不会随着实体发生改变,这时,我们这种做法显得会很没有效率。例如:

function her(){
  this.name = 'Anna';
}

这意味着每次我们new her()创建一个实例对象的时候都会生成一个全新的name属性,并在内存中拥有属于该属性自己的存储空间。而事实上,我们可以将name属性添加到原型上去,这样一来所有实例都可以共享这个name属性了:

function her(){}
her.prototype.name = 'Anna';

这样一来,我们再用new her()创建对象的时候,name属性就不再是新对象的私有属性了,而是被添加到该对象的原型中去了。虽然这种做法会很有效率,但这也是针对实例对象中的不可变属性而言的,这是一定的不然的话改一下这个属性,所有被创建的新对象的这个属性都会被改变,这可不是我们想要的啊~~~。对象的公有属性尤其适合这种方法。

下面,我们来改进以前的一个例子:

function her(){};
her.prototype.name = 'Anna';
her.prototype.toString = function(){
  return this.name;
}

function his(){};
his.prototype = new her();
his.prototype.constructor = his;
his.prototype.sex = 'women';

如您所见,通常我们在进行原型对象扩展之前,我们现完成了相关继承工作的构建,否则his.prototype中后续新的属性方法有可能会抹掉继承来的东西。

function child(f, m){
  this.eat = f;
  this.don = m;
}
child.prototype = new his();
child.prototype.constructor = child;
child.prototype.name = 'Jok';
child.prototype.fun = function(){
  return this.eat + this.don
}

如您所见,实际上调用toString()这个方法的区别仅仅在于幕后的少量操作。主要区别也就是属性,方法的查找工作将更多地发生在her.prototype中。

以上这篇javascript 将共享属性迁移到原型中去的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
5个javascript的数字格式化函数分享
Dec 07 Javascript
js简单实现根据身份证号码识别性别年龄生日
Nov 29 Javascript
完美兼容各大浏览器获取HTTP_REFERER方法总结
Jun 24 Javascript
JavaScript分析、压缩工具JavaScript Analyser
Dec 31 Javascript
基于JavaScript实现手机短信按钮倒计时(超简单)
Dec 30 Javascript
JavaScript中各种引用类型的常用操作方法小结
May 05 Javascript
JavaScript仿淘宝页面图片滚动加载及刷新回顶部的方法解析
May 24 Javascript
layui 表格的属性的显示转换方法
Aug 14 Javascript
Vue实现table上下移动功能示例
Feb 21 Javascript
vuex + keep-alive实现tab标签页面缓存功能
Oct 17 Javascript
在vue中使用回调函数,this调用无效的解决
Aug 11 Javascript
原生js实现移动小球(碰撞检测)
Dec 17 Javascript
使用vue编写一个点击数字计时小游戏
Aug 31 #Javascript
原生js实现tab选项卡切换
Mar 23 #Javascript
jquery的checkbox,radio,select等方法小结
Aug 30 #Javascript
Javascript日期格式化format函数的使用方法
Aug 30 #Javascript
浅析ES6的八进制与二进制整数字面量
Aug 30 #Javascript
AngularJS轻松实现双击排序的功能
Aug 30 #Javascript
jQuery simpleModal插件的使用介绍
Aug 30 #Javascript
You might like
如何在PHP中使用Oracle数据库(2)
2006/10/09 PHP
smarty 原来也不过如此~~呵呵
2006/11/25 PHP
php下封装较好的数字分页方法
2010/11/23 PHP
PHP删除指定目录中的所有目录及文件的方法
2015/02/26 PHP
PHP查找与搜索数组元素方法总结
2015/06/12 PHP
php验证码实现代码(3种)
2015/09/07 PHP
一页面多XMLHttpRequest对象
2007/01/22 Javascript
javascript 面向对象编程 function也是类
2009/09/17 Javascript
ExtJS Window 最小化的一种方法
2009/11/18 Javascript
js实现input密码框提示信息的方法(附html5实现方法)
2016/01/14 Javascript
Bootstrap组件系列之福利篇几款好用的组件(推荐二)
2016/07/12 Javascript
js接收并转化Java中的数组对象的方法
2016/08/11 Javascript
JavaScript封装的常用工具类库bee.js用法详解【经典类库】
2018/09/03 Javascript
jQuery内容过滤选择器与子元素过滤选择器用法实例分析
2019/02/20 jQuery
小程序识别身份证,银行卡,营业执照,驾照的实现
2019/11/05 Javascript
JS+HTML5本地存储Localstorage实现注册登录及验证功能示例
2020/02/10 Javascript
详解element上传组件before-remove钩子问题解决
2020/04/08 Javascript
[57:24]LGD vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
windows下安装python paramiko模块的代码
2013/02/10 Python
python 排列组合之itertools
2013/03/20 Python
python使用chardet判断字符串编码的方法
2015/03/13 Python
Python实现在线暴力破解邮箱账号密码功能示例【测试可用】
2017/09/06 Python
Python实现将照片变成卡通图片的方法【基于opencv】
2018/01/17 Python
Python import与from import使用及区别介绍
2018/09/06 Python
tensorflow使用CNN分析mnist手写体数字数据集
2020/06/17 Python
英国领先的珍珠首饰品牌:Orchira
2016/09/11 全球购物
以实惠的价格提供高品质的时尚:Newchic
2018/01/18 全球购物
Desigual英国官网:在线购买原创服装
2018/03/09 全球购物
教你怎样写好自我评价
2013/10/05 职场文书
预备党员入党自我评价范文
2014/03/10 职场文书
最美护士演讲稿
2014/08/27 职场文书
2014国庆节国旗下演讲稿(精选版)
2014/09/26 职场文书
学生检讨书
2015/01/27 职场文书
公司财务部岗位职责
2015/04/14 职场文书
搞笑欢迎词大全
2015/09/30 职场文书
2015年秋学期教研工作总结
2015/10/14 职场文书