zoukankan      html  css  js  c++  java
  • 轻松学习JavaScript十二:JavaScript基于面向对象之创建对象(一)

            这一次我们深入的学习一下JavaScript面向对象技术,在学习之前,必要的说明一下一些面向对象的一些术语。

    这也是全部面对对象语言所拥有的共同点。有这样几个面向对象术语:

           对象

           ECMA-262把对象(object)定义为“属性的无序集合,每一个属性存放一个原始值、对象或函数”。

    严格来说。这意味

    着对象是无特定顺序的值的数组。虽然ECMAScript如此定义对象。但它更通用的定义是基于代码的名词(人、地点或

    事物)的表示。

           类

           每一个对象都由类定义,能够把类看做对象的配方。类不仅要定义对象的接口(interface)(开发人员訪问的属性和方

    法),还要定义对象的内部工作(使属性和方法发挥作用的代码)。编译器和解释程序都依据类的说明构建对象。

           实例

           程序使用类创建对象时,生成的对象叫作类的实例(instance)。对类生成的对象的个数的唯一限制来自于执行

    代码的机器的物理内存。每一个实例的行为同样,但实例处理一组独立的数据。由类创建对象实例的过程叫做实例化

    (instantiation)。

           在前面的章节我们提到过,ECMAScript并没有正式的类。相反。ECMA-262把对象定义描写叙述为对象的配方。这

    是 ECMAScript逻辑上的一种折中方案,由于对象定义实际上是对象自身。即使类并不真正存在。我们也把对象定义

    叫做类,由于大多数开发人员对此术语更熟悉,并且从功能上说,两者是等价的。

           使用提前定义对象仅仅是面向对象语言的能力的一部分,它真正强大之处在于可以创建自己专用的对象。

    ECMAScript 拥有非常多创建对象的方法。

           一原始方式

           由于对象的属性能够在对象创建后动态定义。全部很多开发人员都在JavaScript 最初引入时编写类似以下的代码:

    var Car = new Object();
    Car.color = "blue";
    Car.doors = 4;
    Car.mpg = 25;
    Car.showColor = function() {
        return this.color;
    };
    document.write(Car.showColor());//输出:blue

           在上面的代码中。创建对象Car。然后给它设置几个属性:它的颜色是蓝色,有四个门。每加仑油能够跑 25 英

    里。

    最后一个属性实际上是指向函数的指针,意味着该属性是个方法。运行这段代码后。就能够使用对象Car。只是

    这里有一个问题,就是可能须要创建多个Car的实例。这样就造成了我们会反复很多类似的代码。这样会非常麻烦。

           二工厂方式

           要解上述的多个类似对象声明的问题,开发人员创造了能创建并返回特定类型的对象的工厂方式。这样的方式就是为

    了解决实例化对象产生大量反复的问题。

           (1)无參数的工厂方式

           比如,函数createCar()可用于封装前面列出的创建Car对象的操作:

    function createCar() {
    var TempCar = new Object();
    TempCar.color = "blue";
    TempCar.doors = 4;
    TempCar.mpg = 25;
    TempCar.showColor = function() {
           return this.color;
      };
      return TempCar;
    };
    var Car1 = createCar();
    var Car2 = createCar();
    document.write(Car1.showColor()+"<br/>");//输出:blue
    document.write(Car2.showColor());//输出:blue

           在这里,第一个样例中的全部代码都包括在createCar()函数中。

    此外,另一行额外的代码。返回TempCar 对

    象作为函数值。

    调用此函数,将创建新对象,并赋予它全部必要的属性,复制出一个我们在前面说明过的Car对象。

    因此,通过这样的方法。我们能够非常easy地创建Car对象的两个版本号(Car1和 Car2),它们的属性全然一样。

           (2)有參数的工厂方式

           我们还能够改动createCar()函数,给它传递各个属性的默认值,而不是简单地赋予属性默认值:

    function createCar(Color,Doors,Mpg) {
      var TempCar = new Object();
      TempCar.color = Color;
      TempCar.doors = Doors;
      TempCar.mpg = Mpg;
      TempCar.showColor = function() {
           return this.color;
      };
      return TempCar;
    };
    var Car1 = createCar("red",4,23);
    var Car2 = createCar("blue",3,25);
    document.write(Car1.showColor()+"<br/>");//输出:red
    document.write(Car2.showColor());//输出:blue

           给createCar()函数加上參数。就可以为要创建的Car对象的color、doors 和mpg属性赋值。

    这使两个对象具有同样

    的属性,却有不同的属性值。

           工厂方式攻克了反复实例化的问题,可是还是有一个问题,那就是前面的样例中,每次调用函数createCar()。都

    要创建新函数showColor(),意味着每一个对象都有自己的 showColor() 版本号。而其实,每一个对象都共享同一个函数。

    有些开发人员在工厂函数外定义对象的方法,然后通过属性指向该方法,从而避免这个问题:

    function showColor() {
         return this.color;
    };
    function createCar(Color,Doors,Mpg) {
      var TempCar = new Object();
      TempCar.color = Color;
      TempCar.doors = Doors;
      TempCar.mpg = Mpg;
      TempCar.showColor = showColor;
      return TempCar;
    };
    var Car1 = createCar("red",4,23);
    var Car2 = createCar("blue",3,25);
    document.write(Car1.showColor()+"<br/>");//输出:red
    document.write(Car2.showColor());//输出:blue

           在上面这段重写的代码中,在函数 createCar()之前定义了函数 showColor()。在createCar()内部,赋予对象一个

    指向已经存在的 showColor() 函数的指针。从功能上讲,这样攻克了反复创建函数对象的问题;可是从语义上讲。该

    函数不太像是对象的方法。全部这些问题都引发了开发人员定义的构造函数的出现。

           三构造函数方式

           创建构造函数就像创建工厂方式的函数一样easy。第一步选择构造函数的名字。依据惯例。这个名字的首字母大

    写,以使它与首字母一般是小写的变量名分开。

    除了这点不同,构造函数看起来非常像工厂方式的函数。请看以下的例

    子:

    function Car(Color,Doors,Mpg) {
      this.color = Color;
      this.doors = Doors;
      this.mpg = Mpg;
      this.showColor = function() {
           return this.color;
      };
    };
    var Car1 = new Car("red",4,23);
    var Car2 = new Car("blue",3,25);
    document.write(Car1.showColor()+"<br/>");//输出:red
    document.write(Car2.showColor());//输出:blue

           以下为您解释上面的代码与工厂方式的区别。

    首先在构造函数内没有创建对象。而是使用thiskeyword。使用new运

    算符构造函数时。在运行第一行代码前先创建一个对象,仅仅实用this才干訪问该对象。然后能够直接赋予this属性。默

    认情况下是构造函数的返回值(不必明白使用 return 运算符)。如今。用new运算符和对象名Car创建对象,就更像

     ECMAScript 中一般对象的创建方式了。

          就像工厂方式的函数,构造函数会反复生成函数。为每一个对象都创建独立的函数版本号。只是,与工厂方式的函数

    相似,也能够用外部函数重写构造函数,相同地。这么做语义上无不论什么意义。这正是以下要讲的原型方式的优势所

    在。

    在下篇博客会具体的分析面向对象的原型方式以及其它综合的方式。

  • 相关阅读:
    08简单推导:手机尾号评分
    07简单推导:生日蜡烛
    06普通推导
    05简单推导:猴子吃桃
    简单推导
    03map用法
    List题目
    02List的使用
    01基础知识
    HDU
  • 原文地址:https://www.cnblogs.com/gccbuaa/p/6910155.html
Copyright © 2011-2022 走看看