面向对象的 javascript 编程及其 scope 处理

《面向对象的 javascript 编程及其 scope 处理》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、页码，1/11面向对象的JavaScript编程及其Scope处理简介：在面向对象的JavaScript编程中，我们常常会将一些数据结构和操作封装成对象以达到继承和重用的目的。然而层层封装和继承再加上JavaScript中特殊关键字this的使用，使得JavaScript当前运行Context看起来非常的混乱。很多developer为了获取运行时正确的Context，常常不得已将function或者Object声明在全局GlobalContext中。零散的声明、复杂的引用再加上客户端代码的不断膨胀，最终使得客户端的JavaScrip

2、t代码变成一场灾难。发布日期：2011年3月28日级别：高级本文首先对JavaScript的机制进行讲解，并结合当前流行的开源JavaScript框架讲解如何在JavaScript中实现面向对象和继承机制；之后本文将对面向对象JavaScript编程中容易引起误解和Scope的几个问题做详细阐述；最后针对面向对象的JavaScript编程中的Scope问题给出几点建议。面向对象和模拟继承JavaScript是一种弱类型解释运行的脚本语言，就语言本身来讲它不是一门面向对象语言。但是我们可以利用一些语言的特性来模拟面向对象编程和继承机制

3、，这所有的一切都需要从JavaScript中的function说起。Function是一个定义一次但可以调用或执行无数次的JavaScript代码片段。Function可以有零个或者多个输入参数和一个返回值，它通常被用来完成一些计算或者事务处理等任务。通常我们这样定义一个function：清单1.Function定义示例functiondistance(x1,y1,x2,y2){vardx=x2-x1;vardy=y2-y1;returnMath.sqrt(dx*dx+dy*dy);}在JavaScript中，function不仅是

4、是一种语法结构，它还可以被作为数据。这意味着它可以被赋值给变量，在对象或数组中的元素的属性存储，或者作为函数参数传递等等。例如：清单2.Function作为数据示例vard=distance;d(1,1,2,2);当在一个object中定义和调用一个function时，这个function被称作该object的一个方法。需要注意的是当这个function被调用时，这个object会以隐含参数的形式传入到function里，function内部可以通过this关键字来引用这个object的属性。例如下面这个例子运行结果calculat

5、or.result的值为2。清单3.This关键字示例varcalculator={operand1:1,operand2:1,compute:function(){页码，2/11this.result=this.operand1+this.operand2;}};calculator.compute();alert(calculator.result);在JavaScript中，对象的创建通常是通过new运算符来完成的。new关键字后面必须是一个可执行的function。例如：清单4.New关键字示例vararray=newArr

6、ay(10);vartoday=newDate();当上面这条创建语句被执行时，首先会创建一个空的对象赋给前面的变量，然后再调用后面紧跟的function，并将这个空的对象作为隐含参数传入到function内部。这样在function内部就可以通过this关键字引用该对象，做一些对象初始化工作。这样的一个function通常被称为构造方法或者简单构造方法。例如：清单5.构造方法示例functionRectangle(w,h){this.width=w;this.height=h;}varrect1=newRectangle(2,4)

7、;讲到这里我们已经有了对象、函数、作为数据的函数、对象方法和构造函数，于是我们可以使用这些JavaScript的特性模拟写出类似于java风格面向对象的代码。例如：清单6.模拟面向对象示例functionRectangle(w,h){this.width=w;this.height=h;this.area=function(){returnthis.width*this.height;};}varrect1=newRectangle(2,4);rect1.area();上面的代码似乎十分完美，但是看起来似乎还是缺少一些东西。面向对象

8、的精髓是对事物的抽象和继承，以到达代码重用的目的。然而在JavaScript中如何做到这一点呢？在JavaScript中每一个object都有一个prototype属性，这个属性引用了另一个object对象。当你需要读取一个objec