脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript类库 → js面向对象 → 面向对象 function

javascript 面向对象编程 function也是类

 更新时间：2009年09月17日 23:20:15   作者：  
function在javascript中用来创建函数或方法，但要想实现面向对象方式的编程，类是不可或缺的角色之一，而且是主角。
但javascript中并没有类概念，所谓的类也是模拟而来，通过函数加闭包模拟出类成员及私有成员(关于闭包可以参见跨越边界: 闭包)。这里我们将用比较平实的方式来了解一下javascript中的”类”，避开一些生硬的原理。

      既然是用function来模拟类，所以编写代码创建类的关键字还是function。我们创建一个座标点类。

    function Point() {
      this.X = 0;
      this.Y = 0;
    };
 
    var zeroPoint = new Point();
    alert("当前座标值( X:" + zeroPoint.X + " , Y:" + zeroPoint.Y + " )");

        image

      大家都知道非静态类成员的访问需要通过对象来完成，所以先new出了一个Point类型对象，再通过该对象完成X和Y轴座标值的访问。从语法上来说，javascript类对象的创建过程和C#等差不多，但实现机制却不相同。这里的new创建出了一个Object，后续的Point()函数执行时将其this指向了这个新的Object对象。Point中的this.X和this.Y是Point类的两个公共成员，所以Point的对象可以直接对它们进行访问。

      说到类成员或对象的成员，免不了要提到可访问性的问题。在javascript的类中，也有public成员和private成员之分，但究其细节却不尽相同。javascript私有成员也是些在类外部不可以通过对象进行操作的成员，其实在类的内部成员之间私有成员也不定能被访问。在类的内部一般只有私有成员和私有成员之间可以互相的访问，你可以认为其它成员权限不够不能操作这些隐私的东西，但如果你有特权，那就不一样了，管它私有公开照用不误。私有成员变量和普通变量声明一样，用var关键字，私有方法可以用var声明变量来接收方法对象，也可以像普通方法那样去构建。

    function Lady() {
      var age = 30;
      var name = "菜花";
 
      var think = function() {
        alert("其实我今年" + age + "岁。");
      };
      
      function fancy(){
        alert("幻想变成20岁。");
      };
 
      this.Introduce = function() {
        alert("我叫" + name + " , 今年20岁。");
      };
    };
 
    var younglady = new Lady();
    alert(younglady.age);//结果undefined
    younglady.think(); //不支持
    younglady.fancy(); //不支持

      上面是一个Lady类，age、think、fancy都是私有成员，think和fancy方法可以访问age和name，think和fancy两个方法也可以互相进行调用。但它们是私有的，所以创建出来的youngLady对象并不能调用到age、think和fancy，当然也不能调用到name。如果私有成员只能互相之间调用，其实也就失去了私有成员存在的意义。javascript提供特权成员可以建立外界和私有成员互通的桥梁。特权成员是公共成员的一种，公共成员有普通公共成员、特权成员和对象公共成员。

      特权成员就是在类中用this.XX的方式建立的成员，它们可以通过对象来被调用，它们也可以访问私有成员，可以建立私有成员被访问的通道。

    function Lady() {
      var age = 30;
      this.Name = "菜花";
 
      var think = function() {
        alert("其实我今年" + age + "岁。");
      };
 
      function fancy() {
        alert("幻想变成20岁。");
      };
 
      this.Introduce = function() {
        alert("我叫" + this.Name + " , 今年" + age + "岁。");
      };
    };
 
    var younglady = new Lady();
    younglady.Introduce(); //Introduce

        image

      普通公共成员的创建，不在类的里面来编码，而是通过类的prototype来创建。添加普通公共成员都直接添加到类的prototype中，而prototype就是一个像JSON对象一样的成员集对象。当我们进行对象创建时，可以认为会将类prototype中的成员整体copy入新的Object对象中。

    var younglady = new Lady();
    younglady.Introduce(); //Introduce
 
    Lady.prototype.Hobby = "上网";
    Lady.prototype.GetName = function() {
      return this.Name;
    };
    
    var lady2 = new Lady();
    alert(lady2.GetName());
    alert(lady2.Hobby);

      上面代码通过prototype为Lady类添加了普通公共成员GetName方法和Hobby属性，因为是公共成员，所以它们可以和原先定意在类中的特权成员进行互相访问。因为公共成员可以互相访问。对上述代码做些修改。如下。

    var younglady = new Lady();
 
    Lady.prototype.Hobby = "上网";
    Lady.prototype.GetName = function() {
      return this.Name;
    };
 
    alert(younglady.GetName());
    alert(younglady.Hobby);

      先创建出Lady对象，再修改类成员，先前创建好的对象也具有了新的成员。这就是prototype做为类原型所带来的好处，这里简单理解，可以认为prototype是类对象的模版，模版的修改会影响到所有该类对象。

      在添加普通成员的时候也可以来个批量的添加，直接用一个新的JSON对象来赋给prototype就可以了。但是要注意，现在是将原先的prototype进行了替换，在替换之前创建的对象引用的是旧的prototype对象，所以对prototype替换之前创建的对象不会有Hobby和GetName成员。

    Lady.prototype = {
      Hobby: "上网",
      GetName: function() {
        return this.Name;
      }
    };
    var younglady = new Lady();
    alert(younglady.GetName());
    alert(younglady.Hobby);

      除了在构建类时可以添加公共成员，还可以对对象直接进行成员操作。这在本小系列第二篇文章里有描述。这里做一下补充，对对象直接添加的成员，也是一种公共成员，这些成员也可以和类中原先具有的公共成员进行访问。

    younglady.SetName = function(name) {
      this.Name = name;
    };
    younglady.SetName("菜明");
    alert(younglady.GetName());

以上说了一下类成员的东西，下次再说说类继承相关的东西。(如有不当说法请指正)

您可能感兴趣的文章:

相关文章

  • 改变javascript函数内部this指针指向的三种方法

    改变javascript函数内部this指针指向的三种方法

    javascript 的this 值，真的是非常的莫名奇妙。我一直被搞的很头晕，也许正是这个this，让大多数人感觉js 非常的莫名其妙。
    2010-04-04
  • 学习面向对象之面向对象的术语

    学习面向对象之面向对象的术语

    学习面向对象之面向对象的术语，学习面向对象设计的朋友可以参考下。
    2010-11-11
  • javascript对象小结

    javascript对象小结

    这次主要测试了几个主要的对象，包括string,date,数组。用date对象做了个类似倒计时的功能，呵呵
    2010-07-07
  • javascript new fun的执行过程

    javascript new fun的执行过程

    new fun的执行过程分析，学习面向对象的朋友可以参考下。
    2010-08-08
  • JavaScript定义类或函数的几种方式小结

    JavaScript定义类或函数的几种方式小结

    js中不论是定义类或者函数，很多朋友想将代码写的更专业，更方便扩展等，那么就可以参考这篇文章了，最好是总结，建议大家收藏下。
    2011-01-01
  • JavaScript对象链式操作代码(jquery)

    JavaScript对象链式操作代码(jquery)

    自从使用了jQuery以后，对它的链式操作很是依赖，以至于常常觉得其他库不好用。。
    2010-07-07
  • JS继承 笔记

    JS继承 笔记

    JavaScript中没有类的概念，与类相关的继承的概念更是无从谈起，但是我们可以通过特殊的语法来模拟面向对象语言中的继承。
    2011-07-07
  • Javascript面向对象编程

    Javascript面向对象编程

    Javascript是一种面向(基于)对象的动态脚本语言，是一种基于对象(Object)和事件驱动(EventDriven)并具有安全性能的脚本语言。他具有面向对象语言所特有的各种特性，比如封装、继承及多态等
    2012-03-03
  • 老鱼 浅谈javascript面向对象编程

    老鱼 浅谈javascript面向对象编程

    这周心血来潮，翻看了现在比较流行的几个JS脚本框架的底层代码，虽然是走马观花，但也受益良多，感叹先人们的伟大……
    2010-03-03
  • JavaScript 构造函数 面相对象学习必备知识

    JavaScript 构造函数 面相对象学习必备知识

    关于JavaScript构造函数，如今出现了很多JavaScript的框架，例如jQuery、Ext等等这些，这些将JavaScript作为一种面向对象的语言进行编程，那么JavaScript到底是怎么样实现面向对象的一些特征的呢，首先，我们来看看JavaScript怎么样来定义一个构造函数。
    2010-06-06

最新评论