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 相关文章推荐
层序遍历在ExtJs的TreePanel中的应用
Oct 16 Javascript
Jquery Ajax 学习实例2 向页面发出请求 返回JSon格式数据
Mar 15 Javascript
JavaScript随机排序(随即出牌)
Sep 17 Javascript
jQuery1.6 类型判断实现代码
Sep 01 Javascript
jquery插件qrcode在线生成二维码
Apr 26 Javascript
jQuery实现页面内锚点平滑跳转特效的方法总结
May 11 Javascript
javascript中的正则表达式使用详解
Aug 30 Javascript
从零开始学习Node.js系列教程一:http get和post用法分析
Apr 13 Javascript
使用watch监听路由变化和watch监听对象的实例
Feb 24 Javascript
angular json对象push到数组中的方法
Feb 27 Javascript
jquery ajaxfileuplod 上传文件 essyui laoding 效果【防止重复上传文件】
May 26 jQuery
JavaScript实现抖音罗盘时钟
Oct 11 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读注册表
2006/10/09 PHP
PHP图片处理之使用imagecopyresampled函数实现图片缩放例子
2014/11/19 PHP
Thinkphp5.0框架使用模型Model的获取器、修改器、软删除数据操作示例
2019/10/11 PHP
使用jQuery向asp.net Mvc传递复杂json数据-ModelBinder篇
2010/05/07 Javascript
JavaScript中也使用$美元符号来代替document.getElementById
2010/06/19 Javascript
IE下双击checkbox反应延迟问题的解决方法
2014/03/27 Javascript
js取模(求余数)隔行变色
2014/05/15 Javascript
JavaScript设计模式之代理模式介绍
2014/12/28 Javascript
再次谈论React.js实现原生js拖拽效果引起的一系列问题
2016/04/03 Javascript
jQuery UI制作选项卡(tabs)
2016/12/13 Javascript
jquery实现输入框实时输入触发事件代码
2016/12/21 Javascript
解决layui中table异步数据请求不支持自定义返回数据格式的问题
2018/08/19 Javascript
vue通过滚动行为实现从列表到详情,返回列表原位置的方法
2018/08/31 Javascript
React实现全局组件的Toast轻提示效果
2018/09/21 Javascript
微信小程序如何调用图片接口API并居中显示
2019/06/29 Javascript
Vue中watch、computed、updated三者的区别及用法
2020/07/27 Javascript
vue实现选中效果
2020/10/07 Javascript
Vue实现摇一摇功能(兼容ios13.3以上)
2021/01/26 Vue.js
python基础教程之udp端口扫描
2014/02/10 Python
python使用正则表达式的search()函数实现指定位置搜索功能
2017/11/10 Python
python实现日常记账本小程序
2018/03/10 Python
浅谈python下tiff图像的读取和保存方法
2018/12/04 Python
Python  word实现读取及导出代码解析
2020/07/09 Python
pycharm激活方法到2099年(激活流程)
2020/09/22 Python
html5的canvas元素使用方法介绍(画矩形、画折线、圆形)
2014/04/14 HTML / CSS
腾讯技术类校园招聘笔试试题
2014/05/06 面试题
Final类有什么特点
2012/04/25 面试题
捐款倡议书
2014/04/14 职场文书
消防标语大全
2014/06/07 职场文书
参赛口号
2014/06/16 职场文书
2014审计局领导班子民主生活会对照检查材料思想汇报
2014/09/20 职场文书
婚礼答谢礼品
2015/01/20 职场文书
八年级数学教学反思
2016/02/17 职场文书
Nginx Rewrite使用场景及配置方法解析
2021/04/01 Servers
python requests模块的使用示例
2021/04/07 Python
浅谈mysql哪些情况会导致索引失效
2021/11/20 MySQL