js创建对象的几种常用方式小结(推荐)


Posted in Javascript onOctober 24, 2010

第一种模式:工厂方式

var lev=function(){ 
return "三水点靠木"; 
}; 
function Parent(){ 
var Child = new Object(); 
Child.name="脚本"; 
Child.age="4"; 
Child.lev=lev; 
return Child; 
}; 
var x = Parent(); 
alert(x.name); 
alert(x.lev());

说明:
1.在函数中定义对象,并定义对象的各种属性,,虽然属性可以为方法,但是建议将属性为方法的属性定义到函数之外,这样可以避免重复创建该方法
2.引用该对象的时候,这里使用的是 var x = Parent()而不是 var x = new Parent();因为后者会可能出现很多问题(前者也成为工厂经典方式,后者称之为混合工厂方式),不推荐使用new的方式使用该对象
3.在函数的最后返回该对象
4.不推荐使用这种方式创建对象,但应该了解
第二种模式:构造函数方式
var lev=function(){ 
return "三水点靠木"; 
}; 
function Parent(){ 
this.name="脚本"; 
this.age="30"; 
this.lev=lev; 
}; 
var x =new Parent(); 
alert(x.name); 
alert(x.lev());

说明:
1.与工厂方式相比,使用构造函数方式创建对象,无需再函数内部重建创建对象,而使用this指代,并而函数无需明确return
2.同工厂模式一样,虽然属性的值可以为方法,扔建议将该方法定义在函数之外
3..同样的,不推荐使用这种方式创建对象,但仍需要了解
第三种模式:原型模式
var lev=function(){ 
return "三水点靠木"; 
}; 
function Parent(){ }; 
Parent.prototype.name="李小龙"; 
Parent.prototype.age="30"; 
Parent.prototype.lev=lev; 
var x =new Parent(); 
alert(x.name); 
alert(x.lev());

说明:
1.函数中不对属性进行定义
2.利用prototype属性对属性进行定义
3.同样的,不推荐使用这样方式创建对象
第四种模式:混合的构造函数,原型方式(推荐)
function Parent(){ 
this.name="脚本"; 
this.age=4; 
}; 
Parent.prototype.lev=function(){ 
return this.name; 
};; 
var x =new Parent(); 
alert(x.lev());

说明:1.该模式是指混合搭配使用构造函数方式和原型方式
2.将所有属性不是方法的属性定义在函数中(构造函数方式)
将所有属性值为方法的属性利用prototype在函数之外定义(原型方式)
3.推荐使用这样方式创建对象,这样做有好处和为什么不单独使用构造函数方式和原型方式,由于篇幅问题这里不予讨论
第五种模式:动态原型方式
function Parent(){ 
this.name="脚本"; 
this.age=4; if(typeof Parent._lev=="undefined"){ 
Parent.prototype.lev=function(){ 
return this.name; 
} 
Parent._lev=true; 
} 
}; 
var x =new Parent(); 
alert(x.lev());

说明:
1.动态原型方式可以理解为混合构造函数,原型方式的一个特例
2.该模式中,属性为方法的属性直接在函数中进行了定义,但是因为
if(typeof Parent._lev=="undefined"){ Parent._lev=true;}

从而保证创建该对象的实例时,属性的方法不会被重复创建
3.,推荐使用这种模式
Javascript 相关文章推荐
限制文本字节数js代码
Mar 06 Javascript
jQuery1.4.2与老版本json格式兼容的解决方法
Feb 12 Javascript
利用javascript判断文件是否存在
Dec 31 Javascript
jquery列表拖动排列(由项目提取相当好用)
Jun 17 Javascript
Js和JQuery获取鼠标指针坐标的实现代码分享
May 25 Javascript
基于jquery实现弹幕效果
Sep 29 Javascript
jQuery无刷新上传之uploadify简单代码
Jan 17 Javascript
详解利用jsx写vue组件的方法示例
Jul 17 Javascript
webpack项目轻松混用css module的方法
Jun 12 Javascript
详解Webpack多环境代码打包的方法
Aug 03 Javascript
详解vue移动端项目代码拆分记录
Mar 15 Javascript
JavaScript代理模式原理与用法实例详解
Mar 10 Javascript
JavaScript arguments 多参传值函数
Oct 24 #Javascript
ExtJs事件机制基本代码模型和流程解析
Oct 24 #Javascript
JQuery EasyUI 对话框的使用方法
Oct 24 #Javascript
javascript textContent与innerText的异同分析
Oct 22 #Javascript
js各种验证文本框输入格式(正则表达式)
Oct 22 #Javascript
JavaScript学习点滴 call、apply的区别
Oct 22 #Javascript
Web 前端设计模式--Dom重构 提高显示性能
Oct 22 #Javascript
You might like
PHP实现数组递归转义的方法
2014/08/28 PHP
Centos PHP 扩展Xchche的安装教程
2016/07/09 PHP
基于jquery的合并table相同单元格的插件(精简版)
2011/04/05 Javascript
使用jQuery时Form表单元素ID和name命名大忌
2014/03/06 Javascript
nodejs分页类代码分享
2014/06/17 NodeJs
js 判断所选时间(或者当前时间)是否在某一时间段的实现代码
2015/09/05 Javascript
基于JavaScript实现移动端点击图片查看大图点击大图隐藏
2015/11/04 Javascript
实例讲解jQuery EasyUI tree中state属性慎用
2016/04/01 Javascript
JS 组件系列之Bootstrap Table的冻结列功能彻底解决高度问题
2017/06/30 Javascript
vue-router中scrollBehavior的巧妙用法
2018/07/09 Javascript
Next.js实现react服务器端渲染的方法示例
2019/01/06 Javascript
jQuery实现的简单歌词滚动功能示例
2019/01/07 jQuery
微信小程序导航栏跟随滑动效果的实现代码
2019/05/14 Javascript
微信小程序 腾讯地图显示偏差问题解决
2019/07/27 Javascript
jQuery zTree插件使用简单教程
2019/08/16 jQuery
layerui代码控制tab选项卡,添加,关闭的实例
2019/09/04 Javascript
[43:35]EG vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
[01:23]2019完美世界全国高校联赛(春季赛)合肥全国总决赛
2019/06/10 DOTA
30分钟搭建Python的Flask框架并在上面编写第一个应用
2015/03/30 Python
python中zip()方法应用实例分析
2016/04/16 Python
Python的collections模块中的OrderedDict有序字典
2016/07/07 Python
详解Python的Lambda函数与排序
2016/10/25 Python
浅谈python和C语言混编的几种方式(推荐)
2017/09/27 Python
pytorch模型存储的2种实现方法
2020/02/14 Python
域名注册、建站工具、网页主机、SSL证书:Dynadot
2017/01/06 全球购物
Omio葡萄牙:全欧洲低价大巴、火车和航班搜索和比价
2019/02/09 全球购物
Bloomingdale’s阿联酋:选购奢华时尚、美容及更多
2020/09/22 全球购物
基于Python 函数和方法的区别说明
2021/03/24 Python
企业演讲比赛主持词
2014/03/18 职场文书
法人身份证明书
2014/10/08 职场文书
党员活动总结
2015/02/04 职场文书
丧事酒宴答谢词
2015/09/30 职场文书
如何用threejs实现实时多边形折射
2021/05/07 Javascript
浅谈Laravel中使用Slack进行异常通知
2021/05/29 PHP
python中24小时制转换为12小时制的方法
2021/06/18 Python
Python 语言实现六大查找算法
2021/06/30 Python