悟透JavaScript的摘录

摘自：http://www.cnblogs.com/leadzen/archive/2008/02/25/1073404.html  

在前面的示例中，我们已经涉及到了对象的建立了。我们使用了一种被称为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舞台上成为璀璨夺目的明星。

 

 

 

好了，我们又来把上面的代码改成第一种定义式的函数形式：

     function  myfunc ()
    {
        alert( " hello " );
    };
    myfunc();  // 这里调用myfunc，输出yeah而不是hello
    
     function  myfunc ()
    {
        alert( " yeah " );
    };    
    myfunc();  // 这里调用myfunc，当然输出yeah

    按理说，两个签名完全相同的函数，在其他编程语言中应该是非法的。但在JavaScript中，这没错。不过，程序运行之后却发现一个奇怪的现象：两次调用都只是最后那个函数里输出的值！显然第一个函数没有起到任何作用。这又是为什么呢？

    原来，JavaScript执行引擎并非一行一行地分析和执行程序，而是一段一段地分析执行的。而且，在同一段程序的分析执行中，定义式的函数语句会被提取出来优先执行。函数定义执行完之后，才会按顺序执行其他语句代码。也就是说，在第一次调用myfunc之前，第一个函数语句定义的代码逻辑，已被第二个函数定义语句覆盖了。所以，两次都调用都是执行最后一个函数逻辑了。

    如果把这个JavaScript代码分成两段，例如将它们写在一个html中，并用<script/>标签将其分成这样的两块：

< script >
     function  myfunc ()
    {
        alert( " hello " );
    };
    myfunc();  // 这里调用myfunc，输出hello
</ script >

< script >
     function  myfunc ()
    {
        alert( " yeah " );
    };    
    myfunc();  // 这里调用myfunc，输出yeah
</ script >

    这时，输出才是各自按顺序来的，也证明了JavaScript的确是一段段地执行的。

 

 

 

 

JvaScript的所有function类型的对象都有一个prototype属性。这个prototype属性本身又是一个object类型的对象，因此我们也可以给这个prototype对象添加任意的属性和方法。既然prototype是对象的“原型”，那么由该函数构造出来的对象应该都会具有这个“原型”的特性。事实上，在构造函数的prototype上定义的所有属性和方法，都是可以通过其构造的对象直接访问和调用的。也可以这么说，prototype提供了一群同类对象共享属性和方法的机制。

    我们先来看看下面的代码：

     function  Person(name)
    {
         this .name  =  name;    // 设置对象属性，每个对象各自一份属性数据
    };
    
    Person.prototype.SayHello  =   function ()   // 给Person函数的prototype添加SayHello方法。
    {
        alert( " Hello, I'm  "   +   this .name);
    }

     var  BillGates  =   new  Person( " Bill Gates " );    // 创建BillGates对象
     var  SteveJobs  =   new  Person( " Steve Jobs " );    // 创建SteveJobs对象

    BillGates.SayHello();    // 通过BillGates对象直接调用到SayHello方法
    SteveJobs.SayHello();    // 通过SteveJobs对象直接调用到SayHello方法

    alert(BillGates.SayHello  ==  SteveJobs.SayHello);  // 因为两个对象是共享prototype的SayHello，所以显示：true

    程序运行的结果表明，构造函数的prototype上定义的方法确实可以通过对象直接调用到，而且代码是共享的。显然，把方法设置到prototype的写法显得优雅多了，尽管调用形式没有变，但逻辑上却体现了方法与类的关系，相对前面的写法，更容易理解和组织代码。

 

 

 

原著：李战(leadzen).深圳 2008-2-23