《使用面向对象技术创建高级web应用程序费下载》由会员分享，可在线阅读，更多相关《使用面向对象技术创建高级web应用程序费下载（21页珍藏版）》请在金锄头文库上搜索。
1、使用面向对象技术创建高级使用面向对象技术创建高级 Web 应用程序应用程序最近，我面试了一位具有 5 年 Web 应用开发经验的软件开发人员。她有 4 年半的 JavaScript 编程经验，自认为自己具有非常优秀的 JavaScript 技能，可是，随后我很快发现， 实际上她对 JavaScript 却知之甚少。然而，我并不是要为此而责怪她。JavaScript 就是这么 不可思议。有很多人（也包括我自己，这种情况直到最近才有所改观）都自以为是，觉得 因为他们懂 C/C+/C#或者具有编程经验，便以为他们非常擅长 JavaScript 这门语言。 从某个角度讲，这种自以为是也并非毫无道理。用
2、 JavaScript 做一些简单的事情是非常容 易的。其入门的门槛非常低；这个语言待人宽厚，并不苛求你必须懂它很多才能开始用它 编写代码。甚至对于非程序员来说，也可以仅花个把小时就能够上手用它为他的网站编写 几段或多或少都有些用的脚本。 实际上直到最近，无论懂的 JavaScript 有多么少，仅仅在 MSDN DHTML 参考资料以及 我在 C+/C#方面编程经验的帮助下，我都能够凑合过下去。直到我在工作中真正开始编写 AJAX 应用时，我才发现我对 JavaScript 的了解有多么欠缺。这种新一代的 Web 应用复杂 的交互特性要求使用一种完全不同的方式来编写 JavaScript 代
3、码。这些都是非常严肃的 JavaScript 应用！我们以往那种漫不经心编写脚本的方法不灵了。 面向对象的编程(OOP)这种方法广泛用于多种 JavaScript 库，采用这种方法可使代码库更加 易于管理和维护。JavaScript 支持 OOP，但它的支持方式同流行的 Microsoft .NET 框架下 的 C+、C#、Visual Basic等语言完全不同，所以，大量使用这些语言的开发者起初可能 会发现，JavaScript 中的 OOP 比较怪异，同直觉不符。我写这篇文章就是要对 JavaScript 到底是如何支持面向对象编程的以及如何高效利用这种支进行面向对象的 JavaScrip
4、t 开发 进行深入讨论。接下来让我们开始谈谈对象（除了对象还能有别的吗？）吧。 JavaScript 对象是字典 在 C+或 C#中，当谈及对象时，我们指的是类或者结构的实例。对象根据实例化出它的模 版（也即，类）的不同而具有不同的属性和方法。JavaScript 对象不是这样的。在 JavaScript 中，对象仅仅是 name/value 对的集合，我们可以把 JavaScript 对象看作字典，字 典中的键为字符串。我们可以用我们熟悉的“.“ (点)操作符或者一般用于字典的“操作符， 来获取或者设置对象的属性。下面的代码片段 1 var userObject = new Object()
5、; 2 userObject.lastLoginTime = new Date();3 alert(userObject.lastLoginTime);同这段代码所做的完全是同样的事情： 1 var userObject = ; / equivalent to new Object() 2 userObject“lastLoginTime“ = new Date();3 alert(userObject“lastLoginTime“);我们还可以用这样的方式，直接在 userObject 的定义中定义 lastLoginTime 属性： 1 var userObject = “lastLogi
6、nTime“: new Date() ; 2 alert(userObject.lastLoginTime);请注意这同 C# 3.0 的对象初始化表达式是多么的相似。另外，熟悉 Python 的读者会发现， 在第二段和第三段代码中，我们实例化 userObject 的方式就是 Python 中指定字典的方式。 这里唯一的区别的就是，JavaScript 中的对象/字典只接受字符串作为键，而 Python 中字典 则无此限制。 这些例子也表明，同 C+或者 C#对象相比，JavaScript 对象是多么地更加具有可塑性。属 性 lastLoginTime 不必事先声明，如果在使用这个属性的时候
7、 userObject 还不具有以此为名 的属性，就会在 userObject 中把这个属性添加进来。如果记住了 JavaScript 对象就是字典的 话，你就不会对此大惊小怪了 毕竟我们随时都可以把新键（及其对应的值）添加到 字典中去。 JavaScript 对象的属性就是这个样子的。那么，JavaScript 对象的方法呢？和属性一样， JavaScript 仍然和 C+/C#不同。为了理解对象的方法，就需要首先仔细看看 JavaScript 函 数。 JavaScript 中的函数具有首要地位 在许多编程语言中，函数和对象一般都认为是两种不同的东西。可在 JavaScript 中，它们
8、之间的区别就没有那么明显了 JavaScript 中的函数实际上就是对象，只不过这个对象 具有同其相关联的一段可执行代码。请看下面这段再普通不过的代码： 1 function func(x) 2 alert(x);3 4 func(“blah“); 这是 JavaScript 中定义函数最常用的方式了。但是，你还可以先创建一个匿名函数对象再 将该对象赋值给变量 func，也即，象下面那样，定义出完全相同的函数 1 var func = function(x) 2 alert(x);3 ; 4 func(“blah2“); 或者甚至通过使用 Function 构造器，向下面这样来定义它： 1 v
9、ar func = new Function(“x“, “alert(x);“); 2 func(“blah3“); 这表明，函数实际上就是一个支持函数调用操作的对象。最后这种使用 Function 构造器来 定义函数的方式并不常用，但却为我们带来很多很有趣的可能，其原因可能你也已经发现 了，在这种函数定义的方式中，函数体只是 Function 构造器的一个字符串型的参数。这就 意味着，你可以在 JavaScript 运行的时候构造出任意的函数。 要进一步证明函数是对象，你可以就象为任何其它 JavaScript 对象一样，为函数设置或添 加属性： 1 function sayHi(x) 2
10、alert(“Hi, “ + x + “!“);3 4 5 sayHi.text = “Hello World!“;6 sayHi“text2“ = “Hello World. again.“;7 8 alert(sayHi“text“); / displays “Hello World!“9 alert(sayHi.text2); / displays “Hello World. again.“作为对象，函数还可以赋值给变量、作为参数传递给其它函数、作为其它函数的返回值、 保存为对象的属性或数组中的一员等等。图 1 所示为其中一例。 图 1 函数在 JavaScript 具有首要地位01 /
11、 assign an anonymous function to a variable 02 var greet = function(x) 03 alert(“Hello, “ + x); 04 ;05 06 greet(“MSDN readers“);07 08 / passing a function as an argument to another09 function square(x) 10 return x * x;11 12 13 function operateOn(num, func) 14 return func(num);15 16 17 / displays 256
12、 18 alert(operateOn(16, square);19 20 / functions as return values21 function makeIncrementer() 22 return function(x) return x + 1; ;23 24 25 var inc = makeIncrementer(); 26 / displays 827 alert(inc(7); 28 29 / functions stored as array elements 30 var arr = ;31 arr0 = function(x) return x * x; ; 32
13、 arr1 = arr0(2);33 arr2 = arr0(arr1); 34 arr3 = arr0(arr2);35 36 / displays 25637 alert(arr3); 38 39 / functions as object properties 40 var obj = “toString“ : function() return “This is an object.“; ;41 42 / calls obj.toString()43 alert(obj);记住这一点后，为对象添加方法就简单了，只要选择一个函数名并把一个函数赋值为这个 函数名即可。接下来我通过将三个匿名
14、函数分别赋值给各自相应的方法名，为一个对象定 义了三个方法： 01 var myDog = 02 “name“ : “Spot“,03 “bark“ : function() alert(“Woof!“); , 04 “displayFullName“ : function() 05 alert(this.name + “ The Alpha Dog“); 06 ,07 08 “chaseMrPostman“: function() 09 / implementation beyond the scope of this article 10 11; 12 13 myDog.displayFu
15、llName(); 14 myDog.bark(); / Woof! 函数 displayFullName 中“this“关键字的用法对 C+/C#开发者来说并不陌生 该方法是 通过哪个对象调用的，它指的就是哪个对象（使用 Visual Basic 的开发者也应该熟悉这种 用法 只不过“this“在 Visual Basic 称作“Me“） 。因此在上面的例子中，displayFullName 中“this“的值指的就是 myDog 对象。但是，“this“的值不是静态的。如果通过别的对象对函 数进行调用，“this“的值也会随之指向这个别的对象，如图 2 所示。 图 2 “this”随着对象的改变而改变01 function displayQuote() 02 / the value of “this“ will change; depends on03 / which object it is called through 04 alert(this.memorableQuote); 05 06 07 var williamShakespeare = 08 “memorableQuote“: “It is a wise father that knows his own child.“,
