| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 944 人关注过本帖
标题:面向对象 JavaScript 框架:Modello
取消只看楼主 加入收藏
kenxu
Rank: 1
等 级:新手上路
帖 子:2
专家分:0
注 册:2006-4-24
收藏
 问题点数:0 回复次数:0 
面向对象 JavaScript 框架:Modello

首先声明:prototype != [url=http://prototype.conio.net]Prototype[/url]。前者是指 JavaScript 中用来实现继承的东东,后者是大名鼎鼎的 JavaScript 可重用基础库。

JavaScript 让人又爱又恨。爱的是她使用起来非常方便,三两个语句就可以实现一个用户交互操作。恨的是她太过灵活,又没有标准的类库,以致于在大型的项目中使用和维护起来非常困难。

相信很多人初学 JavaScript 的人都领教过 prototype 的晦涩,特别是对于有过其它面向对象编程语言使用经验的程序员来说,prototype 的继承机制大大地限制了他们设计技巧。

一种编程语言决定一种思维方式。同一个模型如果用 C 语言来实现,你只会小心翼翼地把玩内存块和指针;如果用 java 来实现,你可以轻轻松松地使用类来描绘这个模型中的各个实物。

在 JavaScript 中,你想创建一个新类,并继承一个现有的类。你必须首先生成父类的一个实例,然后将这个实例设为子类构造函数的 prototype。这是一种奇怪的思维方式,我明明在设计类,怎么我必须创建实例呢?在这个实例的创建过程中会不会发生我意想不到的事情呢?

很多人试图避开这个奇怪的语法,我也是其中之一。方法无非就是编写一个函数来封装这个继承过程。这样的方法有很多,本人觉得比较好的是 json 作者在文章 [url=http://www.crockford.com/javascript/inheritance.html]《Classical Inheritance in JavaScript》[/url] 中提到的 inherits 方法。

我的想法是,干脆不用 prototype,使用现有的语言设施类模拟整个构造实例的过程,从而实现真正意义上的继承,甚至多继承,接口等等。[url=http://modello.sourceforge.net]Modello[/url] 就是基于这种思想写出来的。

[url=http://modello.sourceforge.net]Modello[/url] 不仅在功能上实现了完整的面向对象支持,还从美学角度上加以考虑。如果是找女朋友,首先要考虑漂亮,然后再考虑简单;如果是选择编程语言,则要反过来(仅代表个人观点)。因为程序是由人写,给人看的。简单的语法,学起来容易上手,写起来效率高,看起来易懂,所谓“望文生义”;优美的语法可以给写程序和读程序的人带来乐趣和美感。

除此之外,和现有标准、现有工具兼容也是很重要的。[url=http://modello.sourceforge.net]Modello[/url] 兼容用 prototype 方式编写的类,兼容用 [url=http://prototype.conio.net]Prototype[/url] 方式编写的类。

好了,下面通过例子来说明:


<pre>
// 创建一个类
// 兼容 Prototype 的语法
var C1 = Class.create();


// 单继承
var C2 = Class.create(C1);


// 多继承
var C4 = Class.create(C1, C2);


// 设计类
C4.construct = function ($self, $class) {


// 用 var 关键字来声明私有属性
var _age = '';


// 用 this 关键字来声明公有属性
this.name = '';


// 声明初始化函数
this.initialize = function () {
// 使用 $self.superN 来访问父类公有属性
$self.super0.initialize.call(this); // 调用 C1 的初始化函数
$self.super1.initialize.call(this); // 调用 C2 的初始化函数
}
}


// 创建实例
var obj = new C4;
</pre>


下面来个复杂一点的例子,该例子改写自 Atlas 的 Interface 例子。


<pre>
// IPet 接口
var IPet = Class.create();
IPet.construct = function() {
this.returnFriendlyName = Class.abstractMethod;
}

// Animal 类
var Animal = Class.create();
Animal.construct = function() {
var _name;

this.initialize = function(name) {
_name = name;
}
this.returnName = function() {
return _name;
}
this.toStringCustom = function() {
return this.returnName();
}
this.speak = Class.abstractMethod;
}

// Pet 类,继承自 Animal,实现 IPet
var Pet = Class.create(Animal, IPet);
Pet.construct = function($self) {
var _friendlyName;

this.initialize = function(name, friendlyName) {
$self.super0.initialize.call(this, name);
_friendlyName = friendlyName;
}
this.returnFriendlyName = function() {
return _friendlyName;
}
}

// Cat 类,继承自 Pet
var Cat = Class.create(Pet);
Cat.construct = function($self) {
this.initialize = function(friendlyName) {
$self.super0.initialize.call(this, 'Cat', friendlyName);
}
this.speak = function() {
alert('meow');
}
this.toStringCustom = function() {
return 'Pet ' + $self.super0.toStringCustom.call(this);
}
}

// Felix 类,继承自 Cat
var Felix = Class.create(Cat);
Felix.construct = function($self) {
this.initialize = function() {
$self.super0.initialize.call(this, 'Felix');
}
this.toStringCustom = function() {
return $self.super0.toStringCustom.call(this) + ' ... its Felix!';
}
}

// Dog 类,继承自 Pet
var Dog = Class.create(Pet);
Dog.construct = function($self) {
this.initialize = function(friendlyName) {
$self.super0.initialize.call(this, 'Dog', friendlyName);
}
this.speak = function() {
alert('woof');
}
}

// Tiger 类,继承自 Animal
var Tiger = Class.create(Animal);
Tiger.construct = function($self) {
this.initialize = function() {
$self.super0.initialize.call(this, 'Tiger');
}
this.speak = function() {
alert('grrr');
}
}
</pre>


运行这个例子:[url=http://www.ajaxwing.com/examples/interface.html]Modello Example: Interface[/url]

关于 [url=http://modello.sourceforge.net]Modello[/url],这里有更详细的介绍。[url=http://modello.sourceforge.net]Modello[/url] 的原意为“大型艺术作品的模型”,希望 [url=http://modello.sourceforge.net]Modello[/url] 能够帮助你编写高质量的 JavaScript 代码。

搜索更多相关主题的帖子: JavaScript 面向对象 Modello prototype 框架 
2006-04-24 20:03
快速回复:面向对象 JavaScript 框架:Modello
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.028045 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved