js创建对象几种方式的优缺点对比


Posted in Javascript onSeptember 28, 2016

比较js中创建对象的几种方式

1.工厂模式

function createObj(name, sex){
    var obj = new Object();
    obj.name = name;
    obj.sex = sex;
    obj.sayName = function(){
      alert(this.name);
    }
    return obj;
  }

var person = createObj('Tom', 'man');

缺点:①无法确定对象的类型(因为都是Object)。

 ②创建的多个对象之间没有关联。

 2.构造函数

function createObj(name, sex){
    this.name = name;
    this.sex = sex;
    this.sayName = function(){
      alert(this.name);
    }
  }

  var person = new createObj('Tom', 'man');

缺点:①多个实例重复创建方法,无法共享。

   ②多个实例都有sayName方法,但均不是同一个Function的实例。 

3.原型方法

function createObj(){}

  createObj.prototype.name = 'Tom';
  createObj.prototype.sex = 'man';
  createObj.prototype.sayName = function(){
    alert(this.name);
  }

var person = new createObj();

缺点:①无法传入参数,不能初始化属性值。

   ②如果包含引用类型的值时,改变其中一个实例的值,则会在所有实例中体现。 

4.组合式(构造函数+原型方法)推荐使用

function createObj(name, sex){
  this.name = name;
  this.sex = sex;
 }
 createObj.prototype.sayName = function(){
  alert(this.name);
 }

 var person = new createObj('Tom', 'man');

优点:构造函数共享实例属性,原型共享方法和想要共享的属性。可传递参数,初始化属性值。 

5.动态原型方法

function createObj(name, sex){
  this.name = name;
  this.sex = sex;
  if(typeof this.sayName != 'function'){
   createObj.prototype.sayName = function(){
    alert(this.name);
   }
  }
 }

 var person = new createObj('Tom', 'man');

说明:if语句中只会调用一次,就是在碰到第一个实例调用方法时会执。此后所有实例都会共享该方法。在动态原型方法下,不能使用对象字面量重写原型。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一个对于Array的简单扩展
Oct 03 Javascript
JavaScript中实现异步编程模式的4种方法
Sep 24 Javascript
javascript十六进制及二进制转化的方法
May 06 Javascript
jQuery实现带水平滑杆的焦点图动画插件
Mar 08 Javascript
基于jQuery的Web上传插件Uploadify使用示例
May 19 Javascript
Bootstrap警告(Alerts)的实现方法
Mar 22 Javascript
vue2.0实现移动端的输入框实时检索更新列表功能
May 08 Javascript
async/await地狱该如何避免详解
May 10 Javascript
JS计算斐波拉切代码实例
Sep 12 Javascript
原生js实现随机点名功能
Nov 05 Javascript
vue获取data数据改变前后的值方法
Nov 07 Javascript
原生js实现自定义滚动条
Jan 20 Javascript
AngularJS表单验证中级篇(3)
Sep 28 #Javascript
微信公众号 客服接口的开发实例详解
Sep 28 #Javascript
jQuery解析XML 详解及方法总结
Sep 28 #Javascript
iOS和Android用同一个二维码实现跳转下载链接的方法
Sep 28 #Javascript
微信小程序 实例应用(记账)详解
Sep 28 #Javascript
JavaScript 闭包详细介绍
Sep 28 #Javascript
Bootstrapvalidator校验、校验清除重置的实现代码(推荐)
Sep 28 #Javascript
You might like
简单采集了yahoo的一些数据
2007/02/14 PHP
ubuntu 编译安装php 5.3.3+memcache的方法
2010/08/05 PHP
php实现图片添加水印功能
2014/02/13 PHP
php二维数组转成字符串示例
2014/02/17 PHP
javascript String 对象
2008/04/25 Javascript
jquery load()在firefox(火狐)下显示不正常的解决方法
2011/04/05 Javascript
解析js原生方法创建表格效率测试
2013/07/08 Javascript
escape函数解决js中ajax传递中文出现乱码问题
2014/10/30 Javascript
js实现仿百度瀑布流的方法
2015/02/05 Javascript
全面解析Bootstrap图片轮播效果
2015/12/03 Javascript
js实现分割上传大文件
2016/03/09 Javascript
AngularJS中的过滤器filter用法完全解析
2016/04/22 Javascript
AngularJS中关于ng-class指令的几种实现方式详解
2016/09/17 Javascript
jquery 实现回车登录详解及实例代码
2016/10/23 Javascript
pc加载更多功能和移动端下拉刷新加载数据
2016/11/07 Javascript
微信小程序 数据交互与渲染实例详解
2017/01/21 Javascript
sublime text配置node.js调试(图文教程)
2017/11/23 Javascript
node将geojson转shp返回给前端的实现方法
2019/05/29 Javascript
关于引入vue.js 文件的知识点总结
2020/01/28 Javascript
nodeJS与MySQL实现分页数据以及倒序数据
2020/06/05 NodeJs
[07:59]2014DOTA2叨叨刀塔 林熊猫称被邀请赛现场盛况震撼
2014/07/21 DOTA
python 接口_从协议到抽象基类详解
2017/08/24 Python
网红编程语言Python将纳入高考你怎么看?
2018/06/07 Python
python获取微信企业号打卡数据并生成windows计划任务
2019/04/30 Python
Python的matplotlib绘图如何修改背景颜色的实现
2019/07/16 Python
OpenCV+face++实现实时人脸识别解锁功能
2019/08/28 Python
python路径的写法及目录的获取方式
2019/12/26 Python
Python基于numpy模块实现回归预测
2020/05/14 Python
基于Python制作一副扑克牌过程详解
2020/10/19 Python
Bose美国官网:购买Bose耳机和音箱
2019/03/10 全球购物
全球速卖通俄罗斯站:AliExpress俄罗斯
2019/06/17 全球购物
公司庆典邀请函范文
2014/01/13 职场文书
幼儿教师辞职信
2015/02/27 职场文书
初三数学教学反思
2016/02/17 职场文书
优秀范文:读《红岩》有感3篇
2019/10/14 职场文书
Redis 操作多个数据库的配置的方法实现
2022/03/23 Redis