阅读文章

Dojo 之 面向对象

[日期:2008-04-17] 来源:  作者: [字体: ]

     作者:Flyingis
  
   面向对象三大特性:封装、继承、多态。在熟悉了Java/C#/C++这些高级面向对象语言的语法结构后,我们或多或少会对JavaScript脚本语言的面向对象感到一些不适,function、prototype、call、apply……
  
   如果真不了解JavaScript或这几个关键字,先看几篇简文:
  
  1.JavaScript 基本组成
  2.ECMAScript 基础
  3.JavaScript 中的对象
  4.JavaScript 中的继承
  
   为了消除这种对JavaScript面向对象语法的不适,众多js库都构建了更符合传统OO编程思想的代码框架,如prototype、mootools等等,引用mootools文档中创建对象的例子
  var Animal = new Class({
   initialize: function(age){
   this.age = age;
   }
  });
  var Cat = Animal.extend({
   initialize: function(name, age){
   this.parent(age); //将调用Animal的initialize方法;
   this.name = name;
   }
  });
  var myCat = new Cat('Micia', 20);
  alert(myCat.name); //显示 'Micia'
  alert(myCat.age); //显示 20
   Dojo作为一个强大的JavaScript工具箱,有它自己面向对象的开发方式,用declare解决了对象的创建和继承的问题,文档中的例子:
  dojo.declare("my.classes.bar", my.classes.foo, {
   // properties to be added to the class prototype
   someValue: 2,
   // initialization function
   constructor: function(){
   this.myComplicatedObject = new ReallyComplicatedObject();
   },
   // other functions
   someMethod: function(){
   doStuff();
   }
  );
   declare的第一个参数是对象名称,最后一个参数指定在这个对象里要添加的内容,包括函数和属性,写个例子
  dojo.declare("Apple", null, {
   price: 5,
   constructor: function(weight) {
   this.total = weight * this.price;
   },
   print: function() {
   alert("The total price is " + this.total);
   }
   }
  );
  var myapple = new Apple(10);
  myapple.print(); //输出结果:"The total price is 50"
   上例通过declare创建了一个Apple对象,JavaScript本身没有类的概念,可以使用对象本身来创建新的对象myapple,通过构造函数的参数值计算苹果的总价,print函数输出结果,非常形象的构建了一个Apple“类”,非常容易理解。要注意的是,这里如果声明默认构造函数,"new Apple(10)"将直接执行默认构造函数,带参数的构造函数就被忽略了,并非C++中顺序执行。
  
   注意dojo.declare第二个参数,如果创建一个独立的新对象,可以设为null,当需要从其他一个或多个对象继承时,则为对象名称,这样就方便的实现了对象继承。多个对象继承,declare第二个参数为一数组,第一个元素为原型父对象,其他的为mixin对象,通过代码来理解。
  <script>
   dojo.declare("Apple", null, {
   price : 5,
   constructor : function(weight) {
   this.total = weight * this.price;
   },
  // constructor : function() {
  // alert("Create Apple !");
  // },
   print : function() {
   alert("The total price is " + this.total);
   }
   });
   dojo.declare("AppleTree", null, {
   constructor : function() {
   alert("Create AppleTree !");
   },
   print : function() {
   alert("This is an apple tree");
   },
   additional : function() {
   alert("This is a mixin class");
   }
   });
  
   dojo.declare("GreenApple", [Apple, AppleTree], {
   constructor : function() {
   alert("Getting a green apple");
   }
   });
  </script>
   创建一个GreenApple对象,测试alert执行顺序!mixin对象的方法将覆盖之前对象中的同名函数,除非子对象也声明了同名函数print。 //输出
  //"The height of the tree is #ff0000"
  //"Getting a green apple"
  var gapple = new GreenApple();
  //输出,覆盖了Apple对象的print
  //"This is an apple tree"
  gapple.print();
  //"This is a mixin class"
  gapple.additional();
   dojo/_base/_loader/bootstrap.js有专门的mixin函数,用于对象的拷贝,将一个创建好的对象拷贝到新的对象中 var copy = dojo.mixin({}, new Apple(2));
  copy.print();
   print输出结果是"The total price is 10",mixin参数一定是创建好的对象实例,否则出错!dojo.extend则可以将一个或多个对象的属性、方法拷贝到一个原型上,通过prototype实现继承,这是继承的另外一种方式。
  
   通过declare、mixin、extend,dojo给我们提供了一种方便的对象创建与扩展机制,一般情况下够用了,感觉还是比较方便,使用时也存在一些限制,翻翻源代码就能理解。这里主要是要知道dojo是如何面向对象的,方便我们更好的理解dojo基础功能,及dijit和dojox,dojo最为强大还是它的widgets。本文涉及的js源码:
  mixin:dojo/_base/_loader/bootstrap.js
  extend:dojo/_base/lang.js
  declare:dojo/_base/declare.js  


阅读:
录入:blue1000

评论 】 【 推荐 】 【 打印
上一篇:WCF从理论到实践(15):响应变化
下一篇:还叫"初识复合控件"
相关文章      
本文评论
发表评论


点评: 字数
姓名:

  • 尊重网上道德,遵守中华人民共和国的各项有关法律法规
  • 承担一切因您的行为而直接或间接导致的民事或刑事法律责任
  • 本站管理人员有权保留或删除其管辖留言中的任意内容
  • 本站有权在网站内转载或引用您的评论
  • 参与本评论即表明您已经阅读并接受上述条款