js中使用使用原型(prototype)定义方法的好处详解


Posted in Javascript onJuly 04, 2016

经常在前端面试或是和其他同行沟通是,在谈到构造在JS定义构造函数的方法是最好使用原型的方式:将方法定义到构造方法的prototype上,这样的好处是,通过该构造函数生成的实例所拥有的方法都是指向一个函数的索引,这样可以节省内存。

当然,这种说法没有任何问题,只是在实现上,并非只有使用prototype的方式才能达到这样的效果,我们可以将方法以函数的形式定义在构造函数之外,然后在构造函数中通过this.method = method的方式,这样生成的实例的方法也都通过索引指向一个函数,具体如下:

// 不使用原型定义方法:
(function() {
  function Constractor() {
    this.method1 = method1;
    this.method2 = method2;
  }

  function method1() {
  }

  function method2() {
  }
})();

一般使用原型定义时代码如下:

(function () {
  function Constractor() {
  }

  Constactor.prototype = {
    method1: function() {
    },
    method2: function() {
    }
  };
  
  // 或者
  Constactor.prototype.method1 = function() {
  };
  Constactor.prototype.method2 = function() {
  };

})();

理论和实现都没有什么高深的,只是为了达到同样的目的,可以通过不同的途径,只是此种方式在使用instanceOf运算符来判断继承关系时就不奏效了。

以上这篇js中使用使用原型(prototype)定义方法的好处详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
让IE6支持min-width和max-width的方法
Jun 25 Javascript
改变文件域的样式实现思路同时兼容ie、firefox
Oct 23 Javascript
js实现div的切换特效上一个下一个
Feb 11 Javascript
学习JavaScript设计模式(接口)
Nov 26 Javascript
全面解析Bootstrap弹窗的实现方法
Dec 01 Javascript
JavaScript的Backbone.js框架的一些使用建议整理
Feb 14 Javascript
JQuery学习总结【二】
Dec 01 Javascript
canvas实现图像布局填充功能
Feb 06 Javascript
前端主流框架vue学习笔记第一篇
Jul 26 Javascript
解决canvas画布使用fillRect()时高度出现双倍效果的问题
Aug 03 Javascript
如何手动实现es5中的bind方法详解
Dec 07 Javascript
基于vue和bootstrap实现简单留言板功能
May 30 Javascript
js与jquery正则验证电子邮箱、手机号、邮政编码的方法
Jul 04 #Javascript
浅谈js构造函数的方法与原型prototype
Jul 04 #Javascript
全面了解js中的script标签
Jul 04 #Javascript
jQuery基础_入门必看知识点
Jul 04 #Javascript
把普通对象转换成json格式的对象的简单实例
Jul 04 #Javascript
JS实现n秒后自动跳转的两种方法
Nov 30 #Javascript
js输出数据精确到小数点后n位代码
Jul 02 #Javascript
You might like
PHP的历史和优缺点
2006/10/09 PHP
asp和php下textarea提交大量数据发生丢失的解决方法
2008/01/20 PHP
php数组函数序列之array_combine() - 数组合并函数使用说明
2011/10/29 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
PHP用swoole+websocket和redis实现web一对一聊天
2019/11/05 PHP
jQuery.event兼容各浏览器的event详细解析
2013/12/18 Javascript
iframe父页面获取子页面参数的方法
2014/02/21 Javascript
JS判断客户端是手机还是PC的2个代码
2014/04/12 Javascript
node.js中的path.extname方法使用说明
2014/12/09 Javascript
JavaScript实现select添加option
2015/07/03 Javascript
浏览器检测JS代码(兼容目前各大主流浏览器)
2016/02/21 Javascript
JavaScript的函数式编程基础指南
2016/03/19 Javascript
AngularJS ng-controller 指令简单实例
2016/08/01 Javascript
javascript基于原型链的继承及call和apply函数用法分析
2016/12/15 Javascript
详解webpack进阶之插件篇
2017/07/06 Javascript
node实现定时发送邮件的示例代码
2017/08/26 Javascript
详解如何快速配置webpack多入口脚手架
2018/12/28 Javascript
jQuery实现动态添加和删除input框代码实例
2019/03/29 jQuery
Python中用pycurl监控http响应时间脚本分享
2015/02/02 Python
在Python的Django框架中simple-todo工具的简单使用
2015/05/30 Python
Django中的“惰性翻译”方法的相关使用
2015/07/27 Python
Python出现segfault错误解决方法
2016/04/16 Python
详解python中的Turtle函数库
2018/11/19 Python
css3 position fixed固定居中问题解决方案
2014/08/19 HTML / CSS
美国猫狗药物和用品网站:PetCareRx
2017/01/05 全球购物
Sunglasses Shop荷兰站:英国最大的太阳镜独立在线零售商和供应商
2017/01/08 全球购物
英国休闲奢华的缩影:Crew Clothing
2019/05/05 全球购物
班主任工作年限证明
2014/01/12 职场文书
教师节商场活动方案
2014/02/13 职场文书
《猴子种树》教学反思
2014/02/14 职场文书
学院党的群众路线教育实践活动第一阶段情况汇报
2014/10/25 职场文书
业务员辞职信范文
2015/03/02 职场文书
求职简历自荐信怎么写
2015/03/26 职场文书
酒店工程部主管岗位职责
2015/04/16 职场文书
常用的MongoDB查询语句的示例代码
2021/07/25 MongoDB
CSS实现五种常用的2D转换
2021/12/06 HTML / CSS