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());