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 相关文章推荐
理解JavaScript中的事件
Sep 23 Javascript
javascript实现unicode和字符的互相转换
Jul 18 Javascript
Jquery 的outerHeight方法使用介绍
Sep 11 Javascript
jQuery 属性选择器element[herf*='value']使用示例
Oct 20 Javascript
js 实现菜单上下显示附效果图
Nov 21 Javascript
js改变Iframe中Src的方法
May 05 Javascript
javascript常用经典算法实例详解
Nov 25 Javascript
浅谈javascript基础之客户端事件驱动
Jun 10 Javascript
js 动态生成json对象、时时更新json对象的方法
Dec 02 Javascript
利用JS实现文字的聚合动画效果
Jan 22 Javascript
vue发送ajax请求详解
Oct 09 Javascript
基于webpack4.X从零搭建React脚手架的方法步骤
Dec 23 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 模拟$_PUT实现代码
2010/03/15 PHP
PHP中=赋值操作符对不同数据类型的不同行为
2011/01/02 PHP
如何使用php输出时间格式
2013/08/31 PHP
PHP随手笔记整理之PHP脚本和JAVA连接mysql数据库
2015/11/25 PHP
php获取文件后缀的9种方法
2016/03/22 PHP
利用PHP实现开心消消乐的算法示例
2017/10/12 PHP
javascript 函数式编程
2007/08/16 Javascript
js中的scroll和offset 使用比较的实例与分析
2013/09/29 Javascript
基于jquery的9行js轻松实现tab控件示例
2013/10/12 Javascript
JS中的this变量的使用介绍
2013/10/21 Javascript
JS/jQ实现免费获取手机验证码倒计时效果
2016/06/13 Javascript
jquery attr()设置和获取属性值实例教程
2016/09/25 Javascript
移动端刮刮乐的实现方式(js+HTML5)
2017/03/23 Javascript
在React项目中使用Eslint代码检查工具及常见问题
2018/10/10 Javascript
Vue中的情侣属性$dispatch和$broadcast详解
2019/03/07 Javascript
vue组件定义,全局、局部组件,配合模板及动态组件功能示例
2019/03/19 Javascript
利用JavaScript将Excel转换为JSON示例代码
2019/06/14 Javascript
ES6 Promise对象概念及用法实例详解
2019/10/15 Javascript
vue新建项目并配置标准路由过程解析
2019/12/09 Javascript
Python中使用logging模块代替print(logging简明指南)
2014/07/09 Python
Python version 2.7 required, which was not found in the registry
2014/08/26 Python
Python爬虫框架Scrapy实战之批量抓取招聘信息
2015/08/07 Python
关于Python中异常(Exception)的汇总
2017/01/18 Python
django中静态文件配置static的方法
2018/05/20 Python
python对日志进行处理的实例代码
2018/10/06 Python
详解numpy.meshgrid()方法使用
2019/08/01 Python
python给图像加上mask,并提取mask区域实例
2020/01/19 Python
Python 实现集合Set的示例
2020/12/21 Python
澳大利亚最早和最古老的巨型游戏专家:Yardgames
2020/02/20 全球购物
公务员个人自我评价分享
2013/11/06 职场文书
冰淇淋店的创业计划书
2014/02/07 职场文书
人事行政经理岗位职责
2014/06/18 职场文书
2014年小学安全工作总结
2014/12/04 职场文书
企业催款函范本
2015/06/24 职场文书
学校食堂管理制度
2015/08/04 职场文书
Python采集股票数据并制作可视化柱状图
2022/04/04 Python