悟透JavaScript 2

 

好了，以上的讲述，我们应该算理解了function类型的东西都是和object类型一样的东西，这种东西被我们称为“对象”。我们的确可以这样去看待这些“对象”，因为它们既有“属性”也有“方法”嘛。但下面的代码又会让我们产生新的疑惑：

    var anObject = {};  //一个对象
    anObject.aProperty = "Property of object";  //对象的一个属性
    anObject.aMethod = function(){alert("Method of object")}; //对象的一个方法
    //主要看下面：
    alert(anObject["aProperty"]);   //可以将对象当数组以属性名作为下标来访问属性
    anObject["aMethod"]();          //可以将对象当数组以方法名作为下标来调用方法
    for( var s in anObject)           //遍历对象的所有属性和方法进行迭代化处理
        alert(s + " is a " + typeof(anObject[s]));
    同样对于function类型的对象也是一样：
    var aFunction = function() {};  //一个函数
    aFunction.aProperty = "Property of function";  //函数的一个属性
    aFunction.aMethod = function(){alert("Method of function")}; //函数的一个方法
    //主要看下面：
    alert(aFunction["aProperty"]);   //可以将函数当数组以属性名作为下标来访问属性
    aFunction["aMethod"]();          //可以将函数当数组以方法名作为下标来调用方法
    for( var s in aFunction)           //遍历函数的所有属性和方法进行迭代化处理
        alert(s + " is a " + typeof(aFunction[s]));

是的，对象和函数可以象数组一样，用属性名或方法名作为下标来访问并处理。那么，它到底应该算是数组呢，还是算对象？

我们知道，数组应该算是线性数据结构，线性数据结构一般有一定的规律，适合进行统一的批量迭代操作等，有点像波。而对象是离散数据结构，适合描述分散的和个性化的东西，有点像粒子。因此，我们也可以这样问：JavaScript里的对象到底是波还是粒子？

如果存在对象量子论，那么答案一定是：波粒二象性！

因此，JavaScript里的函数和对象既有对象的特征也有数组的特征。这里的数组被称为“字典”，一种可以任意伸缩的名称值对儿的集合。其实， object和function的内部实现就是一个字典结构，但这种字典结构却通过严谨而精巧的语法表现出了丰富的外观。正如量子力学在一些地方用粒子来解释和处理问题，而在另一些地方却用波来解释和处理问题。你也可以在需要的时候，自由选择用对象还是数组来解释和处理问题。只要善于把握JavaScript的这些奇妙特性，就可以编写出很多简洁而强大的代码来。

放下对象

我们再来看看function与object的超然结合吧。

在面向对象的编程世界里，数据与代码的有机结合就构成了对象的概念。自从有了对象，编程世界就被划分成两部分，一个是对象内的世界，一个是对象外的世界。对象天生具有自私的一面，外面的世界未经允许是不可访问对象内部的。对象也有大方的一面，它对外提供属性和方法，也为他人服务。不过，在这里我们要谈到一个有趣的问题，就是“对象的自我意识”。

什么？没听错吧？对象有自我意识？

可能对许多程序员来说，这的确是第一次听说。不过，请君看看C++、C#和Java的this，DELPHI的self，还有VB的me，或许你会恍然大悟！当然，也可能只是说句“不过如此”而已。

然而，就在对象将世界划分为内外两部分的同时，对象的“自我”也就随之产生。“自我意识”是生命的最基本特征！正是由于对象这种强大的生命力，才使得编程世界充满无限的生机和活力。

但对象的“自我意识”在带给我们快乐的同时也带来了痛苦和烦恼。我们给对象赋予了太多欲望，总希望它们能做更多的事情。然而，对象的自私使得它们互相争抢系统资源，对象的自负让对象变得复杂和臃肿，对象的自欺也往往带来挥之不去的错误和异常。我们为什么会有这么多的痛苦和烦恼呢？

为此，有一个人，在对象树下，整整想了九九八十一天，终于悟出了生命的痛苦来自于欲望，但究其欲望的根源是来自于自我意识。于是他放下了“自我”，在对象树下成了佛，从此他开始普度众生，传播真经。他的名字就叫释迦摩尼，而《JavaScript真经》正是他所传经书中的一本。

JavaScript中也有this，但这个this却与C++、C#或Java等语言的this不同。一般编程语言的this就是对象自己，而 JavaScript的this却并不一定！this可能是我，也可能是你，可能是他，反正是我中有你，你中有我，这就不能用原来的那个“自我”来理解 JavaScript这个this的含义了。为此，我们必须首先放下原来对象的那个“自我”。

我们来看下面的代码：

    function WhoAmI()       //定义一个函数WhoAmI
    {
        alert("I'm " + this.name + " of " + typeof(this));
    };
   
    WhoAmI();   //此时是this当前这段代码的全局对象，在浏览器中就是window对象，其name属性为空字符串。输出：I'm of object

    var BillGates = {name: "Bill Gates"};
    BillGates.WhoAmI = WhoAmI;  //将函数WhoAmI作为BillGates的方法。
    BillGates.WhoAmI();         //此时的this是BillGates。输出：I'm Bill Gates of object
   
    var SteveJobs = {name: "Steve Jobs"};
    SteveJobs.WhoAmI = WhoAmI;  //将函数WhoAmI作为SteveJobs的方法。
    SteveJobs.WhoAmI();         //此时的this是SteveJobs。输出：I'm Steve Jobs of object

    WhoAmI.call(BillGates);     //直接将BillGates作为this，调用WhoAmI。输出：I'm Bill Gates of object
    WhoAmI.call(SteveJobs);     //直接将SteveJobs作为this，调用WhoAmI。输出：I'm Steve Jobs of object
   
    BillGates.WhoAmI.call(SteveJobs);   //将SteveJobs作为this，却调用BillGates的WhoAmI方法。输出：I'm Steve Jobs of object
    SteveJobs.WhoAmI.call(BillGates);   //将BillGates作为this，却调用SteveJobs的WhoAmI方法。输出：I'm Bill Gates of object

    WhoAmI.WhoAmI = WhoAmI;     //将WhoAmI函数设置为自身的方法。
    WhoAmI.name = "WhoAmI";
    WhoAmI.WhoAmI();            //此时的this是WhoAmI函数自己。输出：I'm WhoAmI of function
       
    ({name: "nobody", WhoAmI: WhoAmI}).WhoAmI();    //临时创建一个匿名对象并设置属性后调用WhoAmI方法。输出：I'm nobody of object

从上面的代码可以看出，同一个函数可以从不同的角度来调用，this并不一定是函数本身所属的对象。this只是在任意对象和function元素结合时的一个概念，是种结合比起一般对象语言的默认结合更加灵活，

显得更加超然和洒脱。

 

在JavaScript函数中，你只能把this看成当前要服务的“这个”对象。this是一个特殊的内置参数，根据this参数，您可以访问到“这个”对象的属性和方法，但却不能给this参数赋值。在一般对象语言中，方法体代码中的this可以省略的，成员默认都首先是“自己”的。但JavaScript却不同，由于不存在“自我”，当访问“这个”对象时，this不可省略！

JavaScript提供了传递this参数的多种形式和手段，其中，象BillGates.WhoAmI()和SteveJobs.WhoAmI()这种形式，是传递this参数最正规的形式，此时的this就是函数所属的对象本身。而大多数情况下，我们也几乎很少去采用那些借花仙佛的调用形式。但只我们要明白JavaScript的这个“自我”与其他编程语言的“自我”是不同的，这是一个放下了的“自我”，这就是JavaScript特有的世界观。

对象素描

已经说了许多了许多话题了，但有一个很基本的问题我们忘了讨论，那就是：怎样建立对象？

在前面的示例中，我们已经涉及到了对象的建立了。我们使用了一种被称为JavaScript Object Notation(缩写JSON)的形式，翻译为中文就是“JavaScript对象表示法”。

JSON为创建对象提供了非常简单的方法。例如，

创建一个没有任何属性的对象：

var o = {};
    创建一个对象并设置属性及初始值：
var person = {name: "Angel", age: 18, married: false};
    创建一个对象并设置属性和方法：
var speaker = {text: "Hello World", say: function(){alert(this.text)}};
     创建一个更复杂的对象，嵌套其他对象和对象数组等：
    var company =
    {
        name: "Microsoft",
        product: "softwares",
        chairman: {name: "Bill Gates", age: 53, Married: true},
        employees: [{name: "Angel", age: 26, Married: false}, {name: "Hanson", age: 32, Marred: true}],
        readme: function() {document.write(this.name + " product " + this.product);}
    };

JSON的形式就是用大括“{}”号包括起来的项目列表，每一个项目间并用逗号“,”分隔，而项目就是用冒号“:”分隔的属性名和属性值。这是典型的字典表示形式，也再次表明了 JavaScript里的对象就是字典结构。不管多么复杂的对象，都可以被一句JSON代码来创建并赋值。

其实，JSON就是JavaScript对象最好的序列化形式，它比XML更简洁也更省空间。对象可以作为一个JSON形式的字符串，在网络间自由传递和交换信息。而当需要将这个JSON字符串变成一个JavaScript对象时，只需要使用eval函数这个强大的数码转换引擎，就立即能得到一个JavaScript内存对象。正是由于JSON的这种简单朴素的天生丽质，才使得她在AJAX舞台上成为璀璨夺目的明星。

JavaScript就是这样，把面向对象那些看似复杂的东西，用及其简洁的形式表达出来。卸下对象浮华的浓妆，还对象一个眉目清晰！

构造对象

好了，接下我们来讨论一下对象的另一种创建方法。

 除JSON外，在JavaScript中我们可以使用new操作符结合一个函数的形式来创建对象。例如：

    function MyFunc() {};         //定义一个空函数
    var anObj = new MyFunc();  //使用new操作符，借助MyFun函数，就创建了一个对象
    JavaScript的这种创建对象的方式可真有意思，如何去理解这种写法呢？
 
   其实，可以把上面的代码改写成这种等价形式：
    function MyFunc(){};
    var anObj = {};     //创建一个对象
    MyFunc.call(anObj); //将anObj对象作为this指针调用MyFunc函数

我们就可以这样理解，JavaScript先用new操作符创建了一个对象，紧接着就将这个对象作为this参数调用了后面的函数。其实，JavaScript内部就是这么做的，而且任何函数都可以被这样调用！但从 “anObj = new MyFunc()” 这种形式，我们又看到一个熟悉的身影，C++和C#不就是这样创建对象的吗？原来，条条大路通灵山，殊途同归啊！

君看到此处也许会想，我们为什么不可以把这个MyFunc当作构造函数呢？恭喜你，答对了！JavaScript也是这么想的！请看下面的代码： 

 1     function Person(name)   //带参数的构造函数
 2     {
 3         this.name = name;   //将参数值赋给给this对象的属性
 4         this.SayHello = function() {alert("Hello, I'm " + this.name);};   //给this对象定义一个SayHello方法。
 5     };
 6
 7     function Employee(name, salary)     //子构造函数
 8     {
 9         Person.call(this, name);        //将this传给父构造函数
10         this.salary = salary;       //设置一个this的salary属性
11         this.ShowMeTheMoney = function() {alert(this.name + " $" + this.salary);};  //添加ShowMeTheMoney方法。
12     };
13    
14     var BillGates = new Person("Bill Gates");   //用Person构造函数创建BillGates对象
15     var SteveJobs = new Employee("Steve Jobs", 1234);   //用Empolyee构造函数创建SteveJobs对象
16
17     BillGates.SayHello();   //显示：I'm Bill Gates
18     SteveJobs.SayHello();   //显示：I'm Steve Jobs
19     SteveJobs.ShowMeTheMoney();   //显示：Steve Jobs $1234
20
21     alert(BillGates.constructor == Person);  //显示：true
22     alert(SteveJobs.constructor == Employee);  //显示：true
23    
24     alert(BillGates.SayHello == SteveJobs.SayHello); //显示：false

这段代码表明，函数不但可以当作构造函数，而且还可以带参数，还可以为对象添加成员和方法。其中的第9行，Employee构造函数又将自己接收的this作为参数调用Person构造函数，这就是相当于调用基类的构造函数。第21、22行还表明这样一个意思：BillGates是由Person构造的，而SteveJobs是由Employee构造的。对象内置的constructor属性还指明了构造对象所用的具体函数！

其实，如果你愿意把函数当作“类”的话，她就是“类”，因为她本来就有“类”的那些特征。难道不是吗？她生出的儿子各个都有相同的特征，而且构造函数也与类同名嘛！

但要注意的是，用构造函数操作this对象创建出来的每一个对象，不但具有各自的成员数据，而且还具有各自的方法数据。换句话说，方法的代码体(体现函数逻辑的数据)在每一个对象中都存在一个副本。尽管每一个代码副本的逻辑是相同的，但对象们确实是各自保存了一份代码体。上例中的最后一句说明了这一实事，这也解释了JavaScript中的函数就是对象的概念。

同一类的对象各自有一份方法代码显然是一种浪费。在传统的对象语言中，方法函数并不象JavaScri