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 相关文章推荐
不要在cookie中使用特殊字符的原因分析
Jul 13 Javascript
javascript跨域刷新实现代码
Jan 01 Javascript
js 操作select和option常用代码整理
Dec 13 Javascript
node.js中的fs.readdirSync方法使用说明
Dec 17 Javascript
PHP捕捉异常中断的方法
Oct 24 Javascript
JS原生带小白点轮播图实例讲解
Jul 22 Javascript
微信小程序实现action-sheet弹出底部菜单功能【附源码下载】
Dec 09 Javascript
浅谈针对Vue相同路由不同参数的刷新问题
Sep 29 Javascript
element-ui上传一张图片后隐藏上传按钮功能
May 22 Javascript
微信小程序webview与h5通过postMessage实现实时通讯的实现
Aug 20 Javascript
webpack 如何同时输出压缩和未压缩的文件的实现步骤
Jun 05 Javascript
解决removeEventListener 无法清除监听的问题
Oct 30 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
关于拼配咖啡,你要知道
2021/03/03 咖啡文化
php实现微信发红包功能
2018/07/13 PHP
thinkPHP5.1框架路由::get、post请求简单用法示例
2019/05/06 PHP
Yii2框架加载css和js文件的方法分析
2019/05/25 PHP
ThinkPHP5.1框架数据库链接和增删改查操作示例
2019/08/03 PHP
用javascript实现读取txt文档的脚本
2007/07/20 Javascript
firefox插件Firebug的使用教程
2010/01/02 Javascript
js单独获取一个checkbox看其是否被选中
2014/09/22 Javascript
Javascript学习笔记之相等符号与严格相等符号
2014/11/23 Javascript
jQuery遍历DOM元素与节点方法详解
2016/04/14 Javascript
实用jquery操作表单元素的简单代码
2016/07/04 Javascript
AngularJS ng-blur 指令详解及简单实例
2016/07/30 Javascript
JS访问DOM节点方法详解
2016/11/29 Javascript
提高Web性能的前端优化技巧总结
2017/02/27 Javascript
iscroll-probe实现下拉刷新和下拉加载效果
2017/06/28 Javascript
vue设置全局访问接口API地址操作
2020/08/14 Javascript
Vue中使用Echarts仪表盘展示实时数据的实现
2020/11/01 Javascript
python实现bitmap数据结构详解
2014/02/17 Python
举例介绍Python中的25个隐藏特性
2015/03/30 Python
python实现对一个完整url进行分割的方法
2015/04/29 Python
Python建立Map写Excel表实例解析
2018/01/17 Python
Python实现对一个函数应用多个装饰器的方法示例
2018/02/09 Python
pycharm运行出现ImportError:No module named的解决方法
2018/10/13 Python
简单了解django缓存方式及配置
2019/07/19 Python
kafka监控获取指定topic的消息总量示例
2019/12/23 Python
python几种常用功能实现代码实例
2019/12/25 Python
python 解决Windows平台上路径有空格的问题
2020/11/10 Python
如何用用Python将地址标记在地图上
2021/02/07 Python
CSS图片翻转动画技术详解(IE也实现了)
2014/04/03 HTML / CSS
美国沙龙美发产品购物网站:Hair.com by L’Oreal
2020/11/09 全球购物
开业庆典邀请函
2014/01/08 职场文书
制药工程专业个人求职自荐信
2014/01/25 职场文书
党员大会主持词
2014/04/02 职场文书
校庆标语集锦
2014/06/25 职场文书
开国大典观后感
2015/06/04 职场文书
Python实现拼音转换
2021/06/07 Python