使用面向对象的技术创建高级 Web 应用程序（JavaScript）
Figure1JavaScript 中的函数是最棒的 Figure2“this”随对象更改而更改 Figure4对象具有其原型的属性 Figure7 继承原型 Figure8根据谓词筛选元素 Figure10从 Pet 类派生 // class Dog : Pet
// public Dog(string name, string breed)
function Dog(name, breed) {
// think Dog : base(name)
Pet.call(this, name);
this.getBreed = function() { return breed; };
// Breed doesn’t change, obviously! It’s read only.
// this.setBreed = function(newBreed) { name = newName; };
}
// this makes Dog.prototype inherits
// from Pet.prototype
Dog.prototype = new Pet();
// remember that Pet.prototype.constructor
// points to Pet. We want our Dog instances’
// constructor to point to Dog.
Dog.prototype.constructor = Dog;
// Now we override Pet.prototype.toString
Dog.prototype.toString = function() {
return “This dog’s name is: “ + this.getName() +
“, and its breed is: “ + this.getBreed();
};
// end of class Dog
var dog = new Dog(“Buddy”, “Great Dane”);
// test the new toString()
alert(dog);
// Testing instanceof (similar to the is operator)
// (dog is Dog)? yes
alert(dog instanceof Dog);
// (dog is Pet)? yes
alert(dog instanceof Pet);
// (dog is Object)? yes
alert(dog instanceof Object);
MSDNMagNS.Pet = function(name) { // code here };
MSDNMagNS.Pet.prototype.toString = function() { // code };
var pet = new MSDNMagNS.Pet(“Yammer”);
命名空间的一个级别可能不是唯一的，因此可以创建嵌套的命名空间：var MSDNMagNS = {};
// nested namespace “Examples”
MSDNMagNS.Examples = {};
MSDNMagNS.Examples.Pet = function(name) { // code };
MSDNMagNS.Examples.Pet.prototype.toString = function() { // code };
var pet = new MSDNMagNS.Examples.Pet(“Yammer”);
可以想象，键入这些冗长的嵌套命名空间会让人很累。 幸运的是，库用户可以很容易地为命名空间指定更短的别名： // MSDNMagNS.Examples and Pet definition...
// think “using Eg = MSDNMagNS.Examples;”
var Eg = MSDNMagNS.Examples;
var pet = new Eg.Pet(“Yammer”);
alert(pet);
如果看一下 Microsoft AJAX 库的源代码，就会发现库的作者使用了类似的技术来实现命名空间（请参阅静态方法 Type.registerNamespace 的实现）。有关详细信息，请参与侧栏“OOP 和 ASP.NET AJAX”。应当这样编写 JavaScript 代码吗？您已经看见 JavaScript 可以很好地支持面向对象的编程。尽管它是一种基于原型的语言，但它的灵活性和强大功能可以满足在其他流行语言中常见的基于类的编程风格。但问题是：是否应当这样编写 JavaScript 代码？在 JavaScript 中的编程方式是否应与 C# 或 C++ 中的编码方式相同？是否有更聪明的方式来模拟 JavaScript 中没有的功能？每种编程语言都各不相同，一种语言的最佳做法，对另一种语言而言则可能并非最佳。在 JavaScript 中，您已看到对象继承对象（与类继承类不同）。因此，使用静态继承层次结构建立很多类的方式可能并不适合 JavaScript。也许，就像 Douglas Crockford 在他的文章 Prototypal Inheritance in JavaScript 中说的那样，JavaScript 编程方式是建立原型对象，并使用下面的简单对象函数建立新的对象，而后者则继承原始对象：function object(o) {
function F() {}
F.prototype = o;
return new F();
}
然后，由于 JavaScript 中的对象是可延展的，因此可以方便地在创建对象之后，根据需要用新字段和新方法增大对象。 这的确很好，但它不可否认的是，全世界大多数开发人员更熟悉基于类的编程。实际上，基于类的编程也会在这里出现。按照即将颁发的 ECMA-262 规范第 4 版（ECMA-262 是 JavaScript 的官方规范），JavaScript 2.0 将拥有真正的类。因此，JavaScript 正在发展成为基于类的语言。但是，数年之后 JavaScript 2.0 才可能会被广泛使用。同时，必须清楚当前的 JavaScript 完全可以用基于原型的风格和基于类的风格读取和写入 JavaScript 代码。展望随着交互式胖客户端 AJAX 应用程序的广泛使用，JavaScript 迅速成为 .NET 开发人员最重要的工具之一。但是，它的原型性质可能一开始会让更习惯诸如 C++、C# 或 Visual Basic 等语言的开发人员感到吃惊。我已发现我的 JavaScript 学习经历给予了我丰富的体验，虽然其中也有一些挫折。如果本文能使您的体验更加顺利，我会非常高兴，因为这正是我的目标。OOP 和 ASP.NET AJAX在 ASP.NET AJAX 中实现的 OOP 与在本文中讨论的规范实现稍有不同。这主要有两个原因：ASP.NET AJAX 版本提供了更多反射可能性（它是诸如 xml 脚本等的声明性语法和参数验证所必需的），而且 ASP.NET AJAX 的目标是将使用 .NET 的开发人员所熟悉的某些其他构造（例如属性、事件、枚举和接口）转换成 JavaScript。在 JavaScript 当前广泛使用的版本中，它缺少 .NET 开发人员所熟悉的几个 OOP 的关键概念，而 ASP.NET AJAX 可以模拟其中的大多数。根据命名约定（要遵守的示例），类可以有属性访问器，以及多播事件（符合紧密反映由 .NET 提供的约定的模式）。私有变量遵守成员以下划线开头则为私有的约定。很少有机会用到真正的私有变量，此策略是为了使调试程序能够检测到这些变量。引入接口也是为了使类型检查能够避免常见的鸭子定型法（一种类型方案，它基于的概念是：如果有什么物体走路和叫声像鸭子，那么它就是鸭子，或至少可以将它视为鸭子）。类和反射在 JavaScript 中，没有办法知道函数的名称。即使这是可能的，但在大多数情况下也没有什么用，因为类构造函数通常是通过向命名空间变量分配匿名函数来构造的。实际构成类型名称的是此变量的完全限定名称，它同样不可访问，并且构造函数本身对它一无所知。为了规避此限制，并使 JavaScript 类有丰富的反射，ASP.NET AJAX 需要将类型名称进行注册。ASP.NET AJAX 中的反射 API 将检查所有类型（无论是内置类型、类、接口、命名空间、或者甚至是枚举），而它们包括的类似 .NET Framework 的函数（例如 isInstanceOfType 和 inheritsFrom）可以在运行时检查类的层次结构。ASP.NET AJAX 还会在调试模式下执行某些类型检查，这对开发人员更早捕获 Bug 很有帮助。注册类层次结构和调用基础函数若要在 ASP.NET AJAX 中定义类，您需要将其构造函数赋给变量（注意，构造函数如何调用基础函数）： MyNamespace.MyClass = function() {
MyNamespace.MyClass.initializeBase(this);
this._myProperty = null;
}
Then, you need to define the class members itself in its prototype:
MyNamespace.MyClass.prototype = {
get_myProperty: function() { return this._myProperty;},
set_myProperty: function(value) { this._myProperty = value; },
doSomething: function() {
MyNamespace.MyClass.callBaseMethod(this, “doSomething”);
/* do something more */
}
}
最终注册类： MyNamespace.MyClass.registerClass(
“MyNamespace.MyClass “, MyNamespace.BaseClass);
此处不需要管理构造函数和原型层次结构，因为这由 registerClass 函数自动完成的。 Bertrand Le Roy 是 ASP.NET AJAX 团队的软件设计工程师 II。