鸟食轩

 Microsoft .NET[C#] MVP 2003
随笔 - 424, 文章 - 231, 评论 - 5402, 引用 - 344
数据加载中……

JavaScript中的Object到底是什么呢?!

    前天有网友留言问我,Object是什么?由于这两天忙于重构那个TreeView控件去了,没有及时的回答,真是不好意思。今天抽空来看看JavaScript中的Object到底是什么东西呢?Object和函数Function到底是什么关系呢?说的不对的地方欢迎斧正。

    虽然是私人留言,不过匿名转过来希望不会怪我,如有不妥请告知。
 js的Object到底是什么? 
 刚开始我认为Object是js的所有对象的原型。 
 但是:alert(Object.constructor)显示function Function...
 这说明Object的原型是Function? 
 但是问题又来了: 
 Function.prototype.read=function(){};//扩展Function的原型 
 for(var i in Object)alert(i)//显示read,这进一步证实了Object的原型是Function 

 Object.prototype.read=function(){};//扩展Object的原型 
 for(var i in Function)alert(i)//显示read,Function的原型是Object???? 
 Object到底是什么?做为类的Object与Function是一回事?

    这位朋友把Constructor、Prototype和Function搞混淆了,由于JavaScript是Object-based的语言(JavaScript does not contain proper classes)。说Object是所有对象的原形(prototype),其实是可以的,不过这里是指设计模式中的Prototype Pattern中的原形概念,而不是Object.prototype这个JavaScript的原形语言特性。

    那么JavaScript中的Object到底是什么东东呢?Script56.chm(就是M$官方教程)上说:提供所有 JScript对象通用的功能。恩,明白吗?因该是明白了,但友好像还是不明白@_@。如果我们从数据结构上来说,一个object(Object的实例)就是一个无序的集合,类似C++中的map、C#中的hashtable、Java中的hashmap这样一个结构。并且包含了一个JavaScript语言系统赋予的原始值,什么意思呢?Object有个方法叫做valueOf,它的功能是返回指定对象的原始值。这个也是可以在Script56中查到的,并且还有一个表格列举了系统对象的valueOf返回结果。也就是说,Array、Boolean、Date、Function、Number等等对象,其实都是从Object来的,它们的祖先都是Object。它们表现不同的语言特性,比如Array有被自动管理的length属性,Boolean只有true或false取值,Date表示时间结构,Function可以被运行,都是它们的原始类型(valueOf)赋予它们的能力。Object实际只是一个概念,JavaScript这个语言基于对象,是说所有内建类型都被抽象出了一组公用的方法和属性(也可以叫行为和状态),我们就想像只拥有这些特性的一个东西就是Object。实际上Object在编程中没有太大用处,我们都是在使用Object的实例object,然后使用Object的集合特性(expando),扩充object成为我们希望的东西。对于Object.prototype,其实并不怎么能用到,因为每个确切的类型都有自己的prototype,我们添加原形方法大都针对确定的类型。

    Object除了prototype外还有一个很重要的属性——constructor。这个东西就是用来完成我前面说到的对object的扩充用的,它也是我们使用JavaScript模拟OOP的基础。由于JavaScript中所有东西都是Object,所以constructor也是,不过它的原始类型是Function(运行Object.constructor.valueOf()得到:function Function() { [native code] })。当然反过来并不是所有的JavaScript对象都有constructor属性,一些内建对象没有constructor的说。

    对于Object和Function的关系,我认为这不是很好的检验代码:
 Function.prototype.read=function(){};//扩展Function的原型 
 for(var i in Object)alert(i)//显示read,这进一步证实了Object的原型是Function 

 Object.prototype.read=function(){};//扩展Object的原型 
 for(var i in Function)alert(i)//显示read,Function的原型是Object???? 

    这四行代码用来解释JavaScript的prototype的原理和模拟OO编程的原形继承方式比较sexy! 可是它们并不能清晰的说明Object和Function的关系:( 反而会愚弄视听。

    下面简述一下JavaScript中的各种对象类型:
    Native Object: JavaScript语言提供的不依赖于执行宿主的对象,其中一些是内建对象,如:Global、Math;一些是在脚本运行环境中创建来使用的,如:Array、Boolean、Date、Function、Number、Object、RegExp、Error。
    Build-in Object: JavaScript语言提供的不依赖于执行宿主的内建对象,如:Global、Math;内建对象都是Native Object。
    Host Object:JavaScript语言提供的任何依赖于宿主环境的对象,所有非Native Object的对象都是宿主对象,如:IE中的window,WScript中的wscript实例,任何用户创建的类。

posted on 2005-03-18 00:21 birdshome 阅读(5282) 评论(20)  编辑 收藏 所属分类: Jscript&Dhtml开发

评论

#1楼    回复  引用    

非常感谢您的回答。这样的回答对于我这样的新手实在是具有双重意义的:鼓励和释疑!
但我还是没搞明白,既然Function的原型是Object,为什么对Function原型的扩充,Object会自动继承呢?子类怎么会影响基类呢?
2005-03-18 10:26 | cmbscqhd [未注册用户]

#2楼 [楼主]   回复  引用  查看    

我会在有空的时候再介绍一下prototype,因为我对它的理解也是在变化的,而且分主题介绍便于讨论:)
2005-03-18 10:36 | birdshome      

#3楼    回复  引用    

转到:http://www.spicy-girl.net/forum/thread_show.asp?forum_id=d9caa6e02c990b0a&thread_id=c689c1d0e3b9ccc3
2005-03-18 16:13 | GirlSpicy [未注册用户]

#4楼    回复  引用    

决心已下,今天晚上把你的有关JS的文章全部转过去。

希望birdshome能及时看到,如果有意见尽快提!免得我贴了又删!

^_^
2005-03-18 16:30 | GirlSpicy [未注册用户]

#5楼 [楼主]   回复  引用  查看    

@GirlSpicy
做Friendly Link不好吗?我喜欢在cnblogs上写东西,是因为这里对html完全支持,同时如果我想inject脚本也并没有被禁止:)
你转载文章我不反对的,不过好像你的网站不支持html,很多效果都表现不出来哦。
2005-03-18 16:50 | birdshome      

#6楼    回复  引用    

GirlSpicy(辣妹子),你什么意思?你这样做是不是不太道德?!
2005-03-18 16:53 | cmbscqhd [未注册用户]

#7楼    回复  引用    

楼上的,birdshome都不反对。

@birdshome 不是那意思,肯定不会邀请像你这样的高手去那个破地方。我只是想转载你的文章(给我的网站提高点人气^_^,有点不好意思)。

至于转载你的文章某些特殊的效果我会想办法的,不知道你是否注意到我给你的留言(http://www.cnblogs.com/birdshome/archive/2004/12/23/80778.html)。

birdshome技术好,人更好。让我学了不少。
2005-03-18 17:01 | GirlSpicy [未注册用户]

#8楼 [楼主]   回复  引用  查看    

不要吵架~~ 和气万事兴,GirlSpciy转载是一种宣传,cmbscqhd保护俺的版权,都是好事啊:)
如果文章写来没有人转,岂不是和软件做来没有盗版一样@_@。
2005-03-18 17:08 | birdshome      

#9楼    回复  引用    

还是birdshome好。
2005-03-18 17:37 | GirlSpicy [未注册用户]

#10楼    回复  引用  查看    

我觉得还是没有把Object与Function的区别说出来.

那四行代码是很具有思考意义的.

Object 对象很简单,
它就只有两个property和两个method
这两个property是:
prototype
constructor
这两个function是:
toString()
valueOf()
(注意Object与object的区别,前者说的是Object这个所谓的祖先,后者指对象)
只要它是一个object, 它肯定会包含有这四个东西,

### 关于constructor #########################
因此说有些东西没有constructor是不应该的.
constructor属性是一个函数,
它的返回值是这个对象所在的"类function".
举个例子:
function MyTest(){
this.test = function(){}
}
var test = new MyTest().
document.write(test.constructor);
其结果将为:
function MyTest(){
this.test = function(){}
}

### Object 与 Function ####################
1. Function 是一个 object, 其"祖先"必 是 Object
所以, 你只要往 Object 里面添加 prototype, Function
里面肯定也有, 不要说Function, String, Array 都会有.
这是很容易理解的.

* 下面的东西关于个人的考虑更多, 而且没有去查相应资料.
* 但希望对你有些帮助, 如有误, 请指正.
2. 问题的关键在于下面这两句:
 Function.prototype.read=function(){};//扩展Function的原型
 for(var i in Object)alert(i)//显示read
给Function 添加了一个prototype: read, Object 居然拥有了.
攥权?
不, Object 其实又是一个 Function.
为什么?
Object 也是一个"类"!
想象一下Object是个什么样子?
会不会是这样呢:
function Object()
{
this.prototype = ...;
this.constructor = this;
this.toString = function(){...}
this.valueOf = function(){...}
}

那么, 往Function里添加东西的话,
Object 拥有便很容易理解了.

 

2005-03-19 09:40 | supersnake      

#11楼    回复  引用    

请看我的这篇最新心得:<A HREF="http://2yue2.blogchina.com/blog/article_185565.1146423.html">《JS的Object漫想:从现象到“本质”》</A>

#12楼    回复  引用    

刚才的提交中,链接设置失败,请抱歉!
2005-03-19 15:30 | cmbscqhd [未注册用户]

#13楼    回复  引用  查看    

@cmbscqhd
你的理解大多都正确,可是你把prototype和constructor放在一起来解解Object&Function之间的关系是不太合适的,我会尽快再介绍一下prototype这个东西,然后再和大家讨论。

BTW:提交连接不用自己写<a ... >,后台程序会自动识别的:}
2005-03-19 15:50 | birdshome      

#14楼    回复  引用    

乱说一通,说就要简单明了!
2005-06-09 09:09 | 123 [未注册用户]

#15楼    回复  引用    

function getCurDate(){
var namestr="";
var obj = window.event.srcElement;
var doc = document.all("myname");
if (null!=doc){
for(var i=0;i<doc.length;i++){
if (obj==doc[i]){
namestr = "document.all('item_edt_signDate')["+i+"]";
return namestr;
}
}
}
}
function mysea(){
var str = getCurDate();
alert(str); //弹出document.all('item_edt_signDate')[0]
toggleDatePicker(str)//不知道为什么这样会出错,请问怎样才能得到像下面正确的那样
toggleDatePicker(document.all('item_edt_signDate')[0])//但这样就正确
}
2005-12-16 10:10 | mysea [未注册用户]

#16楼 [楼主]   回复  引用  查看    

@mysea
You should use toggleDatePicker(eval(str)) instead of toggleDatePicker(str).
2005-12-16 10:33 | birdshome      

#17楼    回复  引用    

@birdshome

toggleDatePicker(eval(str)) //这样试过了,不行

eval("toggleDatePicker(" + str + ")"); //这样也不行
2005-12-16 11:30 | mysea [未注册用户]

#18楼 [楼主]   回复  引用  查看    

@mysea
alert 一下 eval(str) 看看是什么内容?
2005-12-16 16:41 | birdshome      

#19楼    回复  引用    

应该是object吧
2007-05-10 13:21 | sdh [未注册用户]

#20楼    回复  引用    

这个网站不错,我看了半天没看懂,我在学javascript, object不太清楚是什么东西,在学javascript 前是不是必须要学别的语言?我学过html, css, 都基础的。
2008-05-28 22:00 | jamesyan [未注册用户]

标题  
姓名  
主页
Email (只有博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
该文被作者在 2005-03-18 02:03 编辑过


相关链接: