我的现代Javascript之旅（一）启程、面向对象的现代Javascript

    Javascript曾经被认为是一门小玩具似的脚本语言。大部分

  的程序员都觉得它只是辅助工具，用来页面端校验——仅此

  而已。随着Javascript语言的演变，其功能越来越强大。直到

  Ajax的风行，大家的目光终于聚焦到了这个不起眼的家伙——  这就像现在很流行的一句话：怀才就像怀孕，时间久了才能

  被看出来。

1.1 现代Javascript中的类和方法

接下来我们看一段面向对象的Javascript代码：

 

//员工类的构造方法

function Employee(id, name){

   this.id = id;

   this.name = name;

  

   //员工类的一个普通方法

   this.display = function(){

          return this.id + ' 是 ' + this.name;

   }

}

 

//创建一个员工类的实例——直接定义

var employee = new Employee('10001', 'chanson');

alert('直接定义:'+employee.display());        

 

 

 

   从上面的代码可以看出，Javascript作为弱类型的语言，

  有以下特点：

l       不需要预先定义好对应的域——全局变量。

l       类的普通方法可以定义在其构造方法中。

   当然，并不是说类的普通方法只能定义在其构造方法中，

  下面是一段把普通方法定义在外面的代码：

  //员工类的一个普通方法（显示）

    Employee.prototype.display = function(){

               return this.getId() + ' 是 ' + this.getName();

}

  可以看出:这里的关键在于“prototype”。

 

  另外，从对象的实例化来看，跟Java、C#等面向对象语言没

  什么区别。

1.2 多对象的实例化——数组

   对于Javascript语言，多对象的存储主要是使用数组。

  下面是一段对象数组的实例化的代码：

 

//员工类的构造方法

function Employee(id, name){

   this.id = id;

   this.name = name;

   this.getName = function(){

          return this.name;

   }

   this.getId = function(){

          return this.id;

   }

}

 

 

//员工类的一个普通方法（显示）

Employee.prototype.display = function(){

          return this.getId() + ' 是 ' + this.getName();

}

 

//部门类的构造方法

function Department(employee){

   this.employee = employee;

}

 

//部门类的一个普通方法（显示）

Department.prototype.display = function(){

      var str = '';

          for(var i = 0; i < this.employee.length; i++){

               str += ' \n ' + this.employee[i].display();

          }

          return str;

}

 

 

//创建一个Department类的实例(对象数组方式)

var department= new Department([

          new Employee('1001','chanson'),

     new Employee('1002','John Resig')

]);

 

alert('对象数组的实例化方式:'+department.display());

1.3 匿名类——对象实例的直接声明

接触过Ext或者别的js库的朋友，一定看到过下面这样语法：

1.3.1 匿名类的单对象实例化

//创建一个员工类的实例——对象实例的直接声明

//没有具体的类名

//没有具体的构造方法

var employee = {

    id: '1001',

    name:'chanson',

    display:function(){

               return this.id + ' 是 ' + this.name;

    }

};

 

alert('对象实例的直接声明:'+employee.display());

 

     匿名类——对象实例的直接声明是现代Javascript的一个

  特色。从例子中我们可以看到：没有具体的类名，没有具体

  的构造方法。把对象的定义和实例化混在一起。

1.3.2 匿名类的多对象实例化

  下面是多对象实例化的例子：

 

//部门类的构造方法

function Department(employee){

   this.employee = employee;

}

 

//在构造方法外面构造一个普通方法（显示）

Department.prototype.display = function(){

     var str = '';

     for(var i = 0; i < this.employee.length; i++){

         str += ' \n ' + this.employee[i].display();

     }

     return str;

}

 

var department = new Department([

    {

        id: '1001',

        name:'chanson',

        display:function(){

              return this.id + ' 是 ' + this.name;

        }

    },

    {

        id: '1002',

        name:'John Resig',

        display:function(){

              return this.id + ' 是 ' + this.name;

        }

    }

]);

 

alert('多对象实例的直接声明:'+department.display());

 

 

评论

1 楼 willim 2008-09-08  

不错，给楼主顶