关于prototype

来源：互联网发布：linux pppoe 联通宽带编辑：程序博客网时间：2024/04/27 21:35

发表人 主题: 关于prototype ncs

终级用户
积分：3589
发贴：1069
来自：6楼，608
注册：2001-09-17

发表于 2002-12-12 15:37:37

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

为什么只有一个 div ？

如果，你承认自己的性格中有着某种英雄气概，那么，尊重并认为他人也是英雄，实为我们人格大锤炼之所必需。 windy2000

终级用户
积分：5834
发贴：1292
来自：天津 - 北京
注册：2002-10-08

发表于 2002-12-12 16:30:01

不太明白你想做什么~~~~~

不过，你的程序的执行效果就是

生成一个绿色的 div ，背景两次变为红色

b2 和 b3 无论怎么 new ，其所指向的都是一个 div （b1 建立的那个）

[这消息被windy2000编辑过(编辑时间2002-12-12 18:52:14)]

Windy2000 [Thinking...]

桃花坞里桃花庵，桃花庵下桃花仙；桃花仙人种桃树，又摘桃花卖酒钱。
酒醒只在花前坐，酒醉换来花下眠；半醒半醉日复日，花落花开年复年。
但愿老死花酒间，不愿鞠躬车马前；车尘马足富者趣，酒盏花枝贫者缘。
若将富贵比贫贱，一在平地一在天；若将贫贱比车马，他得驱驰我得闲。
别人笑我忒疯癫，我笑别人看不穿；不见五陵豪杰墓，无花无酒锄做田。 ncs

终级用户
积分：3589
发贴：1069
来自：6楼，608
注册：2001-09-17

发表于 2002-12-12 17:27:30

我把 block 作为一个“类”，
然后想创建一个新的类（b1），从 block 类继承所有的属性和方法，
然后从 b1 类生成两个实例。

如果，你承认自己的性格中有着某种英雄气概，那么，尊重并认为他人也是英雄，实为我们人格大锤炼之所必需。 windy2000

终级用户
积分：5834
发贴：1292
来自：天津 - 北京
注册：2002-10-08

发表于 2002-12-12 18:17:33

举报不良信息

javascript 好像没有类的概念~~~~~~~~

你所设置的 block 只是一个结构性质的对象~~~~~~~~

而你所能做的也只是把一个变量符值为某一已定义的结构

不过，你可以通过 prototype 方法定义，仅属于该结构变量的方法（算是继承基础上的扩充~~~~~~~~），同时，你也可以覆盖原有方法（算是方法重载~~~~~~）

而实质上，当你对一个变量符值为结构变量时，系统就自动给此变量分配一定的内从空间，而这个变量仅仅是一个变量！

我想，之所以 var b2 = new b1() 可以执行，只是系统的一个容错处理，实质上 b1 和 b2 指向的 "还是同一段内存空间" （只是指针传递）

<body></body>                        <SCRIPT LANGUAGE="JavaScript">                                                </SCRIPT>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

秋水无恨
积分：7333
发贴：2891
来自：
注册：2001-12-29

发表于 2002-12-12 21:30:26

举报不良信息

var b1=function(){return new block}
or
var b1 = new Function("return new block")
色眯眯的小疯狗

| AHO |
积分：8620
发贴：2303
来自：上海
注册：2001-09-23

发表于 2002-12-13 00:24:30

举报不良信息

<body></body>                        <SCRIPT LANGUAGE="JavaScript">                                                </SCRIPT>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

[url=/bbs/NewsDetail.asp?id=454714]收藏贴[/url]
windy2000

终级用户
积分：5834
发贴：1292
来自：天津 - 北京
注册：2002-10-08

发表于 2002-12-13 09:22:36

举报不良信息

呵呵，又长见识了~~~~~

不过，两位可不可以解释一下~~~

秋水的好像是每次调用 b1 就返回一个新的 block 指针

小狗的好像是先构造 b1 的方法，再用 block 的同名方法覆盖

但是这两者中的 b1.prototype = new block 我就不太明白了~~~~

感觉两种方法虽然结果相同，但是原理好像不太一样！

b1.prototype = new block 是否表示把 block 的所有方法赋予 b1 ？

但是秋水的 var b1=function(){return new block} 好像就应该可以了，但是又不能不加上那段话，而小狗的是先定义了一个同名的方法，然后再 b1.prototype = new block ，这样，不仅 init 被改变了，而 changeColor 也传递过来了，为什么不过不定义初始方法就不行呀？

关键还是 b1.prototype = new block 的真正功能！！！

望赐教，感谢！

秋水无恨
积分：7333
发贴：2891
来自：
注册：2001-12-29

发表于 2002-12-13 10:20:04

举报不良信息

运行以下的代码就知道了

<body></body>                        <SCRIPT LANGUAGE="JavaScript">                                                </SCRIPT>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行] myhyli

管理员
管理员
积分：46370
发贴：11837
来自：
注册：2000-07-22

发表于 2002-12-13 10:25:15

举报不良信息

我也瞎贴一个 :p

<body></body>                        <SCRIPT LANGUAGE="JavaScript">                                                </SCRIPT>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

Blueidea Web Team
Waiter Of Dreamweaver & Javascript

卖坏梨@WAP
www.myhyli.com ncs

终级用户
积分：3589
发贴：1069
来自：6楼，608
注册：2001-09-17

发表于 2002-12-13 10:46:52

举报不良信息

小狗的代码有问题了：

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

b2 的颜色没变。

如果，你承认自己的性格中有着某种英雄气概，那么，尊重并认为他人也是英雄，实为我们人格大锤炼之所必需。色眯眯的小疯狗

| AHO |
积分：8620
发贴：2303
来自：上海
注册：2001-09-23

发表于 2002-12-13 12:28:55

举报不良信息

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

[url=/bbs/NewsDetail.asp?id=454714]收藏贴[/url]
windy2000

终级用户
积分：5834
发贴：1292
来自：天津 - 北京
注册：2002-10-08

发表于 2002-12-13 13:22:33

举报不良信息

基本上明白了小狗的方法，new Function("this.init()")，是指明了一个结构的执行入口，即，只要 new 一个该结构就首先无条件执行定义的方法（b1.prototype = new block 的作用是结构复制，而 new Function 里面的东西其实还可以进一步扩充，从而实现 extend 的功能，这样说来，js 也是可以具有子类对超类的继承性和扩展性，我原来的想法的确错了，呵呵，看来对 prototype 的理解还不够！）

而秋水的方法则是直接复制结构体（b1.prototype = new block 就没有必要了！）

不过，虽然两种方法效果相同，但是小狗的更具发挥潜力！！！

呵呵，我的个人观点，冒犯了！！(^o^)

（秋水和小狗都有做我师傅的实力的！！(^o^)）

终级用户
积分：3589
发贴：1069
来自：6楼，608
注册：2001-09-17

发表于 2002-12-13 13:59:46

举报不良信息

同上...

如果，你承认自己的性格中有着某种英雄气概，那么，尊重并认为他人也是英雄，实为我们人格大锤炼之所必需。一片蓝枫

高级用户
积分：256
发贴：60
来自：
注册：2002-03-21

发表于 2002-12-13 15:03:06

举报不良信息

hehe，貂续狗尾^_^
b1继承、扩展了block，并重载了changeColor方法，添加了b1自己的方法setwidth^_^


<body></body>
<SCRIPT LANGUAGE="JavaScript">
<!--
function block(){
this.obj=null;
function init(){ 
this.obj=document.body.appendChild(window.document.createElement("<div style='background:#00ff00;width:100;height:100'></div>"));
}
this.init= init
this.changeColor = function(color){
this.obj.style.backgroundColor = color;
}
}
function setwidth(width)
{
this.obj.style.width=width;
}
function changeColor(color,height)
{
this.obj.style.backgroundColor=color;
this.obj.style.height=height;
}

var b1 = new Function("this.init();this.obj.innerText='^_^'")
b1.prototype = new block()
b1.prototype.setwidth = setwidth;
b1.prototype.changeColor = changeColor;


var b2 = new b1()
var b3 = new b1()
b2.changeColor('blue',200)
b3.changeColor('red',50)
b2.setwidth(200);
b3.setwidth(50);
//-->
</SCRIPT>

ncs

终级用户
积分：3589
发贴：1069
来自：6楼，608
注册：2001-09-17

发表于 2002-12-13 15:05:50

举报不良信息

如果要这样：

建立 block 类，
建立 block 类的子类 b1，
建立 b1 类的子类 b2，

从 block 、b1、b2 各生成一个实例（同时调用changeColor()方法）。

页面上显示的结果应该是三个红色的 div 。

请给出代码。

如果，你承认自己的性格中有着某种英雄气概，那么，尊重并认为他人也是英雄，实为我们人格大锤炼之所必需。 mmkk

我是谁
积分：10800
发贴：3848
来自：FJ,China
注册：2001-04-04

发表于 2002-12-13 17:02:41

举报不良信息

整个执行过程不太明白..?

本头像由诺婷提供^^！

高兴就好 windy2000

终级用户
积分：5834
发贴：1292
来自：天津 - 北京
注册：2002-10-08

发表于 2002-12-13 17:32:09

举报不良信息

ncs在上个帖子中说

引用:
如果要这样：

建立 block 类，
建立 block 类的子类 b1，
建立 b1 类的子类 b2，

从 block 、b1、b2 各生成一个实例（同时调用changeColor()方法）。

页面上显示的结果应该是三个红色的 div 。

请给出代码。

那就在结构定义里加上 init() ，执行一下就行了~~~~~~~

终级用户
积分：953
发贴：232
来自：
注册：2002-11-19

发表于 2002-12-13 20:26:14

举报不良信息

这贴子太棒了。学到了很多有用的东西。嘿嘿。

CoolCode.CN | Bindows中文站

mmkk

我是谁
积分：10800
发贴：3848
来自：FJ,China
注册：2001-04-04

发表于 2002-12-13 21:38:57

举报不良信息

老实说,我真的是一知半解,希望哪位给个详尽的解释,秋水 or 小狗 or anybody？

本头像由诺婷提供^^！

高兴就好 ncs

终级用户
积分：3589
发贴：1069
来自：6楼，608
注册：2001-09-17

发表于 2002-12-13 22:45:19

举报不良信息

我的意思大致是这样（注意，代码并不正确的）：

<body></body>                        <SCRIPT LANGUAGE="JavaScript">                                                </SCRIPT>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

哪一位有经验的同学能给出正确的代码？

如果，你承认自己的性格中有着某种英雄气概，那么，尊重并认为他人也是英雄，实为我们人格大锤炼之所必需。 windy2000

终级用户
积分：5834
发贴：1292
来自：天津 - 北京
注册：2002-10-08

发表于 2002-12-13 23:12:39

举报不良信息

解释一下你的程序流程：

var b1 = new Function("this.init()") -------- 定义一个新的结构 b1
b1.prototype = new block -------- 扩充 block 的方法

var b2 = new Function("this.init()") -------- 定义一个新的结构 b2
b2.prototype = new b1 -------- 扩充 b1 的方法，因为 b1 已有 this.init() ，故生成一个模块(b2)

var b3 = new block() -------- 定义一个新的 block 结构 b3
var b4 = new b1() -------- 定义一个新的 b1 结构 b4，生成一个模块(b4)
var b5 = new b2() -------- 定义一个新的 b2 结构 b5，生成一个模块(b5)

//b3.init();
b3.changeColor('red') -------- 调用 b3 的 changeColor 方法，因为 this.obj 不存在，程序出错！
b4.changeColor('red') -------- 调用 b4 的 changeColor 方法，变色
b5.changeColor('red') -------- 调用 b5 的 changeColor 方法，变色

| AHO |
积分：8620
发贴：2303
来自：上海
注册：2001-09-23

发表于 2002-12-14 11:08:16

举报不良信息

prototype 是指继承对象原型，当 new 继承对象时并不再次创建一次原型对象，所以使用var obj时，obj属于block私有，无论new多少次的b1，obj都是唯一的，这就是为什么2次的changeColor会改变了一个对象的颜色

同样this.obj也是做了同样的处理，也只产生了一个this.obj，但由于this默认表示调用对象，就像
Array.prototype.first = function ()
{
return this[0]
}

var test = new Array(1, 2, 3, 4)
test.first() 这时this表示test一样，当使用

b2.changecolor() block中的this表示b2
同样的 b3.changecolor() 时this表示b3

所以使用this.obj，obj属性就属于了b2和b3，而不是在block中

[url=/bbs/NewsDetail.asp?id=454714]收藏贴[/url]
nbsnewer

超级用户
积分：307
发贴：71
来自：
注册：2001-09-07

发表于 2002-12-14 18:52:24

举报不良信息

this.init = init是什么意思?
this.init是自定义属性吗？

i am a vbsnewer! nbsnewer

超级用户
积分：307
发贴：71
来自：
注册：2001-09-07

发表于 2002-12-15 09:52:37

举报不良信息

各位,是不是太简单了,没有人回答？

i am a vbsnewer! myhyli

管理员
管理员
积分：46370
发贴：11837
来自：
注册：2000-07-22

发表于 2002-12-15 10:02:42

举报不良信息

this.init可以说是这个对象的一个自定义方法，当新建一个block的副本后，执行该对象的init方法就相当于执行block函数里的子函数function init()，他刚好起了两个同样的名字而已，你不要搞混了

Blueidea Web Team
Waiter Of Dreamweaver & Javascript

卖坏梨@WAP
www.myhyli.com ncs

终级用户
积分：3589
发贴：1069
来自：6楼，608
注册：2001-09-17

发表于 2002-12-15 15:18:20

举报不良信息

ncs在上个帖子中说

引用:
如果要这样：

建立 block 类，
建立 block 类的子类 b1，
建立 b1 类的子类 b2，

从 block 、b1、b2 各生成一个实例（同时调用changeColor()方法）。

页面上显示的结果应该是三个红色的 div 。

请给出代码。

只有用秋水的方法来做，小狗的方法不行的哦。

<body></body>                        <SCRIPT LANGUAGE="JavaScript">                                                </SCRIPT>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

如果，你承认自己的性格中有着某种英雄气概，那么，尊重并认为他人也是英雄，实为我们人格大锤炼之所必需。 windy2000

终级用户
积分：5834
发贴：1292
来自：天津 - 北京
注册：2002-10-08

发表于 2002-12-16 12:10:57

举报不良信息

谁说不行！

我上一个贴子的解释中不是都说了吗！！

<body></body>                        <SCRIPT LANGUAGE="JavaScript">                                                </SCRIPT>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

N个蓝色大泡泡
管理员
积分：27402
发贴：15333
来自：Keyframe G.Lab
注册：2000-07-17

发表于 2002-12-16 12:15:58

POPOEVER 的 oicq 是54888059,查看 54888059 的资料

举报不良信息

看得我哈欠连天

I Plod......
人最想获得的是尊重
用一生学习彼此尊重

Blueidea Web Team
Capt. of Convoy ncs

终级用户
积分：3589
发贴：1069
来自：6楼，608
注册：2001-09-17

发表于 2002-12-17 00:38:12

举报不良信息

比较上面我用秋水的方法写的程序代码
和windy2000用小狗的方法写的程序代码
前者的程序逻辑显得清晰：
1.定义block类 → 定义block的子类b1 → 定义b1的子类b2

2.生成block的实例 → 生成b1的实例 → 生成b2的实例

最后div是按顺序排列的。

windy2000的代码显得逻辑混乱
1.定义block类（当生成其实例时需要手工init） → 定义block的子类b1 → 定义b1的子类b2（还在定义类时就已经生成了一个block的实例出来）

2.生成block的实例（第二个block实例了~） → 生成b1的实例（3个div到此已全部上市喽...） → 生成b2的实例(注意：这里并没有按预想的生成一个新的div，即使 new 一百次b2，也还是指向最早的一个div)

最后的结果：div是倒排的。

鄙人以为，这其中的关键是，在javascript里，Function（构造函数）里除了用this关键字指明的对象成员（如上例中的this.obj;this.init;this.changeColor等），其他的执行代码（如上例的var obj=null;init();）都是不能通过prototype继承的。
说到底，对象在实质上是个关联数组：

有兴趣的话，看看我n久以前发的一个帖子：
www.blueidea.com/bbs/newsdetail.asp?id=552651&posts=currentposts

如果，你承认自己的性格中有着某种英雄气概，那么，尊重并认为他人也是英雄，实为我们人格大锤炼之所必需。 qiushuiwuhen

秋水无恨
积分：7333
发贴：2891
来自：
注册：2001-12-29

发表于 2002-12-17 01:13:36

讨论完，拉到精华区，展立决，呵呵

ps.虽然对国外不是新鲜事，但值的新手推敲