web前端之dojo实际应用及开发四：面向对象开发[关键]（附有源码）

最新推荐文章于 2019-11-30 10:52:39 发布

爸爸去哪了2之熊猫三胞胎

最新推荐文章于 2019-11-30 10:52:39 发布

阅读量1.2k

点赞数 1

本文链接：https://blog.csdn.net/u014785563/article/details/53439010

版权

本文介绍了面向对象编程中的核心概念，如类、成员变量、方法、实例、继承性、封装、抽象和多态性，并结合JavaScript和Dojo框架进行了示例说明。通过dojo.declare创建类，利用this.inherited处理继承，以及dojo.mixin实现多继承和对象扩展。内容还包括Dojo中的模块化开发和页面布局等实践。

摘要由CSDN通过智能技术生成

web前端之dojo实际应用及开发四：面向对象开发[关键]（附有源码）

常用 OOP 术语
为最大限度地利用本文，您至少应该熟悉面向对象编程及其概念。下面简要描述讨论面向对象开发时使用的一些常用术语。需要说明的是，并非所有 OOP 类型都包含每个概念；例如，基于原型的对象语言（比如 JavaScript）中就没有 “类”。
类
在基于类的面向对象开发中，一个类定义组成一个对象的不同属性和函数。类定义用于生成对象的模板，因此它们应该定义这些对象能够遵守的公共属性和动作。类通常由成员变量和方法构成。
成员变量
对象的成员变量就是该对象的属性。在前面提到的汽车示例中，这些属性包括该汽车的 manufacturermodel、color、cubic capacity，等等。
方法
方法是对象能够执行的动作。例如，一辆汽车能够 accelerate、brake、turn，等等。通常，方法将修改成员变量的值。例如，当一个 car 对象使用 accelerate 方法加速时，它的当前速度属性将增加。许多对象都有一个称为 constructor 的方法，该方法在对象创建后立即被调用。
实例或对象
实例或对象即实际对象本身，而不是用于定义对象的模板。例如，您可能有一个名为 myCar 的对象，它拥有一个汽车模板的属性和方法。在一个对象的实例中，属性将实际拥有值。例如，myCar 可能拥有一个值为 silver 的 color 属性，一个值为 2500 的 cubic capacity 属性。一个对象的属性的当前值称为该对象的状态，该状态可以在该对象的整个生命周期内变化。
继承性
在基于类的 OOP 中，继承性是这样一个过程：子类继承其父类的成员变量和方法。除了继承这些属性和动作之外，子类可以定义自己的成员变量和方法，并提供父类的属性的默认值。例如，您可能有一个 FourByFour 类，它是 Car 类的一个子类。这个子类可以将其父类的 drivetrain 属性的默认值设置为 4WD（四轮驱动）。另外，它可以定义另一个名为 transfer case 的属性，该属性仅适用 4x4 汽车；并定义一个方法，该方法允许您更改其他普通车辆上没有的低速档（low range gear）。
封装
在基于类的 OOP 中，成员变量通常被定义为私有变量，以免被从类本身的范围外访问或修改。有一些称为 “修改器” 的特殊方法，它们允许您定义可以检索或修改类中的私有成员函数的值的方法。这些方法（通常称为 getters 和 setters）允许程序员使用隐藏的信息，使应用程序和其他类只能访问某些属性。这种技术通常称为 “封装”。
抽象
抽象是通过只定义那些在您对象的当前上下文中对该对象很重要的属性和方法来减小对象的复杂性的过程。例如，当您定义一个 Car 类时，可以通过定义一辆汽车拥有的、对其他类型的车辆（比如有蓬货车、卡车、摩托车等）也常见的所有属性，来将这个类进一步抽象为一个 Vehicle 类。这样，Car 类将从 Vehicle 类继承这些属性，就像一个 Motorcycle 类或 Van 类那样。
多态性
在 OOP 上下文中，多态性意味着可以从它的超类继承方法，而不必提供所有方法的相同实现。例如，您有两个 Car 类的两个子类，一个用于自动挡汽车（我们称其为 ATCar），另一个用于手动挡汽车（我们称其为 MTCar）。所有 Car 对象都能加速，因此 ATCar 和 MTCar 都将从它们的父类继承 accelerate 方法。但是，在一个 ATCar 中，当引擎达到某个 RPM 级别时，您的 accelerate 方法将自动调用 change gear 方法。结果，您在 ATCar 子类中覆盖了 accelerate 方法的父类定义，而在 MTCar 中，该方法就是子类从 Car 类继承而来的方法。
本文并不是面向对象编程的一个全面指南。如果您不熟悉上述概念，那么在继续阅读本文之前，有必要跳到参考资料部分阅读更多关于 OOP 的资料。

纯 JavaScript 中基本的面向对象示例：

function Car() {
   }
var myCar = new Car();
console.log(myCar);

创建一个实例化对象Car，使用new定义一个新的实例myCar来加载这个Car对象。

function Car() {
    }
Car.prototype.current_speed = 0;

var myCar = new Car();
console.log(myCar);

附加一个成员变量，输出Car {current_speed: 0}
prototype==>原型

加入相应的方法：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>面向对象</title>
    <script type="text/javascript">
    function Car (){
    
        Car.prototype.current_speed=0;
        Car.prototype.accelerate=function(increment){
    
            this.current_speed += increment;
        }
    }
    var myCar=new Car();
    myCar.accelerate(30);
    myCar.accelerate(20);

    console.log(myCar);
    </script>
</head>
<body>

</body>
</html>

输出：Car {current_speed: 50, accelerate: function}

添加一个构造器函数体：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>面向对象</title>
    <script type="text/javascript">
    function Car