- 浏览: 102683 次
- 性别:
- 来自: 天府之国
文章分类
最新评论
-
netkongjian:
不错CAD控件知识,感谢分享[deyi]
CAD速记手册 -
a545807638:
小老树
邓锋对话周鸿祎:中国为何没有Google? -
longxiaoyan:
javaeye表情汇总 -
bangyan2003:
...
javaeye表情汇总 -
xiaofu305:
/images/guest_book/2.gif
javaeye表情汇总
最近在看javascript高级程序设计,其中对对象的创建做了具体的阐述,综合起来,总结了下(je知识库javascript专栏由这方面的教程,有兴趣的可以去知识库看看)
第一种模式:工厂方式
var lev=function(){ return "啊打"; }; function Parent(){ var Child = new Object(); Child.name="李小龙"; Child.age="30"; 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..同样的,不推荐使用这种方式创建对象,但仍需要了解
第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=32; }; Parent.prototype.lev=function(){ return this.name; };; var x =new Parent(); alert(x.lev());
说明:1.该模式是指混合搭配使用构造函数方式和原型方式
2.将所有属性不是方法的属性定义在函数中(构造函数方式)
将所有属性值为方法的属性利用prototype在函数之外定义(原型方式)
3.推荐使用这样方式创建对象,这样做有好处和为什么不单独使用构造函数方式和原型方式,由于篇幅问题这里不予讨论
第五种模式:动态原型方式
function Parent(){ this.name="李小龙"; this.age=32; ; 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.,推荐使用这种模式
评论
17 楼
select*from爱
2010-06-29
没说是错的啊
我错了,哥哥
我错了,哥哥
16 楼
rainsilence
2010-06-28
select*from爱 写道
rainsilence 写道
select*from爱 写道
luolonghao 写道
我喜欢第一种,想知道不推荐的理由。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
。。。你把 我的代码貌似不是这样写的,不推荐的原因是因为,以你贴出来的代码为例。当创建多个对象的实例时,会照成 Parent的重复创建,每多实例化一次,就多了一个parent版本,当然,使用这种模式也有其优点,具体看应用场景
比如以下代码
var y=Child(); var y2=Child(); y3=Child(); 这样Parent被重复创建了3次
这样的重复创建并不是类级别的创建,而是对象(因为不涉及到prototype)。很符合OO的思想。在很多开源框架中,这种构造方法被广泛运用。但是一般用于工厂模式的比较多
比如
addEventListener = function() { if (window.addEventListener) { return function(target, type, fn) { target.addEventListener(type, fn, false); }; } else { return function(target, type, fn) { target.attachEvent('on' + type, function() {fn.call(target);}); } } }
这段代码在调用的时候,已经不用判断是何浏览器了。在初始化的时候已经把function返回
这样做是可以,不过要看应用场景,比如你以上代码是包含在 一个 function test(){}中,而在调用的使用
以new test()的形式时,在多次 new test的时候,function就写到外面好一点,在内部引用即可,而如果不是
以'类的'形式调用,就无所谓了(js中并没有类这个概念)
【var y=Child(); var y2=Child(); y3=Child(); 这样Parent被重复创建了3次 】
这样难道不对吗?难道y,y2,y3中属性是共享的?那用3个引用指向一个对象也太浪费了。一个就够了
15 楼
select*from爱
2010-06-28
rainsilence 写道
select*from爱 写道
luolonghao 写道
我喜欢第一种,想知道不推荐的理由。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
。。。你把 我的代码貌似不是这样写的,不推荐的原因是因为,以你贴出来的代码为例。当创建多个对象的实例时,会照成 Parent的重复创建,每多实例化一次,就多了一个parent版本,当然,使用这种模式也有其优点,具体看应用场景
比如以下代码
var y=Child(); var y2=Child(); y3=Child(); 这样Parent被重复创建了3次
这样的重复创建并不是类级别的创建,而是对象(因为不涉及到prototype)。很符合OO的思想。在很多开源框架中,这种构造方法被广泛运用。但是一般用于工厂模式的比较多
比如
addEventListener = function() { if (window.addEventListener) { return function(target, type, fn) { target.addEventListener(type, fn, false); }; } else { return function(target, type, fn) { target.attachEvent('on' + type, function() {fn.call(target);}); } } }
这段代码在调用的时候,已经不用判断是何浏览器了。在初始化的时候已经把function返回
这样做是可以,不过要看应用场景,比如你以上代码是包含在 一个 function test(){}中,而在调用的使用
以new test()的形式时,在多次 new test的时候,function就写到外面好一点,在内部引用即可,而如果不是
以'类的'形式调用,就无所谓了(js中并没有类这个概念)
14 楼
zw61911169
2010-06-28
好东西。。。
13 楼
rainsilence
2010-06-26
select*from爱 写道
luolonghao 写道
我喜欢第一种,想知道不推荐的理由。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
。。。你把 我的代码貌似不是这样写的,不推荐的原因是因为,以你贴出来的代码为例。当创建多个对象的实例时,会照成 Parent的重复创建,每多实例化一次,就多了一个parent版本,当然,使用这种模式也有其优点,具体看应用场景
比如以下代码
var y=Child(); var y2=Child(); y3=Child(); 这样Parent被重复创建了3次
这样的重复创建并不是类级别的创建,而是对象(因为不涉及到prototype)。很符合OO的思想。在很多开源框架中,这种构造方法被广泛运用。但是一般用于工厂模式的比较多
比如
addEventListener = function() { if (window.addEventListener) { return function(target, type, fn) { target.addEventListener(type, fn, false); }; } else { return function(target, type, fn) { target.attachEvent('on' + type, function() {fn.call(target);}); } } }
这段代码在调用的时候,已经不用判断是何浏览器了。在初始化的时候已经把function返回
12 楼
select*from爱
2010-06-25
额,一样,哈哈,我家里已经堆了N本书了,基本上买来就放那一直没看了,最近才开始整理出来,翻翻
11 楼
tizll521
2010-06-25
你看的哪本书我去年时就买了 现在还没看 最近才开始研究对象的问题 惭愧啊
第三种我见的比较多 第四种我是没见过
第三种我见的比较多 第四种我是没见过
10 楼
lyang0000
2010-06-25
人为的制造复杂,其实原理很简单,js的滞后绑定而已。
不过推荐用混合,包括继承也是!
不过推荐用混合,包括继承也是!
9 楼
select*from爱
2010-06-25
rainsilence 写道
javascript高级程序设计中
对你的最后一种模式应该持谨慎态度。因为涉及到继承时,会有问题。
另外,第三第四种,其实差不多
第三种可以近似看成是java的类级别变量
。。。
对你的最后一种模式应该持谨慎态度。因为涉及到继承时,会有问题。
另外,第三第四种,其实差不多
第三种可以近似看成是java的类级别变量
。。。
由于篇幅原因我只是列举了几种模式,并没有具体介绍为什么用,还有,每种模式都有其优缺点,在javascript高级程序设计中,的确对每种模式进行了详解,想深入了解的朋友可以查阅该书第3章
8 楼
select*from爱
2010-06-25
luolonghao 写道
我喜欢第一种,想知道不推荐的理由。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
。。。你把 我的代码貌似不是这样写的,不推荐的原因是因为,以你贴出来的代码为例。当创建多个对象的实例时,会照成 Parent的重复创建,每多实例化一次,就多了一个parent版本,当然,使用这种模式也有其优点,具体看应用场景
比如以下代码
var y=Child(); var y2=Child(); y3=Child(); 这样Parent被重复创建了3次
7 楼
beijing2009
2010-06-25
这一种其实是最简单,最直接的
function lev(){
return "啊打";
}
function Parent(){
name : '李小龙',
age : 30,
lev : lev
}
赞同
function lev(){
return "啊打";
}
function Parent(){
name : '李小龙',
age : 30,
lev : lev
}
赞同
6 楼
luolonghao
2010-06-24
我喜欢第一种,想知道不推荐的理由。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
------
function lev(){
return "啊打";
}
function Parent(){
return {
name : '李小龙',
age : 30,
lev : lev
};
}
function Child(){
var obj = Parent();
obj.name = '李小龙儿子';
obj.age = 1;
return obj;
}
var x = Parent();
alert(x.name);
alert(x.lev());
var y = Child();
alert(y.name);
alert(y.lev());
我选择的理由
----
1. 不用new,方便链式操作。
2. 没有模拟class的代码。
3. 用闭包可以模拟私有方法和变量。
5 楼
rainsilence
2010-06-24
javascript高级程序设计中
对你的最后一种模式应该持谨慎态度。因为涉及到继承时,会有问题。
另外,第三第四种,其实差不多
第三种可以近似看成是java的类级别变量
第四种无非就是在第三种的基础上加了构造函数
具体你可以参照我这里的一篇文章
http://rainsilence.iteye.com/blog/604418
有个例子是这样的
其实这里的Animal都是基于原型的,像上面的这种,内部原理可以看成是你的第4种
然后我改改
就变成了你的第三种。
对你的最后一种模式应该持谨慎态度。因为涉及到继承时,会有问题。
另外,第三第四种,其实差不多
第三种可以近似看成是java的类级别变量
public class Parent { String name = "李小龙"; int age = 32; }
第四种无非就是在第三种的基础上加了构造函数
public class Parent { String name = null; int age = 0; public Parent() { this.name = "李小龙"; this.age = 32; } }
具体你可以参照我这里的一篇文章
http://rainsilence.iteye.com/blog/604418
有个例子是这样的
var Animal = Rs.Class({ initialize: function(name){ this.name = name; }, showName: function(){ alert(this.name); } });
其实这里的Animal都是基于原型的,像上面的这种,内部原理可以看成是你的第4种
然后我改改
var Animal = Rs.Class({ name: null, initialize: function(name){ this.name = name; }, showName: function(){ alert(this.name); } });
就变成了你的第三种。
4 楼
select*from爱
2010-06-23
说穿了就一句话,混合搭配使用
3 楼
mercyblitz
2010-06-23
看来看去,只有两种,一种是动态属性banding,第二种是原型banding。别把JS想得复杂,无非是动态语言的运行时banding。
2 楼
select*from爱
2010-06-23
呵呵,龙哥,扎偶像嘛
1 楼
tz_strive
2010-06-23
“啊打”,楼主太有才了!呵呵
发表评论
-
函数式编程
2010-07-07 16:20 863三目运算符的使用 在函数式的编程思想里,出于连续运算的考虑, ... -
老外写的页面dom加载完成后执行的事件
2010-07-05 16:01 2834window..onload的是页面加载完成后执行的事件,而且 ... -
JS中使用arguments模拟重载
2010-06-22 14:01 840今天看读别人的代码的时候发现了arguments对象,不明白之 ... -
js中几个需要注意的数据类型
2010-06-22 13:12 702Undefined Undefined类型只有一个值。即un ... -
textarea<一>
2010-03-31 12:01 2857如果只需要完成简单的功能。而不愿使用庞大的插件,不妨自己制作简 ... -
js几常用函数(replace,)
2010-03-26 15:14 828一: replace替换 ====替换所有字符(类似 ... -
js dom操作
2010-03-11 11:48 10761.创建一个node var node=do ... -
js输入校验正则
2009-10-20 09:48 1130//只能为中文,数字,字母和下划线,且开头不能为空格的正则,且 ... -
js技巧
2009-08-16 13:47 840js技巧 1. oncontext ...
相关推荐
js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式).docx
这些过于灵活的地方有时候确实很让人迷惑,那么今天我们就来梳理一下JS中常用的创建对象的几种方法吧。 前言 虽然使用 Object构造函数 或者使用 对象字面量 可以很方便的用来创建一个对象,但这种方式有一个明显的...
最近在看javascript高级程序设计,其中对对象的创建做了具体的阐述,综合起来,总结了下(je知识库javascript专栏由这方面的教程,有兴趣的可以去知识库看看)
方便学习js类的朋友,让你快速的掌握js类的定义方法,方法有很多种,结果都一样。大家可以根据自己的爱好选用。
以下几种,是javascript中最常用的创建对象的方式。初学者看到后,可能会晕掉,甚至会觉得担心。其实完全不用担心,这些种方式,只需要掌握一两种,对其他的几种只需要理解就好了
创建对象的几种常用方式 1.使用Object或对象字面量创建对象 2.工厂模式创建对象 3.构造函数模式创建对象 4.原型模式创建对象 1.使用Object或对象字面量创建对象 使用object var student = new Object(); student....
本文实例讲述了JavaScript创建对象的四种常用模式。分享给大家供大家参考,具体如下: 这里介绍了javascript中创建对象常用的几种模式,包括:工厂模式,构造函数模式,原型模式,组合构造函数与原型的模式,动态...
本文实例讲述了JS常见创建类的方法。分享给大家供大家参考,具体如下: Javascript是一种基于对象的...接下来我们介绍一下在JS中创建类的几种方式: 1.工厂方式: //通过工厂方式创建对象,先定义一个工厂方法 functi
常用的创建对象的模式有以下几种: 一. 工厂模式 工厂模式抽象了具体对象的过程,用函数来封装以特ing接口创建对象的细节。 如下: function createAnimal(name, age) { var o = new Object(); o.name = name; o...
本文实例讲述了JS实现继承的几种常用方式。分享给大家供大家参考,具体如下: 1,原型链继承 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>原型链继承<...
常用的几种对象创建模式 使用new关键字创建 最基础的对象创建方式,无非就是和其他多数语言一样说的一样:没对象,你new一个呀! var gf = new Object(); gf.name = "tangwei"; gf.bar = "c++"; gf.sayWhat = ...
几种javascript类定义方式中,最常用的是杂合prototype/constructor 和 动态prototype方式。
下面给大家介绍下常用的几种对象创建模式 使用new关键字创建 最基础的对象创建方式,无非就是和其他多数语言一样说的一样:没对象,你new一个呀! var gf = new Object(); gf.name = tangwei; gf.bar = c++; gf....
5、Javascript 创建对象的几种方式? (必会) 79 6、请指出 JavaScript 宿主对象和原生对象的区别?(必会) 81 7、 JavaScript 内置的常用对象有哪些?并列举该对象常用的方法?(必会) 82 8、 === 和 ==的区别?...
107个常用javascript语句 -7.焦点 .focus(); -6.捕获对象通用方法 function $(obj) {return document.getElementById(obj);} ("") %> -5.字符串赋值数组var array=new Array(); array=tdrczpdata.split('<BR>'); ...
14.Function:js中一切都是对象,连方法都是1个对象!! 笔试题:js中方法定义集中方式: A:function compare(a,b){return a-b;}---*可以任意地方声明方法* B:var compare=function(a,b){return a-b;} ---| --...
使用构造函数创建对象原型小结原型链js中继承的几种方法原型链继承借用构造函数继承组合继承原型式继承寄生式继承(常用)寄生组合式继承使用构造函数创建对象var p