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 相关文章推荐
jquery中输入验证中一个不错的效果
Aug 21 Javascript
jQuery bxCarousel实现图片滚动切换效果示例代码
May 15 Javascript
node.js中的fs.truncateSync方法使用说明
Dec 15 Javascript
JavaScript中连接操作Oracle数据库实例
Apr 02 Javascript
JavaScript时间操作之年月日星期级联操作
Jan 15 Javascript
用AngularJS来实现监察表单按钮的禁用效果
Nov 02 Javascript
JavaScript中最常见的三个面试题解析
Mar 04 Javascript
浅谈Angular 中何时取消订阅
Nov 22 Javascript
微信小程序实现美团菜单
Jun 06 Javascript
jQuery实现列表的增加和删除功能
Jun 14 jQuery
JavaScript引用类型Array实例分析
Jul 24 Javascript
微信小程序实现的picker多级联动功能示例
May 23 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
在mysql数据库原有字段后增加新内容
2009/11/26 PHP
php 过滤器实现代码
2010/08/09 PHP
PHP实现自动登入google play下载app report的方法
2014/09/23 PHP
PHP检查文件是否存在,不存在自动创建及读取文件内容操作示例
2020/01/23 PHP
javascript动画之圆形运动,环绕鼠标运动作小球
2010/07/20 Javascript
jcarousellite.js 基于Jquery的图片无缝滚动插件
2010/12/30 Javascript
JavaScript中的细节分析
2012/06/30 Javascript
JS 对输入框进行限制(常用的都有)
2013/07/30 Javascript
利用jQuery简单实现产品展示图片左右滚动功能(示例代码)
2014/01/02 Javascript
jquery datatable后台封装数据示例代码
2014/08/07 Javascript
jQuery实现简单二级下拉菜单
2015/04/12 Javascript
使用jQuery实现更改默认alert框体
2015/04/13 Javascript
javascript实现倒计时跳转页面
2016/01/17 Javascript
Vue.js每天必学之指令系统与自定义指令
2016/09/07 Javascript
使用Javascript监控前端相关数据的代码
2016/10/27 Javascript
js CSS3实现卡牌旋转切换效果
2017/07/04 Javascript
使用prop解决一个checkbox选中后再次选中失效的问题
2017/07/05 Javascript
Angular5.0 子组件通过service传递值给父组件的方法
2018/07/13 Javascript
jQuery实现导航样式布局操作示例【可自定义样式布局】
2018/07/24 jQuery
layui radio性别单选框赋值方法
2018/08/15 Javascript
js使用Promise实现简单的Ajax缓存
2018/11/14 Javascript
NVM安装nodejs的方法实用步骤
2019/01/16 NodeJs
vue中格式化时间过滤器代码实例
2019/04/17 Javascript
JavaScript对象访问器Getter及Setter原理解析
2020/12/08 Javascript
[07:54]DOTA2-DPC中国联赛 正赛 iG vs VG 选手采访
2021/03/11 DOTA
python统计文本字符串里单词出现频率的方法
2015/05/26 Python
如何利用Python开发一个简单的猜数字游戏
2019/09/22 Python
python opencv 实现对图像边缘扩充
2020/01/19 Python
CSS3实现水平居中、垂直居中、水平垂直居中的实例代码
2020/02/27 HTML / CSS
HTML5 canvas实现雪花飘落特效
2016/03/08 HTML / CSS
Windows和Linux动态库应用异同
2016/04/17 面试题
餐厅经理岗位职责和岗位目标
2014/02/13 职场文书
六五普法规划实施方案
2014/03/21 职场文书
酒店管理求职信范文
2014/04/06 职场文书
中韩经贸翻译专业大学生职业生涯规划范文
2014/09/18 职场文书
全陪导游词开场白
2015/05/29 职场文书